.container,
.covertextcontainer,
.window1,
.window1-shaded,
.window2,
.window2-shaded,
.window3,
.window3-shaded,
.fridge,
.fan,
.rice_cooker,
.clock,
.heater,
.lamp,
.text_bubble,
.speech_bubble,
.speechbubbletext,
.speechbubblesittingroomtext,
.mobile,
.light,
.tv {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.sittingroombgpage {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  display: none;
}
.covertextcontainer {
  top: 60%;
  left: 23%;
}
.covertextcontainer > .covertext {
  color: #fff;
  font-size: 3vw;
  font-family: 'Baloo';
}
.house {
  position: absolute;
  bottom: 0%;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
}
.top-header {
  border-radius: 2.5em;
  border: 6px solid #fff;
  background: rgba(4, 4, 4, 0.35);
  display: inline-flex;
  padding: 1.5em 2em;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
  width: 70%;
}
.top-header > .header_para {
  color: #fff;
  font-family: 'Andika New Basic';
  font-size: 1.2em;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.window1,
.window2,
.window3 {
  cursor: pointer;
}
.window1,
.window1-shaded {
  top: 56%;
  left: 40%;
  width: 10%;
}
.window2,
.window2-shaded {
  top: 56%;
  left: 56%;
  width: 10%;
}
.window3,
.window3-shaded {
  top: 78%;
  left: 39%;
  width: 13%;
}
.bedroomcontainer,
.kitchencontainer,
.sittingroomcontainer {
  display: inline-flex;
  padding: 0.35em 0.6em 0.2em 0.6em;
  justify-content: center;
  align-items: center;
  border-radius: 0.4em;
  border: 2px solid #774b20;
  background: linear-gradient(180deg, #ffed51 0%, #f6af01 100%);
  box-shadow: 4px 4px 1px 0px #fff inset, 0px 2px 2px 0px rgba(43, 43, 43, 0.47);
  position: absolute;
  top: 60%;
  left: 20%;
  transform: translate(-50%, -50%);
}
.kitchencontainer {
  left: 75%;
  top: 55%;
}
.sittingroomcontainer {
  left: 18%;
  top: 80%;
}
.bedroomcontainer > .paratext,
.kitchencontainer > .paratext,
.sittingroomcontainer > .paratext {
  color: #774b20;
  font-family: 'Andika New Basic';
  font-size: 1.5em;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}
.kitchen,
.bedroom {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  display: none;
}
.fridge,
.fan {
  top: 56%;
  left: 83%;
  width: 40%;
  cursor: pointer;
  display: none;
}
.fan {
  width: 15%;
  top: 52%;
}
.rice_cooker,
.clock {
  top: 54%;
  left: 51%;
  width: 13%;
  cursor: pointer;
  display: none;
}
.rice_cooker{
  top: 50%;
}
.clock {
  left: 60%;
  top: 30%;
  width: 8%;
  height: auto;
}
.heater,
.lamp {
  top: 59%;
  left: 26%;
  width: 10%;
  cursor: pointer;
  display: none;
}
.lamp {
  left: 15%;
  top: 46%;
}
.kitchenheadercontainer,
.sittingroomheadercontainer,
.bedroomheadercontainer {
  display: inline-flex;
  padding: 1em;
  justify-content: center;
  align-items: center;
  border-radius: 1.7em;
  border: 6px solid #fff;
  background: rgba(4, 4, 4, 0.69);
  position: absolute;
  top: 10%;
  left: 50%;
  width: 90%;
  transform: translate(-50%, -50%);
  opacity: 0;
} 
.kitchenheadercontainer > .paratext,
.sittingroomheadercontainer > .paratext,
.bedroomheadercontainer > .paratext {
  color: #fff;
  font-family: 'Andika New Basic';
  font-size: 1.5em;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.heatertextcontainer,
.fridgetextcontainer,
.ricecookertextcontainer,
.fridgetext,
.ricecookertext,
.heatertext,
.tvtextcontainer,
.mobiletextcontainer,
.lighttextcontainer,
.tvtext,
.mobiletext,
.lighttext,
.fantextcontainer,
.fantext,
.clocktextcontainer,
.clocktext,
.lamptextcontainer,
.lamptext {
  width: 50%;
  position: absolute;
  display: none;
}
.fridgetextcontainer,
.fridgetext,
.mobiletextcontainer,
.mobiletext,
.fantextcontainer,
.fantext {
  bottom: 0%;
  right: 1%;
}
.fridgetext,
.mobiletext,
.fantext {
  bottom: 5%;
}
.ricecookertextcontainer,
.heatertextcontainer,
.ricecookertext,
.heatertext,
.tvtextcontainer,
.tvtext,
.lighttextcontainer,
.lighttext,
.clocktextcontainer,
.clocktext,
.lamptextcontainer,
.lamptext {
  top: 74%;
  left: 38%;
  transform: translate(-50%, -50%);
}
.heatertextcontainer,
.heatertext,
.lighttextcontainer,
.lighttext,
.lamptextcontainer,
.lamptext {
  top: 30%;
}
.lamptextcontainer{
  top: 60%;
}
.lamptext {
  top: 60%;
}
.text_bubble {
  width: 50%;
  z-index: 10;
  display: none;
}
.bubbletext,
.bubblesittingroomtext,
.bubblebedroomtext {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 40%;
  z-index: 12;
  display: none;
}
.bubbletext > .paratext,
.bubblesittingroomtext > .paratext,
.bubblebedroomtext > .paratext {
  color: #000;
  text-align: center;
  font-family: 'Andika New Basic';
  font-size: 1.75em;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.buttonblock,
.sittingroombutton,
.bedroombutton {
  display: inline-flex;
  padding: 0.5em;
  justify-content: center;
  align-items: center;
  gap: 3em;
  border-radius: 0.4em;
  border: 6px solid #fff;
  background: linear-gradient(180deg, #ffed51 0%, #f6af01 100%);
  box-shadow: 4.011px 4.011px 1.783px 0px #fff inset,
    0px 1.783px 1.783px 0px rgba(43, 43, 43, 0.47);
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 12;
  cursor: pointer;
  display: none;
}
.buttonblock > p,
.sittingroombutton > p,
.bedroombutton > p {
  font-size: 1.5em;
}
.buttonblock > img,
.sittingroombutton > img,
.bedroombutton > img {
  width: 20%;
}
.girl_blinking {
  position: absolute;
  right: 0%;
  bottom: 0%;
  width: 50%;
  display: none;
}
.speech_bubble,
.speechbubbletext,
.speechbubblesittingroomtext,
.speechbubblebedroomtext {
  top: 30%;
  left: 40%;
  width: 50%;
  z-index: 12;
  display: none;
}
.speechbubbletext,
.speechbubblesittingroomtext,
.speechbubblebedroomtext {
  width: 45%;
  z-index: 13;
}
.speechbubbletext > .paratext,
.speechbubblesittingroomtext > .paratext,
.speechbubblebedroomtext > .paratext {
  font-size: 1.25em;
}
.tv {
  top: 43%;
  left: 54%;
  width: 30%;
  cursor: pointer;
  display: none;
}
.light {
  left: 17%;
  top: 33%;
  width: 5%;
  cursor: pointer;
  display: none;
}
.mobile {
  left: 70%;
  top: 59%;
  width: 9%;
  cursor: pointer;
  display: none;
}
@media screen and (min-aspect-ratio: 4/3) {
  .covertextcontainer > .covertext {
    font-size: 7vh;
  }
  .topheader > .header_para {
    font-size: 3vh;
  }
}