Webmaster's Guide
Box/layout styles:
box - default box - large box head and no borders/backgrounds.
bbox - background box - medium-sized box head, with head and body background colors separate.
alt - alternate head background color.
lbox - light box - small box head with a soft line between head and body.
cbox - color box - nicely padded head and body on a single background color.
alt - alternate background color.
fbox - footer box - no borders and largeish head that renders inline when possible.
Additional (combo) classes:
w{NN} - make a box span NN% of the container width.
tw{NN} - tablet-format (iPad portrait) emergency widths.
rightcol - makes the box float to the right. (Useful for maintaining proper content order on mobile screens.)
flex - gives box a flexible width up to the maximum indicated by w{NN}/tw{NN}
- One-column layouts:
w25, w33, w50, w67, w75 - basic widths.
tw33, tw50, tw67, tw100 - tablet only.
- Two-column layouts:
w33, w42, w50, w58, w67 - basic widths.
tw42, tw58, tw67 - tablet only.
nohead - hide (not remove) the box heading
Content-specific box styles:
slideshow - turns a list of content .items with banner images (and optional h3 titles) into a cross-fading slideshow spannig the full box width.
- Images are centered inside the container and cropped at the sides on narrower screens.
productlist quickproducts - miniature productlist optimized for narrow boxes.
morebutton - replace the "Add to Cart" button with a big "More Info" button.
articlelist - for basic article/news list ...
fancydates - for fancy newslist date display
navbox - for simple <ul>-based linklists with arrow icons
fbox modifiers:
social - for <ul> list of social media links (facebook, twitter, rss, youtube, gplus, pinterest)
compact - icon only links.
postlist - for mailinglist subscription box
footer - for contact info ("pgfoot2"/Lower Footer)
Content Styles
ul.minitable - simple right-aligned list where <strong> (bold) text floats to the left. Nice for opening hours, etc.