Assists in Creating a Full Width Custom SiteFarm Block

PHOTO EMBED

Fri Aug 13 2021 19:58:32 GMT+0000 (UTC)

Saved by @ucguy #css #sitefarm

/* Full width custom block background and forgrond colors */
.custom-fwb {
  background-color: #022851;
  color: #fff;
}
/* Full width custom block title size and color */
.custom-fwb h2 {
  color: #fff;
  font-size: 3rem;
}
/* Full width custom block 2 tone color style */
.custom-fwb h2 span {
  color: #FFBF00;
  display: block;
}
/* Full width custom block image that hangs over the edge */
.custom-fwb img {
  top: -58px;
  position: relative;
}

/* Vertically center full width body text in large screen sizes */
@media only screen and (min-width: 992px) {
  .custom-fwb__body {
  position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
content_copyCOPY

Goes with a tutorial at http://sitefarm.ucdavis.edu/news/build-one-column-sitefarm-pages