// Font Sizes
XSmall @font-size__xs 10px (e.g copyright in footer)
Small @font-size__s 12px (e.g Footer links)
Base @font-size__base 15px (e.g Body copy, buttons, product listing titles, footer headings)
Large @font-size__l 18px; (e.g )
X-Large @font-size__xl 24px; (e.g PDP title)
// Font Weights
@font-weight__light Gill Sans Light (e.g forms notes)
@font-weight__regular Gill Sans Book (body copy)
@font-weight__bold Gill Sans Medium (footer headings, form labels, product listing names)
// Spacing
@indent__xs 5px;
@indent__s 10px;
@indent__m 16px;
@indent__l 30px;
@indent__xl 40px;
// Theme Colours

Primary theme colour (@theme__color__primary)

Secondary theme colour (@theme__color__secondary)

Theme Panel colour (@panel__background-color)

Border colour (@border-color__base)

// Buttons


Header Level 1 (Reduced mobile size)

This is body copy. Lorum ipsum pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies this is an inline link eget, tempor sit amet ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper.

Header Level 2 (Reduced mobile size)

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

Header Level 3

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, commodo vitae, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. Donec non enim in turpis pulvinar facilisis. Ut felis.

Header Level 1 (Reduced mobile size)

Header Level 2 (Reduced mobile size)

Header Level 3

Header Level 4

Header Level 5

Standout content goes here

"This is a blockquote. After traipsing round Garden centres and Nuseries, looking at the sad citrus on offer, I went on-line and found this site. I ordered a Lemon, Lime, Orange and Clementine for myself and an Orange for my buddy. They arrived today in excellent condition, good shaped little trees with glossy leaves... Excellent products. Excellent service. "

K. F. June 2016
Lorum Ipsum Lorum Ipsum Lorum Ipsum
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Handel Roland Mendel Austria
Island Trading Helen Bennett UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini Alimentari Riuniti Giovanni Rovelli Italy

List of cookies we collect

The table below lists the cookies we collect and what information they store.

Cookie Name Cookie Description
FORM_KEY Stores randomly generated key used to prevent forged requests.
PHPSESSID Your session ID on the server.
GUEST-VIEW Allows guests to view and edit their orders.
PERSISTENT_SHOPPING_CART A link to information about your cart and viewing history, if you have asked for this.
STF Information on products you have emailed to friends.
STORE The store view or language you have selected.
USER_ALLOWED_SAVE_COOKIE Indicates whether a customer allowed to use cookies.
MAGE-CACHE-SESSID Facilitates caching of content on the browser to make pages load faster.
MAGE-CACHE-STORAGE Facilitates caching of content on the browser to make pages load faster.
MAGE-CACHE-STORAGE-SECTION-INVALIDATION Facilitates caching of content on the browser to make pages load faster.
MAGE-CACHE-TIMEOUT Facilitates caching of content on the browser to make pages load faster.
SECTION-DATA-IDS Facilitates caching of content on the browser to make pages load faster.
PRIVATE_CONTENT_VERSION Facilitates caching of content on the browser to make pages load faster.
X-MAGENTO-VARY Facilitates caching of content on the server to make pages load faster.
MAGE-TRANSLATION-FILE-VERSION Facilitates translation of content to other languages.
MAGE-TRANSLATION-STORAGE Facilitates translation of content to other languages.

List

  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.
  • Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
  • Aliquam tincidunt mauris eu risus.

Accordion Example

Accordion Heading 1

Lorem ipsum dolor sit amet, dolor putent detracto eam te, recusabo conclusionemque et has. At usu natum saepe. Est commodo iudicabit principes no, qui ea meis dicta euismod. Has te nominati recteque. Malorum noluisse prodesset has ut. Ei eros ipsum exerci sed. Fugit discere ad mel, mei ei nisl delenit, sit duis fabellas expetendis in.

Accordion Heading 2

Lorem ipsum dolor sit amet, dolor putent detracto eam te, recusabo conclusionemque et has. At usu natum saepe. Est commodo iudicabit principes no, qui ea meis dicta euismod. Has te nominati recteque. Malorum noluisse prodesset has ut. Ei eros ipsum exerci sed. Fugit discere ad mel, mei ei nisl delenit, sit duis fabellas expetendis in.

Accordion Heading 3

Lorem ipsum dolor sit amet, dolor putent detracto eam te, recusabo conclusionemque et has. At usu natum saepe. Est commodo iudicabit principes no, qui ea meis dicta euismod. Has te nominati recteque. Malorum noluisse prodesset has ut. Ei eros ipsum exerci sed. Fugit discere ad mel, mei ei nisl delenit, sit duis fabellas expetendis in.






// Example HTML
<span class="icon-chevron-left"></span>
// Example CSS
.my-arrow:before {
    .merci-maman-icon-font();
    content:''\e801";
}