#wrapper {
  width:100%;
  max-width: 960px;
  margin: 0 auto;
}

section {
  margin-top:10vh;
  
}

body {
font-family:arial;
font-size: 35px;
background-color: rgb(248, 234, 216)
}

#list {
  font-family:arial;
  font-size: 20px;

  
}

#banner{
  opacity: .4;
}

@media (min-width:800px) {
  section {
    
    display: grid;
    grid-template-columns: 1fr 1fr;
    
  }
  
  h3 {
   text-align: left;
    font-family: 'Limelight', cursive;
    font-size: 65px;
    color: #742a2a;
  }
  
  h1 {
    font-family: 'Limelight', cursive;
    text-align: center;
    font-size: 120px;
    padding-left: 15px;
    color: #1a1d6c;
  }
  
  p {
  font-size: 20px;  
  }
  
  hr {
    border-top: 12px dotted;
    color: #392211;
  }
  
  #stepone {
    padding-left: 148px;
  }
  
  #steptwo {
    padding-left: 105px;
  }
  
  #stepthree
  {
    padding-left: 127px;
  }
  
  #stepfour
  {
    padding-left: 127px;
  }
  
  #stepfive
  {
    padding-left: 155px;
  }
  
  #done {
    text-align: center;
    color: #1a1d6c;
  }
  #mug {
    padding-left: 355px;
    opacity: .70
  }