* {
  -webkit-tap-highlight-color:  rgba(255, 255, 255, 0); 
  outline: none;
}
#dpad-panel {
  position: fixed;
  z-index: 1000;
  width: 250px;
  height: 250px;
  top: 100%;
  left: 0;
  margin-left: -50px;
  background-image: url(snap-input-nes.png);
  background-size: 955px 250px;

  -webkit-perspective: 150px;
		 -moz-perspective: 150px;
			 -o-perspective: 150px;
					perspective: 150px;
  perspective-origin: 50% 40%;
              
  padding-top: 25px;
	padding-left: 0;
	
	  user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  transition: margin-top 2s;
}
#dpad-panel.hidden {
  margin-top: 10px;
}
#dpad-panel.visible {
  margin-top: -170px;
}
#dpad {
	position: absolute;
	width: 95px;
	height: 95px;
	top: 52px;
	left: 77px;
	/* border: 1px solid red; */
	cursor: pointer;
	background-size: 955px 250px;
	background-image: url(snap-input-nes.png);
	background-position: 95px 0px;
	-webkit-transform-style: preserve-3d;
		 -moz-transform-style: preserve-3d;
			 -o-transform-style: preserve-3d;
					transform-style: preserve-3d;
}
#button-panel {
  position: fixed;
  z-index: 1000;
  width: 250px;
  height: 250px;
  top: 100%;
  right: 0;
  margin-right: -35px;
  background-image: url(snap-input-nes.png);
  background-position: 345px 0px;
  background-size: 955px 250px;
  transition: margin-top 2s;
}
#button-panel.hidden {
  margin-top: 10px;
}
#button-panel.visible {
  margin-top: -170px;
}
#button-start {
  position: absolute;
  width: 60px;
  height: 40px;
  top: 15px;
  left: 110px;
  /* border: 1px solid red; */
	cursor: pointer;
	background-position: 546px -15px;
	background-size: 955px 250px;
}
#button-b {
	position: absolute;
	width: 65px;
	height: 80px;
	top: 75px;
	left: 75px;
	/* border: 1px solid red; */
	cursor: pointer;
	background-position: 581px -75px;
	background-size: 955px 250px;
	/* background-image: url(img/snap-input-nes.png); */
}
#button-a {
  position: absolute;
	width: 65px;
	height: 80px;
	top: 75px;
	left: 140px;
	/* border: 1px solid red; */
	cursor: pointer;
	background-position: 516px -75px;
	background-size: 955px 250px;
	/* background-image: url(img/snap-input-nes.png); */
}
#button-start.pressed, #button-b.pressed, #button-a.pressed {
  background-image: url(snap-input-nes.png);
}

#dpad-panel span {
  display: inline-block;
  width: 50px;
  height: 50px;
  position: relative;
  cursor: pointer;
  /* border: 1px solid red; */
}

#dpad-panel span#dpad-l { width: 60px; }
#dpad-panel span#dpad-r { width: 60px; }
#dpad-panel span#dpad-m { width: 30px; }
#dpad-panel span#dpad-u { height: 60px; margin-bottom: -10px; }
#dpad-panel span#dpad-d { height: 60px; margin-top: -10px; }



#gameboy-panel {
  position: fixed;
  z-index: 0;
  width: 415px;
  height: 675px;
  top: 50%;
  left: 50%;
  margin-left: -208px;
  margin-top: -315px;
  
  background-image: url(snap-input-gb.png);
  background-size: 600px 675px;

	user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  transition: margin-top 2s;
}
#gameboy-panel.hidden {

}
#gameboy-panel.visible {

}


#dpad-panel.gameboy {
  background-image: none;
  top: 50%;
  left: 50%;
  margin-left: -246px;
  margin-top: 20px;
}
#dpad-panel.gameboy #dpad {
  background-image: url(snap-input-gb.png);
  background-size: 600px 675px;
  background-position: -415px 0px;
}


#button-panel.gameboy {
  background-image: none;
  top: 50%;
  left: 50%;
  right: auto;
  margin-top: 53px;
  margin-left: -50px;
}

#button-panel.gameboy #button-start, 
#button-panel.gameboy #button-b,
#button-panel.gameboy #button-a {
  background-image: url(snap-input-gb.png);
  background-size: 600px 675px;
  background-position: -415px 0px;
}

#button-panel.gameboy #button-start {
  background-position: -415px -200px;
  height: 80px;
  left: 10px;
  top: 58px;
}
#button-panel.gameboy #button-start.pressed {
  background-position: -415px -300px;
}

#button-panel.gameboy #button-b,
#button-panel.gameboy #button-a {
  background-position: -505px -160px;
}
#button-panel.gameboy #button-b.pressed,
#button-panel.gameboy #button-a.pressed {
  background-position: -505px -260px;
}
#button-panel.gameboy #button-b {
  top: 37px;
  left: 100px;
}
#button-panel.gameboy #button-a {
  top: 5px;
  left: 166px;
}


#gameboy-outline {
  border: 4px solid #215e31;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 400px;
  height: 665px;
  margin-top: -312px;
  margin-left: -201px;
  z-index: 9000;
  border-radius: 12px;
  border-bottom-right-radius: 90px;
}

#gameboy-outline-screen {
  width: 256px;
  height: 256px;
  border: 2px solid #215e31;
  position: absolute;
  left: 70px;
  top: 83px;
}
#gameboy-outline-bevel {
  width: 340px;
  height: 304px;
  border: 2px solid #215e31;
  position: absolute;
  left: 26px;
  top: 51px;
  border-radius: 12px;
  border-bottom-right-radius: 48px;
}
#gameboy-outline-a {
  width: 50px;
  height: 50px;
  border: 2px solid #215e31;
  position: absolute;
  left: 315px;
  top: 375px;
  border-radius: 100px;
}
#gameboy-outline-b {
  width: 50px;
  height: 50px;
  border: 2px solid #215e31;
  position: absolute;
  left: 250px;
  top: 409px;
  border-radius: 100px;
}
#gameboy-outline-dt {
  width: 35px;
  height: 35px;
  border: 2px solid #215e31;
  position: absolute;
  left: 60px;
  top: 380px;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-bottom: none;
}
#gameboy-outline-dr {
  width: 35px;
  height: 35px;
  border: 2px solid #215e31;
  position: absolute;
  left: 93px;
  top: 413px;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-left: none;
}
#gameboy-outline-db {
  width: 35px;
  height: 35px;
  border: 2px solid #215e31;
  position: absolute;
  left: 60px;
  top: 446px;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  border-top: none;
}
#gameboy-outline-dl {
  width: 35px;
  height: 35px;
  border: 2px solid #215e31;
  position: absolute;
  left: 27px;
  top: 413px;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  border-right: none;
}

#gameboy-screen-foof {
  width: 256px;
  height: 256px; 
  left: 50%;
  top: 50%;
  margin-left: -128px;
  margin-top: -225px;
  position: fixed;
  background-image: url(snap-input-gb-foof.png);
  z-index: 999;
}