Style Guide
Heading Styles
H2: This is a Header
Nam id neque est, sed luctus urna. Nunc dolor quam, info@lrswebsolutions.com ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
H3: This is a Header
Nam id neque est, sed (217) 793-3800 urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
H4: This is a Header
Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
H5: This is a Header
Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
Images
This is an image caption.
Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.Nam id neque est, sed luctus urna. Nunc dolor quam, dignissim ut pellentesque in, malesuada et orci. Nunc dignissim adipiscing semper. Donec dapibus condimentum nunc, vitae rhoncus tellus sodales eu.
Block Quote
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Author Attribution
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Unordered List
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Praesent nec augue. Curabitur ligula quam
- Bulleted List Item One. Pellentesque consectetur bibendum lectus id auctor. Integer nibh lacus, mollis nec semper eget.
- Bulleted List Item Two. Pellentesque consectetur.
- Bulleted List Item Three. Pellentesque consectetur.
Ordered List
Etiam imperdiet turpis. Praesent nec augue. Curabitur ligula quam, rutrum id, tempor sed, consequat ac, dui. Vestibulum accumsan eros nec magna. Vestibulum vitae dui. Vestibulum nec ligula et lorem consequat ullamcorper.
Praesent nec augue. Curabitur ligula quam
- Bulleted List Item One. Pellentesque consectetur bibendum lectus id auctor. Integer nibh lacus, mollis nec semper eget.
- Bulleted List Item Two. Pellentesque consectetur.
- Bulleted List Item Three. Pellentesque consectetur.
Table
Below is your default table styling. To add this Table, click on the + in the Rich Text Editor and select Table. A table with 2 rows and 2 columns will be added by default. From there, you'll be able to add additional rows and columns. To add another column or row, click on any table cell and once highlighted click on the Table Icon which has now replaced the + icon. Now, you'll see options to either add column before or after, add row before or after, as well as, remove any columns or rows. By default, the first row of a table will be converted to Headings.
|
Header
|
Header
|
Header
|
|
Cell
|
Cell
|
Cell
|
|
Cell
|
Cell
|
Cell
|
|
Cell
|
Cell
|
Cell
|
New Accordions
To add Accordions, click the + icon in the Rich Text Editor and select Snippet. Next, choose Accordions.
Accordion Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Accordion Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Accordion Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Accordion Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
New Tabs
To add Tabs, click the + icon in the Rich Text Editor and select Snippet. Next, choose Tabs.
Tab Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Tab Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Tab Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Billboard
This is a Fullwidth Billboard with an Image Background. To add this, click the + icon in the toolbar and select Snippets. Select Billboard.
Learn More
To add a this default Dark version of the Billboard, click the + icon in the toolbar and select Snippets. Select Billboard. You'll want to make sure to delete the image that comes with adding a Billboard snippet by default.
Learn More
Call Out Banner
Add this by clicking the + icon in the Rich Text Editor toolbar. Click on Snippet and select Callout Banner. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Learn More
Card Layout
Card
Add this by clicking the + icon in the Rich Text Editor toolbar. Click on Snippet and select Card Layout.
Learn More
Highlighted Text Block
This is the default (or primary color) Highlighted Text Block. Add this version of the Highlighted Text Block by clicking the + icon in the toolbar and select Snippets. Select Highlighted Text Block.
Highlighted Text Box
This is the default (or primary color) Highlighted Text Box. Add this version of the Highlighted Text Box by clicking the + icon in the toolbar and select Snippets. Select Highlighted Text Box.
Image Callout
Image Call to Action
Add this by clicking the + icon in the Rich Text Editor toolbar. Click on Snippet and select Image Callout.
Learn More
List with Images
This is a Heading
Lists with Images are part of your pack of Snippets. To locate this snippet, Click the + sign, Snippet, and List with Images.
This is a Heading
Lists with Images are part of your pack of Snippets. To locate this snippet, Click the + sign, Snippet, and List with Images.
This is a Heading
Lists with Images are part of your pack of Snippets. To locate this snippet, Click the + sign, Snippet, and List with Images.
Two Columns
Add columns by clicking the + icon in the Rich Text Editor toolbar and select the number of columns you'd like.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Modals
To add a Modal click on the + icon in the Rich Text Editor toolbar and select Snippet. Now, click on Modal. You'll need to edit the modal link that will activate the popup once clicked. First, with the Modal selected, click on the # icon in the toolbar and give your Modal an ID name. The ID name should contain no spaces (ex: modalName). Next, with the link selected, click the Link Icon in the toolbar. Click Edit Link. For the URL add a # followed by the ID name you gave to your Modal and click Insert. Now your Modal should be ready to use.
Modal Title (must be H2)
Here is your modal. You'll need to edit the modal link that will activate the popup once clicked. First, with the Modal selected, click on the # icon in the toolbar and give your Modal an ID name. Next, with the link selected, click the Link icon in the toolbar. Click Edit Link. For the URL add a # followed by the ID name you gave to your Modal and click Insert. Now your Modal should be ready to use.
Open Modal Link (this link can be moved to anywhere you'd like on the page)