/*------------------------------------------------------------------------------------*/
/* BASIC FORMATING
/*------------------------------------------------------------------------------------*/
html {
	height: 100%;
}

body {
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px;
	background-color: #F9E000;
	color: #333;
}

form {
	margin: 0;
	padding: 0;
}

a, a:hover {
}

h1 {
	font-size: 18px;
	font-weight: bold;
}
	
	h1.welcome {
		width: 386px;
		height: 28px;
		background-color: transparent;
		background-image: url(../../images/component/welcome.gif);
		background-repeat: no-repeat;
		border: none;
		text-indent: -9999px;
		overflow: hidden;
	}
	
	h1.featured {
		width: 301px;
		height: 28px;
		background-color: transparent;
		background-image: url(../../images/component/featured.gif);
		background-repeat: no-repeat;
		border: none;
		text-indent: -9999px;
		overflow: hidden;
	}

h2 {
	font-size: 1.2em;
}

	h2 span {
		float: right;
	}

p {
	font-size: 12px;
}

/*------------------------------------------------------------------------------------*/
/* FORM ELEMENTS
/*------------------------------------------------------------------------------------*/
input, textarea {
	font-size: 12px;
	font-weight: normal;
}

select {
	font-size: 12px;
	font-weight: normal;
}

/*------------------------------------------------------------------------------------*/
/* MULTIPLE USE SELECTORS
/*------------------------------------------------------------------------------------*/
.clearBoth {
	width: 100%;
	height: 0px;
	clear: both;
}

.clearLeft {
	clear: left;
}

.floatRight {
	float: right;
}

.center {
	text-align: center;
}

.button {
	width: auto;
	height: auto;
	font-weight: normal;
	font-size: 12px;
	cursor: pointer;
}

/*------------------------------------------------------------------------------------*/
/* STANDARD TEXT & LINKS
/*------------------------------------------------------------------------------------*/
.jssSmallerText {
	font-size: 11px;
	width: 100%;
}

.jssBoldLinks { 
	font-size: 12px;
	text-decoration: underline; 
	font-weight: bold;
}

.jssBoldLinks:hover { 
	text-decoration: none; 
	font-weight: bold;
}

.jssProductTitle {
	font-size: 12px;
	text-decoration: none; 
}

.jssProductTitle:hover {
	font-size: 12px;
	text-decoration: none; 
}

.jssPrice {
	font-weight: bold;
	font-size: 1.2em;
}

.jssProductLinks, jssProductLinks:link {
	padding: 1px 1px;
	margin: 2px 2px 0px 0px;
	font-size: 12px;
	white-space: nowrap;
	font-weight: bold;
	border: 0px;
	cursor: pointer;
}

.jssProductAdd {
	padding: 1px 1px;
	margin: 2px 2px 0px 0px;
	margin-left: 0px;
	padding-top: 0px;
	font-size: 12px;
	font-weight: bold;
	border: 0px;
	text-align: left;
	cursor: pointer;
}

/*------------------------------------------------------------------------------------*/
/* HEADER
/*------------------------------------------------------------------------------------*/
div#header {
	width: 100%;
	height: 115px;
	margin: 0px;
	padding: 0px;
	background-color: #F9E000;
	background-image: url(../../images/component/header-bg.gif);
	background-position: bottom;
	background-repeat: repeat-x;
}

	div#headerContent {
		width: 900px;
		height: 115px;
		margin: 0px auto;
		padding: 0px;
		position: relative;
	}


		img#logo {
			margin: 20px 0px 0px 0px;
			float: left;
			border: 0px;
		}
		
