Layout

Layout Structures

Full Width: Body > .ap-section > .ap-container > .ap-row > .ap-col {{ x }} > .ap-content-block‍
Split Layout: Body > .ap-split-container (fw) > .ap-container > A: .ap-split-sidebar > .ap-sidebar-nav // B: .ap-split-main > .ap-section > .ap-split-main-container > .ap-row > .ap-col {{ x }} > .ap-content-block

Full Width (no columns)

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

Full Width (half width columns)

.ap-col > .ap-content-block > CONTENT
.ap-col > .ap-content-block.ap-color-block > CONTENT

Full Width (offset columns)

Stock image of tech bros doing tech bro things at white board.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.

Utilities

.ap-row-padding

Adds 70px padding to the top of a row. Use to achieve consistent spacing between successive rows which matches horizontal spacing between columns.

.ap-button-margin