body {
    background-image: url('../asset/pic/nixon/background.png'); 
    background-repeat: no-repeat;
    background-color: rgb(0, 136, 109);
  }
  #desktop{
    position: absolute;
    background-repeat: no-repeat;
  }
  #desktop img{
    left: -10px;
    top: -10px;
    position: absolute;
    z-index: 2;
  }
  #restaurant .customer img {
    position: absolute;
    z-index: 0;
    width: 999px;
    height: 999px;
    top: 88px;
    left: -100px;
  }
  #restaurant .dish img {
    position: absolute;
    top: 750px;
    width: 150px;
    height: 150px;
    z-index: 3;
  }

  #restaurant .empire img {
    position: absolute;
    width: 804px;
    height: 807px;
    top: 305px;
    left: 1052px;
    z-index: 4;
  }

  #nixon img{ /* nixon 16 */
    top: 305px;
    left: 1052px;
    display: none;
  }
  #nixon1 img{ /* 断头台 */
    top: 235px;
    left: 1050px;
    display: none;
  }
  #nixon2 img{ /* 死 */
    top: 235px;
    left: 1050px;
    display: none;
  }
  #dialogueBox {
    position: absolute;
    width: 512px;
    height: 512px;
    top: 50px;
    left: 600px;
  }
  #dialogueBox img{
    position: absolute;
    
    width: 800px;
    height: 800px;
    top: -100px;
    left: -100px;
    display: none;
  }
  #dialogueText {
    position: absolute;
    top: 170px;
    left: 100px;
    width: 400px;
    height: 150px;
    font-size: 25px;
    text-align: center; /* 水平居中 */
    
  }
  #hint {
    position: absolute;
    
    width: 50px;
    height: 50px;
    top: 350px;
    left: 1100px;
    
  }
#hint img{
    position: absolute;
    width: 50px;
    height: 50px;
    z-index: 5;
    display: none;
  }
  #hintpage img{
    position: absolute;
    z-index: 5;
    display: none;
  }
  #customer1 img{ /* 中年男 */
    display: none;
  }
  #customer1-2 img{ /* unhappy中年男 */
    display: none;
  }
  #customer1-3 img{ /* angry中年男 */
    display: none;
  }
  #customer2 img{ /* 小女孩 */
    top:150px !important;
    display: none;
  }
  #customer2-2 img{ /* unhappy小女孩 */
    top:150px !important;
    display: none;
  }
  #customer2-3 img{ /* angry小女孩 */
    top:150px !important;
    display: none;
  }
  #customer3 img{ /* 老奶奶 */
    top:100px !important;
    display: none;
  }
  #customer3-2 img{ /* unhappy老奶奶 */
    top:100px !important;
    display: none;
  }
  #customer3-3 img{ /* unhappy老奶奶 */
    top:100px !important;
    display: none;
  }
  #burger img{ 
    left: -13px;
    top: 682px!important;
    width: 229px!important;
    height: 248px!important;
    display: none;
  }
  #hot_dog img{ 
    left: 201px;
    top: 709px!important;
    width: 229px!important;
    height: 248px!important;
    display: none;
  }
  #apple_pie img{ 
    left: 444px;
    top: 709px!important;
    width: 229px!important;
    height: 248px!important;
    display: none;
  }
  #fried_chicken img{
    left: 692px;
    top: 713px!important;
    width: 229px!important;
    height: 248px!important;
    display: none;
  }
  #pancakes img{
    left: 926px;
    top: 709px!important;
    width: 213px!important;
    height: 233px!important;
    display: none;
  }

/* 定义抖动动画 */
@keyframes shake {
    0%, 100% { transform: translateX(0); }
    10%, 30%, 50%, 70%, 90% { transform: translateX(-10px); }
    20%, 40%, 60%, 80% { transform: translateX(10px); }
}

.shake-animation {
    animation: shake 0.8s; /* 动画持续时间 */
    animation-timing-function: ease-in-out;
}