/*
==========================================================================
	
	STYLE.CSS | CSS FRAMEWORK
	--------------------------
 	Main Project specific styles
	
	- FIREFLY -
	
	author: Richard Morris [richard@fueldesign.co.nz] 
	version: - 2 November 2006 -

	Contents:
	--------------------------
	1 - Default Typography Sizing, Colours and Margins
	2 - Global Stlyes for types
	3 - Main Structural Divs
	4 - Header styles
	5 - Main body Styles
	6 - Footer Styles
	7 - Page Specific sty;es
	8 - Form Styling

==========================================================================
*/
	@import url("base.css");
	/*@import url("forms.css");*/
/*
==========================================================================
1 - Default Typography Sizing, Colours and Margins
==========================================================================
*/
html, body, form, fieldset, h1, h2, h3, h4, h5, h6, p, pre, blockquote, ul, ol, dl, address, abbr, input, select, textarea, table, td, th, a:link, a:visited { /* For Nescape 4.0 and other inheritance intolerant browsers */
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	line-height: 1.5em;
}
body { font-size: 62.5%; }

div#primaryContent {
	font-size: 1.1em;
	color: #808183;
}
div#secondaryContent {
	font-size: 1em;
	color: #164796;
}

p, ul, dl, ol, form, blockquote, table  { margin-bottom: 1.5em; }

h1 {
	font-size: 2em;
	margin-bottom: 0.5em;
	text-transform: lowercase;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: normal;
}
h2 {
	font-size: 16pt;
	margin-bottom: 0.2em;
	font-family: Tahoma;
	font-weight: normal;
}
h3 { font-size: 1.4em; margin-bottom: 1em; text-transform: lowercase; }
h4 { font-size: 1.3em; margin-bottom: 0; text-transform: lowercase; }
h5 { font-size: 1.2em; margin-bottom: 1em; text-transform: lowercase; }

h1 img, h2 img, h3 img, h4 img, h5 img { background: none; }

.specialOffer {
	font-size: 12px;
	}
/*
==========================================================================
2 - Global Styles for types
==========================================================================
*/
.clear { clear: both; }

/* links */
a:link, a:visited { font-weight: bold;  }
a:hover, a:active { color: #e7ad31; }
a:link.external, a:visited.external { background: transparent url(../images/bg/external.gif) top right no-repeat; padding-right: 12px;}

/* list types */
ul.bulleted li { padding-left: 20px; background: transparent url(../i/bg/bullet.gif) top left no-repeat; margin-bottom: 5px; }
dl dt { font-weight: bold; }
ol li { list-style-type: lower-alpha; list-style-position: inside; }

/* blockquotes */
blockquote { background-color: #F5F5F5; margin-bottom: 1em; }
blockquote p { font-family: georgia, "times new roman", serif; color: #CCC; font-size: 1.5em; margin: 5px 5px 5px 10px; }
blockquote cite { font-style: normal; color: #CCC; font-weight: bold; }

/* strong */
strong.error { color: #F00; }
p.sifr { margin-top: 5px; }

/* em */
em.required { color: #e7ad31; font-weight: bold; font-style: normal; }
/*
==========================================================================
3 - Main Structural Divs
==========================================================================
*/
html, body {
	height: 100%;
}
body {
	background: #FFF;
	text-align: center;
}
div#container {
	width: 840px;
	height: 800px;
	margin: 0 auto;
	margin-top: 10px;
	text-align: left;
	background: #FFF url(../images/bg/container_bg.png) top left repeat-y;
	overflow: hidden;
}
div#header {
	background: transparent url(../images/bg/header_bg.png) top left no-repeat;
	height: 148px;
	width: 100%; 
	position: relative;
}
div#main {
	background: transparent url(../images/bg/main_bg.gif) top left repeat-y;
	height: 690px;
	width: 100%;
	clear: both;
	position: relative;
}
	div#primaryContent {
	position: absolute;
	left: 240px;
	top: 0;
	width: 564px;
	padding-top: 20px;
	line-height: 1.7em;
	overflow: hidden;
	height: 628px;
	}
	div#secondaryContent {
	position: absolute;
	top: 0;
	left: 20px;
	width: 199px;
	padding-top: 20px;
	height: auto;
	background-color: #cbddf8;
	}
div#footer {
	clear: both;
	height: 44px;
	margin: 0 auto;
	width: 840px;
	position: relative;
	background-color: transparent;
	background-image: url(../images/bg/footer_bg.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}
/*
==========================================================================
4 - Header styles
==========================================================================
*/
#logo {
	position: absolute;
	top: 30px;
	left: 46px;
}

