Page Hero Section
A page-wide hero section with a background image and a 1000 pixel wide text box which includes an H1 header, text, and a button.
Template name: Section – Hero
Section Templates
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis auctor arcu enim, nec sagittis tellus varius a. Nulla facilisi. Aliquam urna augue, pharetra condimentum justo id, elementum pellentesque risus. Duis ac purus egestas, feugiat lorem at, ullamcorper sem. Mauris porta, erat id porttitor posuere,
Single Column
This section is 800 pixels wide. Single header (h2:36) with main text editor. Meant for one main content area with text.
Template name: Section – 1 Col – Text
Single Column Text (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Dictum fusce ut placerat orci nulla. Tincidunt ornare massa eget egestas purus viverra accumsan in nisl. Tempor id eu nisl nunc mi ipsum faucibus. Fusce id velit ut tortor pretium. Massa ultricies mi quis hendrerit dolor magna eget. Nullam eget felis eget nunc lobortis. Faucibus ornare suspendisse sed nisi. Sagittis eu volutpat odio facilisis mauris sit amet massa.
This is a heading (h3)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Dictum fusce ut placerat orci nulla. Tincidunt ornare massa eget egestas purus viverra accumsan in nisl. Tempor id eu nisl nunc mi ipsum faucibus. Fusce id velit ut tortor pretium. Massa ultricies mi quis hendrerit dolor magna eget. Nullam eget felis eget nunc lobortis. Faucibus ornare suspendisse sed nisi. Sagittis eu volutpat odio facilisis mauris sit amet massa.
Three Column CTAs
1200 pixel wide section with three columns of CTAs including an image, title, text and button.
Template name: Section – 3 Col – CTA
Add Your Heading Text Here
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod.
Four Column Icon CTAs
1200 pixel wide section with four columns of CTAs including an icon, title, text and link. Background can be an image or color. (This one is gray)
Template name: Section – 4 Col – Icon CTA
Section Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
Three Column Icon CTAs
1000 pixel wide section with three columns of CTAs including an icon, title, text and link. Background can be an image or color. (This one is gray)
Template name: Section – 3 Col – Icon CTA
Section Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
CTA H3 Header
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt.
Two Column CTAs
1200 pixel wide section with two column. One column has an image and the other has a title, text and button. Section backgrounds can be any of the main colors. Best to alternate these sections with image right to image left.
Template names: Section – 2 Col – CTA Left and Section – 2 Col – CTA Right
Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Simple Two Column Layout
1000 pixel wide section with two columns. One side has header (h3), text, and button. Otherside can have an image or other visual element (video, etc.)
Template names: Section – 2 Col – Simple Left and Section – 2 Col – Simple Right
Header H3 (28)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Header H3 (28)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
2 Col Title Left Text Right
1000 pixel wide two column section. H2 header, H3 title on left with text on right.
Template name: 2 Col – Title Left Text Right
Additional Information
Sub Title H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget libero mi. Praesent lobortis euismod purus nec pulvinar. Etiam ornare tincidunt nunc, sed malesuada nibh vulputate ut. Nulla pellentesque, magna et tempus porttitor, ex est semper nisl, et dignissim nisi massa quis elit. Curabitur mattis turpis lobortis lectus ultricies placerat.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer condimentum sem nec placerat ultrices. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed consectetur lectus id velit vehicula, vitae fringilla leo aliquet. Sed sit amet magna leo. Donec in tristique nisl. Sed vitae molestie metus.
Sub Title H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget libero mi. Praesent lobortis euismod purus nec pulvinar. Etiam ornare tincidunt nunc, sed malesuada nibh vulputate ut. Nulla pellentesque, magna et tempus porttitor, ex est semper nisl, et dignissim nisi massa quis elit. Curabitur mattis turpis lobortis lectus ultricies placerat.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer condimentum sem nec placerat ultrices. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed consectetur lectus id velit vehicula, vitae fringilla leo aliquet. Sed sit amet magna leo. Donec in tristique nisl. Sed vitae molestie metus.
Sub Title H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin eget libero mi. Praesent lobortis euismod purus nec pulvinar. Etiam ornare tincidunt nunc, sed malesuada nibh vulputate ut. Nulla pellentesque, magna et tempus porttitor, ex est semper nisl, et dignissim nisi massa quis elit. Curabitur mattis turpis lobortis lectus ultricies placerat.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Integer condimentum sem nec placerat ultrices. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed consectetur lectus id velit vehicula, vitae fringilla leo aliquet. Sed sit amet magna leo. Donec in tristique nisl. Sed vitae molestie metus.
Small Image Gallery
1000 pixel wide two column section. H3 header with a divider and explainer text on one side with standard image gallery grid on the other. Lightbox on click.
Template names: Section – Small Gallery – Left and Section – Small Gallery – Right
Image Gallery Title (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Image Gallery Title (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Large Image Gallery
1000 pixel wide one column section. H2 header with a divider and explainer text. Masonry grid below with hover caption and lightbox click.
Template name: Section – Large Gallery
Image Gallery Title (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Image Carousel
1000 pixel wide one column section. H2 header with a divider and explainer text. Carousel slider below with hover title and caption and lightbox click.
Template name: Section – Image Carousel
Image Carousel Title (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Image Treatments
A section with standard image treatments. No need to copy the entire section if you just need the photo styling, but you probably want to copy the inner-sections.
Template name: Section – Image Treatments
Two Column Video
1000 pixel wide section with two columns. One side has header (h3), text, and button. Otherside has video player.
Template names: Section – 2 Col – Video Left and Section – 2 Col – Video Right
Header H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Header H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
One Column Video
800 pixel wide section with one. Header (h3), text, and video player.
Template name: Section – 1 Col – Video
Section Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
Section CTA
600 pixel wide section with a header, text and CTA button.
Template names (pick depending on color): Section – CTA Slate, Section – CTA Blue, Section – CTA Caramel, or Section – CTA White.
White Heading Text H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Slate Heading Text H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Royal Blue Heading Text H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Caramel Heading Text H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Information Sections
Various sections with an icon, header and text.
Template names: Section – 1 Col – Info, Section – 2 Col – Info, or Section – 3 Col – Info
Icon Information Section Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Heading H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Form Section
800 pixel wide section with one column. H2 header with a divider, explainer text, and a form area. Includes custom CSS for styling of the form widget.
Template name: Section – Form
Section Header (H3)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet.
Optional Form Title (h4)
"*" indicates required fields
One Column FAQ
800 pixel wide section with one column. H2 header with a divider, explainer text, and a toggle menu for frequently asked questions or other information.
Template name: Section – 1 Col – FAQ
Section Header (H2)
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Bibendum est ultricies integer quis. Iaculis urna id volutpat lacus laoreet. Mauris vitae ultricies leo integer malesuada. Ac odio tempor orci dapibus ultrices in. Egestas diam in arcu cursus euismod.
- Maintain an effective firebreak by removing and clearing flammable vegetation and combustible growth from areas within 30 feet of such buildings or structures.
- EXCEPTION: Single specimens of trees, ornamental shrubbery, or similar plants used as ground covers, provided they do not form a means of rapidly transmitting fire from the native growth to any structure.
- Maintain additional fire protection or firebreak by removing brush, flammable vegetation, and combustible growth located from 30 to 100 feet from such buildings or structures when required by the AHJ because of hazardous conditions causing a firebreak of only 30 feet, which is insufficient to provide reasonable fire safety.
- EXCEPTION: Grass and other vegetation located more than 30 feet from buildings or structures and less than 18 inches in height above the ground need not be removed where necessary to stabilize the soil and prevent erosion.
- Remove portions of trees which extend within ten feet of a chimney’s outlet.
- Maintain trees adjacent to or overhanging a building free of deadwood.
- Maintain the structure’s roof free of leaves, needles, or other dead vegetative growth.”
Full FAQ with Side Navigation
1200 pixel wide two column section. with a header, text and CTA button.
Template name: Section – 2 Col – FAQ
Category One (H3)
- Property owners must use zip code 96813 when purchasing the product, as Oahu-based products are keyed similarly.
- An authorized signature is not required if the 96813 zip code is referenced.
- Property owners are responsible for the box installation. If requested, Honolulu Fire Department personnel may suggest a proper location for the box.
- Once installation is complete, the property owner must call the HFD’s Fire Operations division at 808-723-7113 to schedule the administrative area’s fire station to lock the box.
Category Two (H3)
- Property owners must use zip code 96813 when purchasing the product, as Oahu-based products are keyed similarly.
- An authorized signature is not required if the 96813 zip code is referenced.
- Property owners are responsible for the box installation. If requested, Honolulu Fire Department personnel may suggest a proper location for the box.
- Once installation is complete, the property owner must call the HFD’s Fire Operations division at 808-723-7113 to schedule the administrative area’s fire station to lock the box.
Category Three (H3)
- Property owners must use zip code 96813 when purchasing the product, as Oahu-based products are keyed similarly.
- An authorized signature is not required if the 96813 zip code is referenced.
- Property owners are responsible for the box installation. If requested, Honolulu Fire Department personnel may suggest a proper location for the box.
- Once installation is complete, the property owner must call the HFD’s Fire Operations division at 808-723-7113 to schedule the administrative area’s fire station to lock the box.