div#headerLogin {
	margin: 17px 0px 0px 0px;
	float: right;
	font-size: 11px;
}
		
	#headerInputEmailCont, #headerInputPasswordCont {
		width: 106px;
		margin: 0px 10px 0px 0px;
		float: left;
		background-image: url(../../images/component/header-input-bg.gif);
		background-repeat: no-repeat;
	}
			
		input.headerInputEmail, input.headerInputPassword {
			width: 99px;
			height: 17px;
			margin: 4px 0px 7px 4px;
			padding: 0px;
			border: 0px;
			color: #333;
		}
	
		input.headerInputEmail {
			background-image: url(../../images/component/email-input-bg.gif);
			background-position: left;
			background-repeat: no-repeat;
		}
		
		input.headerInputPassword {
			background-image: url(../../images/component/password-input-bg.gif);
			background-position: left;
			background-repeat: no-repeat;
		}
		
		input.headerSubmit {
			width: 52px;
			height: 24px;
			background-color: transparent;
			background-image: url(../../images/component/header-submit-bg.gif);
			background-repeat: no-repeat;
			border: none;
			text-indent: -9999px;
			cursor: pointer;
		}
		
		#headerInputEmailCont a, #headerInputPasswordCont a {
			color: #978800;
			text-decoration: none;
		}
		
			#headerInputEmailCont a:hover, #headerInputPasswordCont a:hover {
				color: #333;
			}
	
	a.headerAccountLink {
		width: 82px;
		height: 24px;
		margin: 5px 10px 0px 0px;
		float: left;
		background-image: url(../../images/component/header-account-bg.gif);
		text-indent: -9999px;
		overflow: hidden;
	}
	
	a.headerLogoutLink {
		width: 52px;
		height: 24px;
		margin: 5px 0px 0px 0px;
		float: left;
		background-image: url(../../images/component/header-logout-bg.gif);
		text-indent: -9999px;
		overflow: hidden;
	}
	
div#taglines, div#taglines-large {
	width: 460px;
	margin: 25px 0 0 25px;
	float: left;
	text-align: center;
}

	div#taglines p {
		margin: 0 0 15px;
		font-size: 0.75em;
	}
	
	div#taglines p strong {
		font-size: 1.2em;
	}
	
div#taglines-large {
	margin: 40px 0 0 25px;
}

	div#taglines-large p {
		margin: 0;
		font-size: 1.7em;
	}

div#miniCart {
	width: 900px;
	height: 100px;
	margin: 0 auto 15px;
	padding: 0px;
	background-color: #FFF;
}

	div#miniCartContent {
		float: right;
	}
	
		div#miniCartBasket, div#miniCartCheckout {
			height: 27px;
			margin: 10px 0px 0px 40px;
			padding: 10px 46px 0px 0px;
			float: right;
			background-position: right;
			background-repeat: no-repeat;
			font-size: 12px;
		}
		
		div#miniCartBasket {
			margin: 15px 0 0;
			background-image: url(../../images/component/basket.gif);
		}
		
		div#miniCartCheckout {
			clear: right;
			background-image: url(../../images/component/checkout.gif);
		}
		
			div#miniCartBasket span, div#miniCartCheckout span {
				float: left;
			}
		
			div#miniCartBasket a, div#miniCartCheckout a {
				margin-left: 3px;
				border-bottom: 1px dashed #333;
				color: #333;
				font-weight: bold;
				text-decoration: none;
				float: left;
			}
			
			div#miniCartBasket a:hover, div#miniCartCheckout a:hover {
				border-bottom: 1px solid #333;
			}

/*------------------------------------------------------------------------------------*/
/* CONTAINER
/*------------------------------------------------------------------------------------*/
#containerFull {
	width: 100%;
	padding: 0 0 60px;
	background-color: #FFF;
}

#container {
	width: 900px;
	margin: 0px auto;
	padding: 0px;
	clear: both;
	background-color: #FFF;
}

/*------------------------------------------------------------------------------------*/
/* LEFT & RIGHT COLUMN
/*------------------------------------------------------------------------------------*/
div#jssLeftMenu {
	width: 160px;
	margin: 0px;
	float: left;
	clear: left;
	font-size: 14px;
}