div#flash {
	width: 350px;
	height: 130px;
	position: absolute;
	top: 0;
	right: 20px;
	padding-top: 9px;
	background-image: url(../images/bg/circles.gif);
	margin-top: 9px;
}

div#nav {
	line-height: 37px;
	height: 37px;
	text-align: right;
	margin: 0 20px;
	position: relative;
	width: 800px;
	background-color: transparent;
	background-image: url(../images/bg/nav_bg.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

#nav ul { position: absolute; right: 30px; }
#nav ul li { float: left; line-height: 37px; height: 37px; }

#nav ul a {
	display: block;
	float: left;
	height: 37px;
	margin-top: 14px;
	margin-left: 8px;
	_margin-left: 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
}
#nav a#home {
	width: 46px;
}
#nav a#products {
	width: 70px;
}
#nav a#gallery {
	width: 70px;
}
#nav a#contact {
	width: 70px;
}
#nav a#wishlist {
	width: 83px;
}

#nav a:hover#home, #nav a:hover#products, #nav a:hover#gallery, #nav a:hover#contact, #nav a:hover#wishlist  { background-position: center right; } 
#nav  a:hover {
	color: #CCDEF8;
}

#nav li.current a#home, #nav li.current a#products, #nav li.current a#gallery, #nav li.current a#contact { background-position: center right; cursor: default; }
#nav li.current a#wishlist { background-position: top right; }
/*
==========================================================================
5 - Main content styles
==========================================================================
*/
/* primary content */
table#pageControls { width: 120px; margin-bottom: 0; clear: both; margin-top: 10px; }
table#pageControls img { display: inline; line-height: 21px; height: 21px; }
#pageControls td  { border: none; text-align: center; }
a#previous { display: block; height: 21px; width: 20px; background: transparent url(../images/bg/previous.gif) top center no-repeat;}
a#next { display: block; height: 21px; width: 20px; background: transparent url(../images/bg/next.gif) top center no-repeat;}  
a:hover#next, a:hover#previous { background-position: bottom center;}

/* secondary content */
#secondaryContent div {
	padding-left: 28px;
	margin-right: 0px;
	padding-right: 15px;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom-width: 7px;
	border-bottom-style: solid;
	border-bottom-color: #80AAEA;
}
	#secondaryContent div.bottom { border: none; }
#secondaryContent div p { margin-bottom: 0; }
/*
==========================================================================
6 - Footer styles
==========================================================================
*/
ul#footNav li{
	display: inline;
}
ul#footNav a {
	color: #F00;
}
a#copyright {
	display: block;
	height: 20px;
	width: 211px;
	position: absolute;
	top: 41px;
	right: 279px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #818181;
}
/*
==========================================================================
7 - Page specific styles
==========================================================================
*/ 
ul#sitemap {
	
}
/* home page */
#index div#lCol {
	width: 390px;
	float: left;
	border-right: 1px dashed #CCC;
	padding-right: 10px;
	height: 600px;
} 
#secondaryContent hr {
	color: #80AAEA;
	margin-top: 20px;
}

#index div#rCol { width: 148px; float: right; margin-top: 30px; text-align: right; padding-bottom: 10px; }
	div#rCol img { margin-top: 10px; display: inline; }
	
/* products */
ul#productNav { 
	padding-bottom: 10px;
	width: 455px;
	overflow: hidden;
	float: left;
	}
#pagination {
	width: 96px;
	float: right;
	margin: 112px 0 0 0;
	height: 100px;
	overflow: hidden;
	}
#pagination a {
	float: left;
	}
ul#productNav li { display: inline; }
ul#productNav a { display: block; float: left; width: 140px; height: 124px; margin-left: 5px; margin-bottom: 10px; }

a#lighting { background: transparent url(../images/bg/products-nav/lighting.jpg) top left no-repeat; }
a#modernFurniture { background: transparent url(../images/bg/products-nav/modern_furniture.jpg) top left no-repeat; } 
a#furnishings { background: transparent url(../images/bg/products-nav/furnishings.jpg) top left no-repeat; } 
a#artisan { background: transparent url(../images/bg/products-nav/artisan.jpg) top left no-repeat; } 
a#rugs { background: transparent url(../images/bg/products-nav/rugs.jpg) top left no-repeat; } 
a#homewares { background: transparent url(../images/bg/products-nav/homewares.jpg) top left no-repeat; }

