/*#######MENU CSS#######*/
#menu{
  /*cursor:default;*/
  position:absolute;
  z-index:1;
  width:100%;
  height:100%;
  text-align: center;
  font-family: arcadepix;
}

#menuOptions {
  font-family: arcadepix;  
  position:absolute;
  height:300px;
  width:600px;
  left:150px;
  bottom:100px;
}

#menu h1 span {
  color:green;
  animation: blink 1s linear infinite;  
}

@keyframes blink {
  0% {
    opacity: 0;
  }
  50% {
    opacity: .8;
  }
  100% {
    opacity: 1;
  }
}

#gameTitle {
  position:absolute;
  font-family: Courier, sans-serif, monospace;
  font-size: 90px;
  top:100px;
  left:168px;
  animation: upDown 3s linear infinite;  
}

@keyframes upDown {
  0% {
    top: 115px;
  }
  50% {
    top: 160px;
  }
  100% {
    top: 115px;
  }
}

@keyframes flap {
  0% {bottom:-4px;}
  50% {bottom:14px;}
  100% {bottom:-4px;}
}

#qwertyWord div {
  position:absolute;
  animation: flap 500ms linear infinite;
}
/*staggers the animation loop*/
#qwertyWord div:nth-child(6) {
  animation-delay:250ms;
  left:275px;
}
#qwertyWord div:nth-child(5) {
  animation-delay:200ms;
  left:220px;
}
#qwertyWord div:nth-child(4) {
  animation-delay:150ms;
  left:165px;
}
#qwertyWord div:nth-child(3) {
  animation-delay:100ms;
  left:110px;
}
#qwertyWord div:nth-child(2) {
  animation-delay:50ms;
  left:55px;
}
#qwertyWord div:nth-child(1) {
  animation-delay:0ms;
  left:0px;
}

#birdWord {
  position:absolute;
  left:350px;
  bottom:0px;
}

/*####PIPE OBSTACLE CSS####*/
.obs {
  height:600px;
  width:100px;
  position:absolute;
  bottom:0px;
  left:350px;
}

.top {
  position:absolute;
  width:100%;
  height:600px;
  bottom:400px;
}

.bottom {
  position:absolute;
  width:100%;
  height:600px;
  top:400px;
}

.obs h3 {
  position:absolute;
  z-index:2;
  width:100px;
  bottom:50px;
  left:50px;
  color:white;
}