div#jssRightMenu {
	width: 150px;
	margin: 0px;
	float: left;
	font-size: 14px;
}

	.jssSectionList {
		margin: 0px;
		padding: 0px;
		list-style-type: none;
	}
	
		.jssSectionList li {
			margin: 0px 0px;
			padding: 2px 0px;
		}
		
			.jssSectionList li a {
				display: block;
				color: #333;
				text-decoration: none;
			}
			
			.jssSectionList li a:hover {
				color: #000;
				font-weight: bold;
			}
	
		.jssSubSectionList {
			margin: 0px;
			padding: 0px;
			padding-left: 14px;
			list-style-type: none;
		}

.jssCustomerLinks {
	margin: 0px;
	padding: 0px;
	padding-left: 5px;
	list-style-type: none;
}

.jssNewsLinks {
	margin: 0px;
	padding: 0px;
	padding-left: 17px;
	list-style-type: none;
}

/*------------------------------------------------------------------------------------*/
/* LEFT & RIGHT BOXES
/*------------------------------------------------------------------------------------*/
.jssMenuBox {
	width: 160px;
	margin: 0px 0px 10px 0px;
}

.jssMenuBoxTitle {
	width: 160px;
	height: 34px;
	background-image: url(../../images/component/side-menu-header.gif);
	background-repeat: no-repeat;
	font-size: 12px;
	text-indent: -9999px;	
}

.jssMenuBoxContent,
.jssMenuBoxContentCent {
	padding: 5px;
	border: 1px solid #DEDEDE;
	border-top: none;
	font-size: 12px;
}

.jssMenuBoxContent {
	text-align: left;
}

.jssMenuBoxContent:after { content: ""; display: block; height: 0; clear: both; }

.jssMenuBoxContentCent {
	text-align: center;
}

.jssProductListMain {
	clear: both;
	margin-bottom: 2px;
	padding-top: 2px;
}

.jssProductListTitle {
	float: left;
	margin-right: 5px;
}

/*------------------------------------------------------------------------------------*/
/* SEARCH FORM
/*------------------------------------------------------------------------------------*/
#searchForm {
	margin: 0px;
	padding: 0px;
}

	#searchForm ul {
		margin: 0px;
		padding: 0px;
		list-style-type: none;
	}
	
		#searchForm li {
			margin: 0px;
			padding: 0px;
			float: left;
		}
		
			#searchForm input.searchInput, #searchForm input.searchSubmitButton {
				margin: 0px;
				padding: 0px;
				float: left;
			}
		
			#searchForm input.searchInput {
				width: 80px;
				padding: 2px;
				font-size: 11px;
			}
			
			#searchForm input.searchSubmitButton {
				width: 50px;
				margin: 0px 0px 0px 7px;
			}

/*------------------------------------------------------------------------------------*/
/* MAIN CONTENT, HEADINGS
/*------------------------------------------------------------------------------------*/
div#jssMainContent {
	width: 730px;
	margin: 0 10px 0 0;
	font-size: 14px;
	float: left;
}

div#jssMainContentShop {
	width: 560px;
	margin: 0 10px;
	font-size: 14px;
	float: left;
}

.jssPageHeading {
	font-size: 1.5em;
	font-weight: bold;
	padding: 3px 0px;
	margin-bottom: 10px;
}

.jssPageSubHeading {
	font-size: 1em;
	font-weight: bold;
	padding: 3px;
	margin-bottom: 10px;
	margin-top: 10px;
	clear: both;
}

/*------------------------------------------------------------------------------------*/
/* BREADCRUMB
/*------------------------------------------------------------------------------------*/
div#jssMainContent .jssBreadcrumb, div#jssMainContent .productSort {
	width: 730px;
	height: 24px;
	margin: 0px 0px 10px 0px;
	padding: 10px 0px 0px 10px;
	background-image: url(../../images/component/breadcrumb-wide.gif);
	background-repeat: no-repeat;
	font-size: 12px;
}

