@keyframes reveal{
  0%{
    clip-path: inset(0 0 100%);
  }

  100%{
    clip-path: inset(0);
  }
}

@keyframes movedown{
  0%{
    transform: translateY(0px);
  }
  
  50%{
    transform: translateY(160px);
    opacity:1;
  }
  
  100%{
    opacity:0;
  }
}

#spage{
  display:none;
}

#sbox{
  width:300px;
}

#revealer1, #revealer2{
  margin-top:-1px;
  width: calc(300px - 30px);
  padding:20px 10px 20px 20px;
  height:120px;
   clip-path: inset(0 0 100%);
}

#revealer1 li, #revealer2 li{
  margin-bottom:10px;
}

#revealer2 p{
  position:absolute;
  margin-top:-3px;
}

#revealer2 ul{
  margin-left:60px;
}

#g1, #g2{
  width:40px;
  position:absolute;
  z-index:10;
  top:-20px;
}

#g1{
  right:320px;
}

#g2{
  right:-10px;
}

#light {
  background-image: url(img/lamp2.png);
  background-size: 60px 110px;
  width:60px;
  aspect-ratio: 30/55;
  margin-bottom:30px;
}

#light:hover{
  background-image: url(img/lamp.png);
}