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.
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.
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.
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.
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.
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.
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.
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.
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.
Icons are supplied in 64×64 dimension in pixel perfect form to ensure proper scaling and usability in every screen sizes.
Top view shot of sample products
Images that represents the company
Eye level shot of sample products
Cliché and staged stock photos
Columns need to be nested within a row and a direct child of a container. All columns start off at equal-widths by defining the class of "col" and auto-collapse at the mobile portrait breakpoint if no responsive classes are defined.
To remove all padding from columns, use the no-gutters class preceded by the initial class of col.
Define your div with a class of container-fluid for full width.
To define our 12 column grid, all classes must precede with the initial class of col
Defining our tablet breakpoints, all classes must precede with the class of col and if defined, your desktop class of col-(1-12)
Defining our mobile landscape breakpoints, all classes must precede with the class of col and if defined, your desktop and tablet classes of col-(1-12)
Defining our mobile portrait breakpoints, all classes must precede with the class of col and if defined, your desktop and tablet classes of col-(1-12)
If responsive columns are placed within a single row and which the total result in greater then 12, they will automatically wrap onto a new line.
To align columns from the top, combine a class of align-start preceded by the class of row
To align columns from the top, combine a class of align-center preceded by the class of row
To align columns from the top, combine a class of align-end preceded by the class of row
To align columns from the left, combine a class of justify-start preceded by the by class of row
To align columns from the left, combine a class of justify-center preceded by the by class of row
To align columns from the left, combine a class of justify-end preceded by the by class of row
To align columns from the left, combine a class of justify-between preceded by the by class of row
To individually self-align columns, combine a class of self-start, self-center, self-end preceded by the by class of col
To individually reorder columns, combine a class of either order-first, order-last, preceded by the by class of col