
  .grid-span-4 { 
    grid-column: span 4 / span 4; 
    background: #ddddff; 
  }


  .grid-span-4 { 
    grid-column: span 4 / span 4; 
    background: #ddddff;
  }
  .hero {
    min-height: 250px;
    background: url("https://...some_image.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: absolute;
  }

Foo Bar Baz - Title


  .grid-span-1 { 
    grid-column: span 1 / span 1; 
    background: #ddffff;
    padding: 1rem; 
  }


  .grid-span-3 { 
    grid-column: span 3 / span 3; 
    background: #ffdddd;
    padding: 1rem; 
  }


  .grid-span-1 { 
    grid-column: span 1 / span 1; 
    background: #ddffff;
    padding: 1rem; 
  }


  .grid-span-3 { 
    grid-column: span 3 / span 3; 
    background: #ffdddd;
    padding: 1rem; 
  }


  .grid-span-1 { 
    grid-column: span 1 / span 1; 
    background: #ddffff;
    padding: 1rem; 
  }


  .grid-span-3 { 
    grid-column: span 3 / span 3; 
    background: #ffdddd;
    padding: 1rem; 
  }


  .grid-span-4 { 
    grid-column: span 4 / span 4; 
    background: #ddddff; 
  }