div#jssMainContentShop .jssBreadcrumb, div#jssMainContentShop .productSort {
	width: 560px;
	height: 24px;
	margin: 0px 0px 10px 0px;
	padding: 10px 0px 0px 10px;
	background-image: url(../../images/component/breadcrumb.gif);
	background-repeat: no-repeat;
	font-size: 12px;
}

.jssBreadcrumbTitle {
	font-weight: bold;
	padding-left: 3px;
	margin-right: 3px;
}

	.productSort select {
		float: right;
		position: relative;
		top: -2px;
		right: 20px;
		border: auto;
	}

/*------------------------------------------------------------------------------------*/
/* FOOTER
/*------------------------------------------------------------------------------------*/
div#footer {
	width: 100%;
	margin: 0px;
	padding: 20px 0px 50px 0px;
	clear: both;
	background-color: #F9E000;
	background-image: url(../../images/component/footer-bg.gif);
	background-position: top;
	background-repeat: repeat-x;
}

div#footer a {
	font-weight: bold;
}

	div#footerContent {
		width: 900px;
		margin: 0px auto;
	}

		div#footerLinks {
			float: left;
			font-size: 12px;
		}
		
			div#footerLinks ul	{
				margin: 0px;
				padding: 0px;
				list-style-type: none;
			}
			
				div#footerLinks li {
					margin: 0px 10px 0px 0px;
					padding: 0px;
					float: left;
				}
				
					div#footerLinks a { 
						padding: 0px;
						margin: 0px;
						float: left;
					}

		div#usersOnline {
			margin-left: auto;
			margin-right: auto;
			text-align: center;
			clear: both;
			font-size: 12px;
		}
		
		div#copyright {
			float: right;
			font-size: 12px;
			text-align: right;
		}

/*------------------------------------------------------------------------------------*/
/* FEATURED PRODUCTS (HOME)
/*------------------------------------------------------------------------------------*/
.jssIndexProductThumbnail {
	float: left;
	margin-right: 5px;
	padding: 3px;
}

.jssIndexFullWidth {
	clear: both;
	text-align: center;
	width: 100%;
}

.jssIndexColLeft, .jssIndexColRight {
	width: 49%;
	float: left;
	padding: 5px 0 15px 0;
	border-bottom: 1px solid #CCC;
}

.jssIndexColRight {
	float: right;
}

.jssIndexProductBlock {
	width: 100%;
	lear: both;
	text-align: left;
}

.jssIndexProductGap {
	width:2%; float: left;
}

.jssIndexColLeft input, .jssIndexColRight input {
	margin: 7px 0;
}

/*------------------------------------------------------------------------------------*/
/* PAGINATION
/*------------------------------------------------------------------------------------*/
div#pagescontainer {
	float: right;
	position: relative;
	top: 0px;
	padding: 1px;
	margin-bottom: 5px;
}

ul#pageslist {
	margin: 0;
	white-space: nowrap;
}

#pageslist li {
	display: inline;
	list-style-type: none;
	margin: 0px;
	padding: 3px 5px; 
	font-weight: normal;
	font-size: 12px;
}

#pageslist a {
	margin: 0px; 
	font-weight: normal; 
	font-size: 14px;
}

#pageslist a:link, #npageslist a:visited {
	text-decoration: none;
}

#pageslist a:hover {
	text-decoration: none;
}

/*------------------------------------------------------------------------------------*/
/* SEND TO A FRIEND
/*------------------------------------------------------------------------------------*/
.jssSendFriendDiv {
	float:right; font-weight: bold;
}

.jssSendFriendDiv a { 
	font-size: 14px;
	text-decoration: none; 
}

.jssSendFriendDiv a:hover {  
	text-decoration: underline; 
	cursor: pointer;
}


