Welcome to Bacchus Frechette WINE & SPIRITS
At The Bacchus Group, we deliver excellence, expertise, and comprehensive solutions to elevate brands and drive success for our partners.
1 Color Palette
2 Typography
Fonts
Helpers
Italic Font
Uppercase Font
Regular Case Font
Bold Font Weight
Normal Font Weight
Light Font Weight
Font Size t1
Font Size t2
Font Size t3
Font Size t4
Font Size t5
Font Size t6
Headings
h1 - Heading
h1 - Sub Heading
h2 - Heading
h2 - Sub Heading
h3 - Heading
h3 - Sub Heading
h4 - Heading
h4 - Sub Heading
h5 - Heading
h5 - Sub Heading
h6 - Heading
h6.Sub Heading
Heading Sizer h1
Heading Sizer h2
Heading Sizer h3
Heading Sizer h4
Heading Sizer h5
Heading Sizer h6
Font Icons
Body Copy
Heading
Subheadline Paragraph
Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Paragraph link. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Normal Paragraph enean tellus metus, bibendum sed, posuere ac, mattis non, nunc. Fusce commodo aliquam arcu. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Praesent egestas tristique nibh. In hac habitasse platea dictumst. Ut a nisl id ante tempus hendrerit. Phasellus ullamcorper ipsum rutrum nunc. Vivamus laoreet. Donec interdum, metus et hendrerit aliquet, dolor diam sagittis ligula, eget egestas libero turpis vel mi. Praesent egestas neque eu enim.
Body Copy Alignment
Left Align Lorem ipsum Ut a nisl id ante tempus hendrerit.
Right Align Lorem ipsum Ut a nisl id ante tempus hendrerit.
Center Lorem ipsum Ut a nisl id ante tempus hendrerit.
Unordered List
- List Item 1
- List Item 2
- List Item 3
-
List Item 4
- Sub List Item 1
- Sub List Item 2
- Sub List Item 3
- Sub List Item 4
- Sub List Item 5
- List Item 6
Unordered List - Checkmarks
- List Item 1
- List Item 2
- List Item 3
-
List Item 4
- Sub List Item 1
- Sub List Item 2
- Sub List Item 3
- Sub List Item 4
- Sub List Item 5
- List Item 6
Ordered List
- List Item 1
- List Item 2
- List Item 3
-
List Item 4
- Sub List Item 1
- Sub List Item 2
- Sub List Item 3
- Sub List Item 4
- Sub List Item 5
- List Item 6
3 Spacing
Top Margin Spacing
Bottom Margin Spacing
Top Padding Spacing
Bottom Padding Spacing
5 Forms
6 Grids
Standard Grid
Grid system is based on Foundations Grid please reference docs for more information.
Sites breakpoints:
xsmall (0 to 479px)
small (480px - 639px)
medium (640px - 800px)
large (801px - 959px)
xlarge (960px - 1199px)
xxlarge (1200px and up)
Two column desktop/tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci ipsa velit dolorum accusantium, fugiat, rem ipsam, nesciunt eum excepturi. Maxime, enim, nobis.
Two column desktop/tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci ipsa velit dolorum accusantium, fugiat, rem ipsam, nesciunt eum excepturi. Maxime, enim, nobis.
Four column desktop; Two column tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci.
Four column desktop; Two column tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci.
Four column desktop; Two column tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci.
Four column desktop; Two column tablet; Single column phone Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam odio adipisci distinctio porro accusamus dolores nam, dignissimos nesciunt accusantium pariatur incidunt omnis tempora excepturi optio architecto. Provident praesentium enim libero necessitatibus unde ea mollitia tempore atque adipisci.
Block Grid
7 Page Body Components
Tables
| Table Header | Table Header | Table Header | Table Header |
|---|---|---|---|
| Content Goes Here | This is longer content Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
8 System Components
Alerts
This is an example successful alert message that would be used for forms or login messages more info
This is an example info alert message that would be used for forms or login messages more info
This is an example warning alert message that would be used for forms or login messages more info
This is an example danger alert message that would be used for forms or login messages more info
9 Theme Components
Alternating Feature - Image Left
Optional Label
Headline ipsum dolor sit amet, consectetur adipiscing elit sed
Subhheadline Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
Paragraph 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.
Alternating Feature - Image Right
Headline ipsum dolor sit amet, consectetur adipiscing elit sed
Subhheadline Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
Paragraph 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.
News Cards
News Title
Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit..
News Title
Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit..
News Title
Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit..
Content Block
Example Freeform Body Content
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Soluta aperiam sapiente dignissimos, beatae molestiae cupiditate amet eos, necessitatibus, accusantium asperiores animi praesentium repellendus voluptates quibusdam culpa vitae illum temporibus nobis libero odit. Ratione et illo tempore ab! Omnis, temporibus, deleniti. Odit natus, est similique dolor modi assumenda nesciunt nihil repellendus.
Labore maxime debitis doloribus itaque aperiam, voluptates minima consequuntur quam praesentium dolorem, dignissimos incidunt ducimus dolore ex velit quisquam repellat voluptate, consequatur esse modi nemo sed totam? Debitis ut dignissimos ullam fugiat quos excepturi voluptas ipsa sed a modi doloribus blanditiis voluptatem dolor maiores alias, illum ducimus! Quaerat, dolorum, placeat.
Exercitationem iste odit natus deserunt, expedita vel itaque aliquam inventore laudantium sint iusto magni pariatur quas optio harum obcaecati quibusdam dolorem explicabo quasi totam reprehenderit in. Magni natus rem quasi praesentium consequuntur, omnis unde harum voluptatibus perferendis ex repellat accusantium est ut, eius, perspiciatis in odio enim veritatis sapiente necessitatibus.
Content Column - 3 Col
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia odio minus
Get StartedLorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia odio minus
Get StartedLorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia odio minus
Get StartedContent Column - 2 Col
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia odio minus, voluptas quas nihil ipsum velit consequatur voluptatem, consectetur optio.
Get StartedLorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officia odio minus, voluptas quas nihil ipsum velit consequatur voluptatem, consectetur optio.
Get Started