body {
  font-family: 'Space Mono', monospace;
  font-weight: bold;
	font-size: 40px;
	line-height: 1;
}

h1{
  font-size: 60px;
  margin-bottom: 30px;
}

.section{
  background-color: black;
}

.page1{
  background-color: #ff0000;
  color: #00ff00;
}

.page1-wrapper,
.page4-wrapper{
  width: 100%;
  max-width: 1200px;
  padding: 20px;
  margin: 0px auto;
  display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.page2{
  background-color: #ffff00;
}

.page2-wrapper,
#food-drawer-canvas,
.page3-wrapper,
#ingredients-canvas{
  height: 100vh;
  width: 100vw;
}

.page3{
  background-color: #0000ff;
  color: #ffff00;
}

.page4{
  background-color: #00ff00;
  color: #0000ff;
  font-size: 22px;
}

@media screen and (max-width:767px){
  #desktop-container{
    display: none;
  }
}

@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');