/*------------------------------------------------------------------------------------*/
/* SECTIONS
/*------------------------------------------------------------------------------------*/
#jssSectionTitle {
	font-size: 0.95em;
}

.jssSectionContent {
	clear: both;
	padding-top: 10px;
}

/* SUB SECTIONS */
.jssSubSecDiv {
	width: 100%;
	clear: both;
	text-align: left;
}

.jssSubSecTitle {
	padding-top: 3px;
}

/* PRODUCTS IN SECTIONS */
.jssSecProductDiv {
	clear: both;
	text-align: left;
	margin: 0px auto 5px auto;
	padding: 0px 0px 5px 0px;
	border-bottom: 1px solid #BBB;
}

.jssSecImages {
	float: left;
	margin-right: 5px;
	padding: 3px;
}

.jssSecFlagsDiv {
	float: right;
	width: 5em;
	margin-left: 5px;
	padding: 3px;
}

	.jssProductFlag {
		margin-bottom: 3px; 
		padding: 0px 2px; 
		font-size: 0.7em; 
		white-space: nowrap;
		font-weight: normal;
		text-align: right;
	}
	
.jssSecProductTitle {
	padding: 3px 0px;
}

.jssSecProductPrice {
	margin: 5px 0px;
	font-size: 0.85em;
}

.jssLinksDiv {
	padding: 3px;
	font-weight: bold;
}

.jssProductSep {
	clear: both;
	border: 0px;
	margin-bottom: 5px;
	height: 5px;
}

/*------------------------------------------------------------------------------------*/
/* PRODUCTS
/*------------------------------------------------------------------------------------*/
.jssProductFullImage {
	float: left;
	margin: 0px 10px 15px 0px;
	border: 1px solid;
}

.jssProductOptionsDiv {
	float: right;
	width: 254px;
}

.jssProductFieldsDiv {
	float: left;
	margin-left: 5px;
	text-align: left;
}

/*------------------------------------------------------------------------------------*/
/* PRODUCT OPTIONS / PRICING TABLES
/*------------------------------------------------------------------------------------*/
.jssProductTableDiv {
	text-align: center;
}

.jssProductTable {
	margin-left: auto;  margin-right: auto;
	padding: 0px;
	width: 100%;
	border: 0px;
}

.jssProductTable caption {
	margin-left: auto;  margin-right: auto;
	text-align: right;
	font-weight: bold;
	font-size: 0.70em;
}

.jssProductTable th {
	font-weight: bold;
	padding: 2px;
	text-align: left;
	font-size: 0.70em;
	vertical-align: top;
}

.jssProductTable td {
	font-weight: normal;
	padding: 2px;
	text-align: left;
	font-size: 0.70em;
}

/*------------------------------------------------------------------------------------*/
/* FORM TABLE STYLING
/*------------------------------------------------------------------------------------*/
.jssForm {
}

.jssFormRow {
	clear: both;
	height: 15px;
	font-size: 12px;
	margin: 5px 0 0 0;
} 

.jssFormCol1 {
	float: left;
	width: 150px;
	text-align: left;
	height: 15px;
	padding: 2px;
	margin-right: 2px;
	font-weight: bold;
}

.jssFormCol2 {
	float: left;
	text-align: left;
}	

.jssError {
	font-size: 12px;
	font-weight: normal;
}

.jssFormDiv {
	text-align: center;
}

.jssFormTable {
	margin-left: auto;  margin-right: auto;
	padding: 0px;
	border: 0px;
}

.jssFormTable caption {
	margin-left: auto;  margin-right: auto;
	font-size: 0.70em;
}

.jssFormTable th {
	font-weight: bold;
	padding: 2px;
	text-align: left;
	font-size: 12px;
	vertical-align: top;
	padding-top: 3px;
}

.jssFormTable td {
	font-weight: normal;
	padding: 2px;
	text-align: left;
	font-size: 12px;
}

.jssFormTable td.jssFormSubmit {
	text-align: right;
}

