CSS file structure

The web toolkit

Iframe descriptions

Other components

Building the page

Implementing in WordPress

Implementing in HTML

Configuring CSS styles

Iframe CSS styles

CSS file structure

The checkout screens

Club selection and signup

The account manager

Administrative tools

The iframe CSS file includes a section for each of the main web tools components. Those that need to be adjusted for various display sizes are followed by sections that contain corresponding @media queries.

The first sections of the CSS comprise:

/*------------------------------- Napa  -----------------------------------------------------------------{*/

/*------------------------------- Variables -------------------------------------------------------------{*/


/*------------------------------- Font Groups -----------------------------------------------------------------{*/


/*------------------------------- Button Groups ---------------------------------------------------------------{*/


/*------------------------------- Catalog ---------------------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*-------------------------------Catalog Basket------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*-------------------------------Catalog Menu------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*-------------------------------Catalog Element------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Cart Editor --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Checkout --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Catalog Message --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Catalog User Login  --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Catalog Manage Addresses  --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Club Signup / Registration Selection --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Club Signup / Registation Cart --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Club Signup / Registation Checkout --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Join The Club --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Manage Account --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Selection / Member Choice --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Toolbar ------------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Forgot Password  --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Reset Password  --------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- Unsubscribe  ------------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/


/*------------------------------- NewsletterHook  ------------------------------------------------------{*/


/*------------------------------- Newsletter  ------------------------------------------------------{*/


/*------------------------------- Media Statements ------------------------------------------------------{*/

/*------------------------------- Napa  -----------------------------------------------------------------{*/