html {
  margin: 0;
  min-height: 100vh;
  min-width: 300px;
  background-color: #333;
  font-family: sans;
}
body {
  box-sizing: border-box;
  margin: 0;
}
header {
  height: 200px;
  background-image: url(stars.png), linear-gradient(to top, #00A, #005);
  background-position: center;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 91% 90%, 81% 87%, 73% 73%, 65% 75%, 54% 69%, 43% 69%, 37% 62%, 30% 53%, 26% 50%, 18% 51%, 12% 57%, 0 60%);
}
main {
  box-sizing: border-box;
  display: flex;
  min-height: calc(100vh - 100px);
  height: 100%;
  margin-top: -100px;
  padding: 9px;
  color: #fff;
	background-image: radial-gradient(circle, #3c2700 0%, #060000 100%);
}

.fire {
  flex: 1 0 50px;
  background-image: url(./fire.png);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: bottom center;
}

.info {
  flex: 1 0 50px;
  text-align: center;
  align-self: center;
  padding-top: 55px;
  box-sizing: border-box;
}

@media(max-width: 430px) {
main {
  flex-direction: column-reverse;
}
}

@media(min-width: 950px) {
body {
  max-width: 900px;
  margin-inline: auto;
  box-shadow: 0 0 7px #aaa;
  border-width: 0 1px;
  border-color: #999;
  border-style: solid;
}
}