.jssFormTable input {
	font-size: 14px; 
	font-weight: normal;
}

.jssFormTable select {
	font-size: 14px; 
	font-weight: normal;
}

.jssFormTable td.jssFormSubmit input {
	font-weight: normal;
	font-size: 12px;
	cursor: pointer;
}

.jssFormError {
	font-weight: bold;
	font-size: 12px;
}

/*------------------------------------------------------------------------------------*/
/* CART TABLE STYLING + CHECKOUT
/*------------------------------------------------------------------------------------*/
.jssCartDiv {
}

.jssCartTable {
	width: 100%;
	padding: 0px;
	border: 0px;
}

.jssPCentered {
	text-align: center;
}

.jssCartTable th {
	font-weight: bold;
	padding: 2px;
	text-align: left;
	font-size: 0.80em;
	vertical-align: top;
}

.jssCartTable th.right {
	font-weight: bold;
	padding: 2px;
	text-align: right;
	font-size: 0.70em;
	vertical-align: top;
}

.jssCartTable td {
	font-weight: normal;
	padding: 2px;
	text-align: left;
	font-size: 0.80em;
	vertical-align: top;
}

.jssCartTable td.right {
	font-weight: normal;
	padding: 2px;
	text-align: right;
	font-size: 0.70em;
	vertical-align: top;
}

.jssCartTable th.total {
	font-weight: bold;
	padding: 2px;
	text-align: right;
	font-size: 12px;
	vertical-align: top;
}

.selectAddress {
	float: right;
}

/*------------------------------------------------------------------------------------*/
/* GENERAL TABLE STYLING
/*------------------------------------------------------------------------------------*/
.jssGeneralTableDiv {
	text-align: center;
}

.jssGeneralTable {
	margin-left: auto;  margin-right: auto;
	padding: 0px;
	border: 0px;
}

.jssGeneralTable caption {
	margin-left: auto;  margin-right: auto;
	text-align: right;
	font-weight: bold;
	font-size: 0.70em;
}

.jssGeneralTable th {
	font-weight: bold;
	padding: 2px;
	text-align: left;
	font-size: 0.70em;
	vertical-align: top;
}

	.jssGeneralTable th a {
		text-decoration: underline;
	}

.jssGeneralTable td {
	font-weight: normal;
	padding: 5px;
	text-align: left;
	font-size: 0.85em;
}

.jssGeneralTable td.bold {
	font-weight: bold;
	padding: 2px;
	text-align: left;
	font-size: 0.85em;
}

/*.jssGeneralTable a {
	padding: 1px 1px;
	margin: 2px 2px 0px 0px;
	font-size: 14px;
	white-space: nowrap;
}

.jssGeneralTable a:link, .jssGeneralTable a:visited
{
	text-decoration: none;
	font-weight: bold;
	font-size: 14px;
}

.jssGeneralTable a:hover
{
	text-decoration: underline;
	font-weight: bold;
	font-size: 14px;
}*/

/*------------------------------------------------------------------------------------*/
/* CATALOGUE
/*------------------------------------------------------------------------------------*/

.catalogue-group {
	margin: 0 0 30px 0;
	overflow: auto;
	clear: left;
}

.catalogue-group ul {
	margin: 0;
	padding: 0;
	clear: left;
	list-style-type: none;
}

	.catalogue-group li {
		width: 165px;
		height: 160px;
		margin: 0;
		padding: 5px 8px;
		float: left;
		border-right: 1px solid #CCC;
		border-bottom: 1px solid #CCC;
		font-size: 0.9em;
		text-align: center;v
	}
	
		.catalogue-group li img {
			margin: 0 0 5px 0;
		}
	
.cat-prod-desc {
	font-size: 0.8em;
}


.cat-prod {
	margin: 20px 0;
	padding: 0 0 20px 0;
	border-bottom: 1px solid #BBB;
}