body {
  font-family: 'Poppins', sans-serif;
}

.hero {
  height: 100vh;
  background: linear-gradient(135deg,#0f2027,#203a43,#2c5364);
}

.house {
  width: 200px;
  margin: 50px auto;
  position: relative;
  height: 200px;
}

.foundation, .walls, .roof, .door {
  opacity: 0;
}

.foundation {
  width: 200px;
  height: 20px;
  background: #555;
  position: absolute;
  bottom: 0;
}

.walls {
  width: 150px;
  height: 100px;
  background: #ddd;
  position: absolute;
  bottom: 20px;
  left: 25px;
}

.roof {
  width: 0;
  height: 0;
  border-left: 100px solid transparent;
  border-right: 100px solid transparent;
  border-bottom: 80px solid #2c5364;
  position: absolute;
  bottom: 120px;
}

.door {
  width: 30px;
  height: 50px;
  background: #333;
  position: absolute;
  bottom: 20px;
  left: 85px;
}

.show {
  opacity: 1;
  transition: all 1s ease;
}