jessestu/custom-css.md

## custom-css.md

      
    Raw
  

              custom-css.md
            
          
    Please go to My Site →  Customize → CSS (or Additional CSS), then add all of the following code to the bottom of that window.

/* This CSS forces the hero container on the homepage to 100% height, centers content inside.
* 10821328-hc (jw)
*/
.hero-container-inner .hentry {
  height: 60%;
}
.front-page-content-area .with-featured-image .entry-header {
  display: none;
}
.front-page-content-area .with-featured-image .entry-content .wp-block-image {
  margin-bottom: 0;
}
.hero-container-inner .hentry .entry-content {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

@media screen and (min-width: 768px){
  .front-page-content-area .with-featured-image {
    width: 600px;
  }
}

Tip: keep the /* comment */ in the code to later know what this code does.
Example of where to add the CSS