@charset "utf-8";
/**************************************************

--- Naming Convention & writing style ---

- IDs & class names = all_lower_case_with_underscores
- ID and class names should relate to content they contain, not position/appearance
- Cascade ID related class names by tabbing. eg:
#element_id{}
	#element_id .class_name{}
- Use single line declarations for all but the very long
- Prefered order: position ; dimensions ; float ; margin ; padding ; everything else

--- File structure ---

- Import
- Global styles
- Global classes
- Global IDs (IDs common to all/most pages)
- #id .classes
- Local IDs
- #id .classes

--- Colours ---

List colours here for easy find & replace
#ffcaca Pink
#cc1e11 Red
#d21e12 Mid Red
#8e1006 Dark Red
#cbc0c0 Red Grey
#676666 Light Grey

***************************************************/

/* *** IMPORT *** */

@import url("reset.css");
@import url("lightbox.css");
/*
Note: reset.css sets body text size @ 62.5%
For text sizes use:
1em instead of 10px
1.6em instead of 16px, etc
*/

/* *** GLOBAL STYLES *** */
body{font-family:"Century Gothic", "Avant Garde", sans-serif;}
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}
/* *** GLOBAL CLASSES *** */
.col_50{width:290px; padding:10px; float:left;}
/* *** GLOBAL IDs *** */
div#wrapper{width:886px; margin:0px auto;}
div#header{height:96px; background:url(../images/header.gif) 10px 10px no-repeat; border-bottom:1px solid #cecece;}
div#footer{height:138px; background:url(../images/footer.jpg) no-repeat;}
ul#main_nav{width:180px; padding:10px 15px; float:left;}
	ul#main_nav li a{padding:5px; font-size:1.4em; display:block; color:#666666; text-decoration:none;}
	ul#main_nav li a:hover{background:#cecece; color:#FFFFFF;}
#lightboxDetails{font-size:1.2em;}
/* *** LOCAL IDs *** */
div#home{}
	div#home h1{font-size:1.6em; color:#999999; font-weight:bold; margin-bottom:10px;}
	div#home p{font-size:1.2em; margin-bottom:10px;}
div#products{width:600px; float:left}
	div#products h2{line-height:1.9em; color:#666666;  font-size:1.9em;  border-bottom:1px solid #cecece; clear:both;}
	div#products ul.product_group{}
	div#products ul.product_group li.product{width:23%; padding:1%;float:left;}
	div#products ul.product_group li.product img{display:block; clear:both;}
	div#products ul.product_group li.product .caption{padding:2px; color:#333333; display:block; clear:both;}
div#prices{width:600px; float:left}
	
	div#prices h2{margin-bottom:5px;line-height:1.9em; color:#666666;  font-size:1.9em;  border-bottom:1px solid #cecece; clear:both;}
	div#prices th{padding:10px 3px;font-size:1.2em;}
	div#prices td{padding:3px;border-right:#666666 1px solid; font-size:1.2em;}