a:hover#lighting, a:hover#modernFurniture, a:hover#furnishings, a:hover#artisan, a:hover#rugs, a:hover#homewares { background-position: -140px 0; } \

/* products sub pages */
ul a h3.sifr { margin-bottom: 0px; }

.productsPage div#lCol { width: 130px; float: left; padding-right: 10px; } 
.productsPage div#rCol { width: 410px; ; float: right; padding-bottom: 10px; }

ul.products {
	margin-bottom: 0;
	list-style-type: none;
} 
ul.products li { display: block; float: left; height: 105px; width: 105px; margin-bottom: 10px;  margin-left: 10px;}
ul.products a img { display: inline; }
ul.products a {
	display: block;
	list-style-image: none;
}

#lightingPP #secondaryContent { background: transparent url(../images/bg/lighting.gif) 158px bottom no-repeat; }
#modernFurniturePP #secondaryContent { background: transparent url(../images/bg/modern-furniture.gif) 130px bottom no-repeat; } 
#furnishingsPP #secondaryContent { background: transparent url(../images/bg/furnishings.gif) 158px bottom no-repeat; } 
#artisanPP #secondaryContent { background: transparent url(../images/bg/artisan.gif) 158px bottom no-repeat; } 
#rugsPP #secondaryContent { background: transparent url(../images/bg/rugs.gif) 168px bottom no-repeat; } 
#homewaresPP #secondaryContent { background: transparent url(../images/bg/homewares.gif) 164px bottom no-repeat; } 
#giftsPP #secondaryContent { background: transparent url(../images/bg/gifts.gif) 157px bottom no-repeat; } 

/* contact */
#contactInfo div#lCol { width: 310px; float: left; padding-right: 10px; border-right: 1px dashed #CCC; }
#contactInfo div#rCol { width: 225px; ; float: right; text-align: right; padding-bottom: 10px; }  
#contactInfo #rCol img { margin-top: 0; }

#contactDetails dt { float: left;  }
#contactDetails dd.spaced { margin-left: 1em;  }
#contactDetails address { margin-bottom: 10px; }

/* thickbox modal windows */
div#modalWindow { font-size: 1.1em; margin-top: 10px; margin-bottom: 0px; }
div#modalWindow p { margin-bottom: 5px; }
div#modalWindow h3 { font-size: 1em; margin-bottom: 0; }
div#modalWindow div#lCol { width: 231px; padding-right: 10px; } 
div#modalWindow div#rCol { width: 220px; float: left; text-align: left; }
li.border { border-bottom: 1px dashed #CCC; } 
#modalWindow input { border: none; }

/* wishlist */
#wishlistTable { width: 100%; }
#wishlistTable td { border-bottom : 1px dashed #CCC; border-right : 1px dashed #CCC; padding: 5px; }
#wishlistTable img { display: inline; }

td.nameCol { width: 60%; }
.nameCol input { margin-right: 5px; width: 20px; text-align: center; }
td.viewCol { text-align: center; }
#wishlistTable td.removeCol { border-right: none; text-align: center; }

/* enquiry page */
body#enquiry #lCol { width: 250px; float: left; padding-right: 30px; border-right: 1px dashed #CCC; border: none; }
#enquiry #rCol { width: 205px; ; float: left; padding-bottom: 10px; }  

/* error page */ 
ul.errors li { list-style-type: circle; list-style-position: inside;}
/*
==========================================================================
8 - Form styling
==========================================================================
*/
input, textarea {
	width: 140px;
	font-size: 1em;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #80AAEA;
	border-right-color: #80AAEA;
	border-bottom-color: #80AAEA;
	border-left-color: #80AAEA;
}
input { height: 16px; }
textarea#message {
	height: 70px;
}
textarea#address { height: 50px; }
input.button {
	height: 21px;
	width: 66px;


right; 			margin-top: 10px;
	background-color: #EE922B;
	border: 1px solid #FF6600;
	color: #123C8E;
}

.listingCategories,
.listingCategories a{
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	font-family: "Trebuchet MS", "Lucida Grande", Verdana, Arial, sans-serif;
	line-height: 14px;
}