Case Studies (H1)

4 category example:

biotech-image.jpg

commercial-image.jpg

entertainment-image.jpg

government-image.jpg

3 category example:

Page Notes:
  • This page is unique to Gibson - not all OPCO sites will have case study categories
  • Photos:
    • Custom per OPCO and provided by EMCOR 
  • Layout:
    • 3 layout options are showing on the page - 6 categories, 4 categories and 3 categories.
    • NOTE: Only 1 layout will be on the page.
  • Blocks:
    • Images blocks that link to each individual Case Study category page.

 

ADDING NEW ROW/LAYOUT:

When adding a layout don't pick Bootstrap for the Grid, instead pick Grid: Free-form Layout Columns: 3 Spacing: 5.
Then on the "column 1" (or 2 or 3) tab for the row above, click on and then select Edit Layout Design and add 5px to the bottom Margin. (Margin and padding adjustments live under the 3rd to the right tab with the left to right arrow icon.)

 

CSS for mobile needed:

This needs to be added to the css for mobile: 

@media (max-width: 768px) {

body#case-studies .ccm-layout-column-wrapper div.ccm-layout-column {

width: 100% !important;

margin-bottom: 10px;

}
 

body#case-studies .ccm-layout-column-wrapper div.ccm-layout-column img{

float: left !important;

}
}