*{
  margin:0;
  padding:0;
  color:white;
}
header{
  display:flex;
  align-items:center;
  justify-content:center;
  background:tomato;
  position:sticky;
  top:0px;
  padding:10px;
  font-weight:bold;
  font-family:sans-serif;
}
.nav-item{
  flex:0 1 200px;
}
.logo{
  display:flex;
  align-items:center;
  min-width:250px;
}
body{
  background-color:#222222;
  height:2000px;
}
main{
  padding:25px;
  display:grid;
  gap:25px;
  grid-template-columns:1fr 1fr 1fr 1fr;
  grid-template-rows:repeat(9, 1fr);
  background-color:rgba(255,100,100,.5);
}
span{
  padding:2px;
  background:tomato;
}
img{
  float:left;
}
.hotdog{
  padding:30px 30px;
  background-color:rgba(255,100,100,.2);
}

@media (max-width: 1000px) {

  /* 1. Hide nav items + center logo */
  .buns, .cond, .meat, .cart {
    display: none;
  }

  header {
    justify-content: center;
  }

  .logo {
    margin: 0 auto;
  }

  /* 2. Background image + color change */
  main {
    background-color: #501000;
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/thumb/b/b1/Hot_dog_with_mustard.png/1200px-Hot_dog_with_mustard.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  /* 3. Change grid to 1 column */
  main {
    grid-template-columns: 1fr;
  }

  /* 4. Increase text size + font */
  body {
    font-size: 24px;
    font-family: sans-serif;
  }

}