.root {
  display: grid;
  position: relative;
  grid-gap: var(--spacing-compact);
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(auto-fit, minmax(60px, auto));
  grid-auto-flow: row dense;
  padding: var(--spacing-compact);
  padding-left: 34px;
  background-repeat: no-repeat;
  background-position: left 3px center;
  background-size: 24px;
  border: 2px solid;
  border-radius: 6px;
}

.root > div {
  border-radius: 6px;
  border: 1px solid #eee;
}

/*.bedroom.root > div:nth-child(4) {
  grid-area: 2 / 1 / 4 / 2;
}
.bedroom.root > div:nth-child(5) {
  grid-area: 2 / 2 / 2 / 4;
}
.bedroom.root > div:nth-child(6) {
  grid-area: 3 / 2 / 4 / 3;
}
.bedroom.root > div:nth-child(7) {
  grid-area: 3 / 3 / 3 / 4;
} */

.outside.root > div:nth-child(7) {
  grid-area: 3 / 1 / 5 / 2;
}
.outside.root > div:nth-child(8) {
  grid-area: 3 / 2 / 5 / 3;
}
.outside.root > div:nth-child(9) {
  grid-area: 3 / 3 / 4 / 4;
}
.outside.root > div:nth-child(10) {
  grid-area: 4 / 3 / 5 / 4;
}

.bedroom {
  background-image: url(/images/bed.svg);
  border-color: #1a9cf3;
}

.smallRoom {
  background-image: url(/images/toys.svg);
  border-color: #1ae5f3;
}

.lounge {
  background-image: url(/images/lounge.svg);
  border-color: #bba220;
}

.kitchen {
  background-image: url(/images/kitchen.svg);
  border-color: #ccbfa3;
}

.laundry {
  background-image: url(/images/washing-machine.svg);
  border-color: #bb8a20;
}

.garage {
  background-image: url(/images/garage.svg);
  border-color: #bb2028;
}

.bathroom {
  background-image: url(/images/bathtub.svg);
  border-color: maroon;
}

.outside {
  background-image: url(/images/outside.svg);
  border-color: #25a84a;
}

.config {
  width: 12px;
  height: 12px;
  position: absolute;
  left: 3px;
  bottom: 3px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  background-image: url(/images/config.svg);
  background-color: transparent;
  cursor: pointer;
  border: 0;
  padding: 0;
}

@media (min-width: 475px) {
  .root {
    grid-gap: var(--spacing-normal);
    padding: var(--spacing-normal);
    padding-left: 50px;
    background-size: 32px;
    padding-left: 42px;
  }
}