.stage {
    position: relative;
    width: 100%;
}

#UI {
    position: absolute;
    inset: 0;
    z-index: 3;

}

#tvshow,
.scene {
    position: absolute;
    inset: 0;
}


.scene img, .stage img,
#tvshow img {
    width: 100%;
    display: block;
    object-fit: cover; 
}

.hotspot {
    position: absolute;
    display: block;
    background-color: rgba(255, 0, 255, 0.3);

    z-index: 10;
}

/* Break the TV into chunks */
.tv1 {
  top: 20%;
  left: 49%;
  width: 24%;
  height: 32%;
}

.hat1 {
    top: 3%;
    left:12%;
    width:7%;
    height:8%;
}
.hat2 {
    top: 5%;
    left:8%;
    width:7%;
    height:6%; 
}
.hat3 {
    top: 11%;
    left:8%;
    width:14%;
    height:6%; 
}
.hat4 {
    top: 17%;
    left:8%;
    width:11%;
    height:6%; 
}


.hatposter1 {
    top: 11%;
    left:31%;
    width:4%;
    height:6.5%; 
}
.hatposter2 {
    top: 17.5%;
    left:30%;
    width:6%;
    height:3%; 
}