.buttons {
    z-index: 2;
    position: absolute;
    bottom:0;
    right:0;
}

.buttons div {
    cursor: pointer;
    position: relative;
}

.x {
    bottom:150px;
    right:86px;
    width: 57px;
    height: 55px;
}
.x:active {
    background-image: url('/img/xpress.png');
}

.y {
    bottom:155px;
    right:142px;
    width: 61px;
    height: 60px;
}
.y:active {
    background-image: url('/img/ypress.png');
}

.a {
    bottom:215px;
    right:31px;
    width: 57px;
    height: 57px;
}
.a:active {
    background-image: url('/img/apress.png');
}

.b {
    bottom:221px;
    right:88px;
    width: 63px;
    height: 61px;
}
.b:active {
    background-image: url('/img/bpress.png');
}

.startselect {
    position: absolute;
    z-index: 2;
    bottom:0;
    right:0;
}

.startselect div {
    cursor: pointer;
    position: relative;
}

.start {
    bottom:91px;
    right:168px;
    width: 31px;
    height: 31px;
}
.start:active {
    background-image: url('/img/start.png');
}

.select {
    bottom:64px;
    right:168px;
    width: 31px;
    height: 31px;
}
.select:active {
    background-image: url('/img/select.png');
}

.home {
    position: absolute;
    bottom:12px;
    right:456px;
    z-index: 2;
}

.home div {
    cursor: pointer;
    position: relative;
    opacity: 0.7;
}

.homebutton {
    width: 88px;
    height: 58px;
}
.homebutton:active {
    background-image: url('/img/home.png');
}

.arrows {
    position: absolute;
    bottom:0;
    left:0;
    z-index: 2;
}




.arrows div {
    cursor: pointer;
    position: relative;
}

.up {
    bottom:100px;
    left:101px;
    width: 35px;
    height: 35px;
}
.up:active {
    background-color: #ff7d65a6;
    border-radius: 50%;
}

.right {
    bottom:96px;
    left:140px;
    width: 35px;
    height: 35px;
}
.right:active {
    background-color: #ff7d65a6;
    border-radius: 50%;
}

.down {
    bottom:93px;
    left:101px;
    width: 35px;
    height: 35px;
}
.down:active {
    background-color: #ff7d65a6;
    border-radius: 50%;
}

.left {
    bottom:166px;
    left:62px;
    width: 35px;
    height: 35px;
}
.left:active {
    background-color: #ff7d65a6;
    border-radius: 50%;
}

.circlepad {
    position: absolute;
    bottom:306px;
    left:64px;
    z-index: 2;
}

.circlepad div {
    cursor: pointer;
    position: relative;
    opacity: 0.85;
}

.circlepadbutton {
    width: 110px;
    height: 114px;
}
.circlepadbutton:active {
    background-image: url('/img/circlepad.png');
}

.cstick {
    position: absolute;
    bottom:395px;
    right:157px;
    z-index: 2;
}

.cstick div {
    cursor: pointer;
    position: relative;
}

.cstickbutton {
    width:49px;
    height:49px;
}

.cstickbutton:active {
    background-image: url('/img/cstick.png');
}

.threedee-container {
  position: absolute;
  z-index: 2;
  width: 19px;
  height: 112px;
  top:280px;
  right:1px;
}

.slider-knob {
  position: absolute;
  top: 75px;
  width: 19px;
  height: 37px;
  background-image: url('/img/3dslider.png');
  background-size: cover;
  cursor: grab;
}

.musicslider-container {
  position: absolute;
  z-index: 2;
  width: 19px;
  height: 112px;
  top:278px;
  left:1px;
}

.music-knob {
  position: absolute;
  width: 18px;
  height: 39px;
  background-image: url('/img/volumeslider.png');
  background-size: cover;
  cursor: grab;
}