/* CSS Document */

/* Neutralize styling: 
   Elements we want to clean out entirely: */
html, body, form, fieldset {
        margin: 0;
        padding: 0;
        font: 100%/120% Verdana, Arial, Helvetica, sans-serif;
}

/* Neutralize styling: 
   Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
        margin: 1em 0;
        padding: 0;
}

/* Apply left margin:
   Only to the few elements that need it: */
li, dd, blockquote {
        margin-left: 1em;
}

/* Miscellaneous conveniences: */
form label {
        cursor: pointer;
}
fieldset {
        border: none;
}
input, select, textarea {
        font-size: 100%;
		font-family: inherit;
}

body
{
  margin-top: 0;
  background: url(/shop/images/bg_page.gif) top left repeat-x #31383D;
  color: #CCCCCC;
  FONT-FAMILY: Arial, Helvetica, Verdana, sans-serif;
  min-width: 940px;
  text-align: center;
}

a:link {text-decoration: underline; color: #FFFFFF; background-color: transparent;}
a:visited {text-decoration: underline; color: #FFFFFF; background-color: transparent;}
a:hover {text-decoration: none; color: #FFFFFF; background-color: transparent;}

/*-- GENERAL BITS --------------*/
.container {margin: 0 auto; width: 940px; padding: 0; border: 0; position: relative; text-align: left;}


/*-- HEADER---------------------*/

.headerContainer {position: relative; float: left; display: inline; width: 940px; height: 130px; margin: 0; padding: 0;}

.headerNavBar {position: absolute; top: 84px; right: 0; height: 18px;}
	.headerNavBar ul {display: inline; float: right; list-style: none; margin: 0; padding: 0;}
	.headerNavBar li {display: inline; float: left; margin: 0 0 0 25px;}
	.headerNavBar li a {display: inline; float: left; height: 18px;}
	.headerNavBar li span {display: none;}
	
#nav01 a {background: url(/shop/images/nav_home_off.gif) top left no-repeat; width: 40px; height: 18px;}
#nav01 a:hover {background: url(/shop/images/nav_home_on.gif) top left no-repeat;}
#nav01on {background: url(/shop/images/nav_home_on.gif) top left no-repeat; width: 40px; height: 18px;}

#nav02 a {background: url(/shop/images/nav_view_images_off.gif) top left no-repeat; width: 84px; height: 18px;}
#nav02 a:hover {background: url(/shop/images/nav_view_images_on.gif) top left no-repeat;}
#nav02on {background: url(/shop/images/nav_view_images_on.gif) top left no-repeat; width: 84px; height: 18px;}

#nav03 a {background: url(/shop/images/nav_how_to_order_off.gif) top left no-repeat; width: 86px; height: 18px;}
#nav03 a:hover {background: url(/shop/images/nav_how_to_order_on.gif) top left no-repeat;}
#nav03on {background: url(/shop/images/nav_how_to_order_on.gif) top left no-repeat; width: 86px; height: 18px;}

#nav04 a {background: url(/shop/images/nav_sizing_finishes_off.gif) top left no-repeat; width: 106px; height: 18px;}
#nav04 a:hover {background: url(/shop/images/nav_sizing_finishes_on.gif) top left no-repeat;}
#nav04on {background: url(/shop/images/nav_sizing_finishes_on.gif) top left no-repeat; width: 106px; height: 18px;}

#nav05 a {background: url(/shop/images/nav_pricing_off.gif) top left no-repeat; width: 46px; height: 18px;}
#nav05 a:hover {background: url(/shop/images/nav_pricing_on.gif) top left no-repeat;}
#nav05on {background: url(/shop/images/nav_pricing_on.gif) top left no-repeat; width: 46px; height: 18px;}

#nav06 a {background: url(/shop/images/nav_contact_off.gif) top left no-repeat; width: 52px; height: 18px;}
#nav06 a:hover {background: url(/shop/images/nav_contact_on.gif) top left no-repeat;}
#nav06on {background: url(/shop/images/nav_contact_on.gif) top left no-repeat; width: 52px; height: 18px;}

.headerLogo {position: absolute; top: 70px; left: 0; width: 196px; height: 29px;}

.headerLoginDetails {position: absolute; top: 20px; left: 0;}
	.headerLoginDetails p {margin: 0; padding: 0; font-size: 12px; color: #CCCCCC; line-height: 1.1em;}
	.headerLoginDetails p strong {color: #FFFFFF;}

.headerBasket {position: absolute; width: 420px; height: 50px; background-color: #454E54; padding: 0 20px 0 20px; top: 0; right: 0;}
	.headerBasket p {position: relative; display: inline; float: left; font-size: 14px; color: #FFFFFF;}
	.headerBasket img {border: 0;}
.headerBasketLabel {position: relative; display: inline; float: left; margin: 16px 5px 0 0; border: 0;}
.headerBasketButton {position: relative; display: inline; float: right; margin: 11px 0 0 5px; border: 0;}

/*-- FOOTER --------------------*/
.footerArea {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 30px 0; border-top: 1px solid #616C73; padding: 20px 0 30px 0;}
	.footerArea p {font-size: 11px; color: #CCCCCC; display: inline; margin: 0; padding: 0; vertical-align:top;}

/*-- LOGIN PAGE --*/
.mainAreaLogin {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 0 0; padding: 0;}
	.mainAreaLogin h1 {margin: 10px 0 10px 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}

.loginBox {position: relative; float: left; display: inline; width: 900px; margin: 10px 0 10px 0; padding: 20px; background-color: #454E54;}
	.loginBox h2 {font-size: 18px; font-weight: normal; color: #FFFFFF; line-height: 1.2em; margin: 0 0 10px 0;}
	.loginBox p {font-size: 14px; color: #CCCCCC; line-height: 1.5em;}
	.loginBox form {padding: 0; margin: 10px 0 0 0;}
	.loginBox label {font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 16px; font-weight: normal; color: #FFFFFF; width: 90px; display: inline; float: left; padding: 5px 0 0 0;}
	.loginBox input { display: inline; float: left; font-family: Arial, Helvetica, Verdana, sans-serif; width: 200px; border: 1px solid #AAAAAA; background-color: #FFFFFF; font-size: 16px; padding: 4px; margin: 0 10px 0 0;}
	.loginBox img {margin: 3px 0 0 0; float: left; display: inline; border: 0;}

/*-- LISTINGS PAGE --*/
.mainAreaListings {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 0 0; padding: 0;}
	.mainAreaListings h1 {margin: 10px 0 0 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}

.listingsNavigation {position: relative; float: left; display: inline; width: 940px; margin: 10px 0 30px 0; padding: 0;}
	.listingsNavigation p {color: #CCCCCC; font-size: 16px; line-height: 1.1em; margin: 0 0 0.5em 0;}

.listingsNavigationBottom {position: relative; float: left; display: inline; width: 940px; margin: 10px 0 0 0; padding: 0;}
	.listingsNavigationBottom p {color: #CCCCCC; font-size: 16px; line-height: 1.1em; margin: 0 0 0.5em 0;}

.listingsRow {position: relative; display: inline; float: left; width: 940px; margin: 0 0 20px 0; padding: 0;}

.listingsItemHolder {position: relative; display: inline; float: left; width: 220px; margin: 0 20px 0 0;}
.listingsItemHolderRight {position: relative; display: inline; float: left; width: 220px; margin: 0;}

.listingsItemImage {position: relative; display: inline; float: left; height: 150px; border: 1px solid #616C73; width: 200px; padding: 9px; margin: 0; text-align: center;}
	.listingsItemImage img {border: 0; margin: 0; padding: 0;}

.listingsItemInfo {position: relative; display: inline; float: left; width: 200px; padding: 9px; border-top: 0; border-left: 1px solid #616C73; border-right: 1px solid #616C73; border-bottom: 1px solid #616C73;}
	.listingsItemInfo p {float: left; display: inline; position: relative; font-size: 12px; color: #CCCCCC; line-height: 1.1em; margin: 4px 0 0 0; padding: 0;}
	.listingsItemInfo img {border: 0; float: right; display: inline; position: relative;}

/*-- MAIN IMAGE ORDER PAGE --*/
.mainAreaOrderImage {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 20px 0; padding: 0;}
	.mainAreaOrderImage h1 {margin: 10px 0 0 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}
	
.orderImageLeftHolder {position: relative; float: left; display: inline; width: 230px; margin: 0 10px 0 0;}
	.orderImageLeftHolder h2 {font-size: 16px; color: #CCCCCC; line-height: 1.2em; font-weight: bold;}
	.orderImageLeftHolder h4 {font-size: 12px; color: #CCCCCC; line-height: 1.5em; font-weight: normal;}
	.orderImageLeftHolder h5 {font-size: 13px; color: #CCCCCC; line-height: 1.2em; font-weight: normal; margin: 30px 0 0 0;}
	.orderImageLeftHolder p {line-height: 1.1em; margin: 0.5em 0 0.2em 0;}
	.orderImageLeftHolder img {border: 0; margin: 20px 0 0 75px;}
	.orderImageLeftHolder form {margin: 25px 0 15px 0; padding: 0;}
	.orderImageLeftHolder label {font-size: 14px; color: #FFFFFF; width: 75px; margin: 0; display: block; float: left;}

.formProductQuantity {width: 50px; border: 1px solid #999999; background-color: #FFFFFF; font-size: 13px; padding: 2px 0 2px 0;}
.formProductSelect {width: 225px; background-color: #FFFFFF; font-size: 11px; color: #333333; margin: 0 0 6px 0;}

.orderImageRightHolder {position: relative; float: left; display: inline; width: 660px; padding: 19px; border: 1px solid #616C73; text-align: center;}
	.orderImageRightHolder img {border: 0;}

/*-- INFO PAGES --*/
.mainAreaInfo {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 20px 0; padding: 0;}
	.mainAreaInfo h1 {margin: 10px 0 0 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}

.infoLeftColumn {position: relative; float: left; display: inline; width: 700px; margin: 0 20px 0 0; padding: 0;}
	.infoLeftColumn h2 {font-size: 16px; color: #CCCCCC; line-height: 1.2em; font-weight: bold;}
	.infoLeftColumn p {line-height: 1.7em; font-size: 14px; color: #CCCCCC;}
	.infoLeftColumn ul {font-size: 14px; color: #CCCCCC;}
	.infoLeftColumn li {line-height: 1.8em; margin: 0 0 0 20px;}

.infoRightColumn {position: relative; float: left; display: inline; width: 220px; margin: 0; padding: 0;}

.infoRightBoxout {position: relative; float: left; display: inline; width: 180px; background-color: #454E54; padding: 20px;}
	.infoRightBoxout h2 {font-size: 16px; color: #CCCCCC; line-height: 1.2em; font-weight: bold; margin: 0 0 1em 0; padding: 0;}
	.infoRightBoxout p {line-height: 1.7em; font-size: 14px; color: #CCCCCC;}
	.infoRightBoxout ul {font-size: 14px; color: #CCCCCC;}
	.infoRightBoxout li {line-height: 1.8em; margin: 0 0 0 20px;}

/*-- YOUR BASKET --*/
.mainAreaBasket{position: relative; float: left; display: inline; width: 940px; margin: 20px 0 20px 0; padding: 0;}
	.mainAreaBasket h1 {margin: 10px 0 10px 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}
	.mainAreaBasket h3 {font-size: 16px; color: #CCCCCC; line-height: 1.5em; font-weight: normal;}
	.mainAreaBasket h4 {background: url(/shop/images/icon_warning.gif) center left no-repeat; padding: 0 0 0 20px; line-height: 1.6em; color: #FFCC33; font-size: 16px; font-weight: bold;}
	.mainAreaBasket p {font-size: 14px; color: #CCCCCC; line-height: 1.5em;}
	.mainAreaBasket img {border: 0;}

/*-- TABLE FORMATTING --*/
.basketTable table {border: 0;}
	.basketTable img {border: 0;}
.basketTable th {background-color: #FFFFFF; color: #333333; font-size: 14px; font-weight: bold; padding: 1em 0 1em 0; text-align: left;}
.basketTable th span {font-weight: normal; color: #666666;}
.basketTable td {font-size: 14px; font-weight: normal; color: #CCCCCC; padding: 1em 0 1em 0;}

.basketTableDelete {text-align: center;}
	.basketTableDelete img {border: 0;}

.basketTableRowOdd {background-color: #31383D;}
.basketTableRowEven {background-color: #444C52;}
.basketTableRowTotal {background-color: #FFFFFF; color: #333333;}

td.basketTablePostage {text-align: right; padding-right: 10px;}

td.basketTableTotalLabel {color: #333333; font-weight: bold; text-align: right; padding-right: 10px;}
td.basketTableTotal {color: #333333; font-weight: bold;}

/*-- FORM PAGES --*/
.mainAreaForm {position: relative; float: left; display: inline; width: 940px; margin: 20px 0 20px 0; padding: 0;}
	.mainAreaForm h1 {margin: 10px 0 20px 0; padding: 0; text-indent: -9000px; line-height: 1em; font-size: 10px;}

.formLeftColumn {position: relative; float: left; display: inline; width: 660px; margin: 0 20px 0 0; background-color: #454E54; padding: 20px;}
	.formLeftColumn h2 {font-size: 16px; color: #CCCCCC; line-height: 1.2em; font-weight: bold;}
	.formLeftColumn h3 {font-size: 16px; color: #CCCCCC; line-height: 1.5em; font-weight: normal; margin: 0;}
	.formLeftColumn p {line-height: 1.7em; font-size: 14px; color: #CCCCCC;}
	.formLeftColumn ul {font-size: 14px; color: #CCCCCC;}
	.formLeftColumn li {line-height: 1.8em; margin: 0 0 0 20px;}
	.formLeftColumn form {padding: 0; margin: 10px 0 0 0;}
	.formLeftColumn label {font-family: Arial, Helvetica, Verdana, sans-serif; font-size: 16px; font-weight: normal; color: #FFFFFF; width: 180px; margin: 0 20px 0 0; display: inline; float: left; padding: 5px 0 0 0;}
	.formLeftColumn fieldset {margin: 0; padding: 0; border: 0;}

.formContactText {width: 446px; border: 1px solid #AAAAAA; background-color: #FFFFFF; font-size: 13px; padding: 4px; margin: 0;}
.formContactTextShort {width: 50px; border: 1px solid #AAAAAA; background-color: #FFFFFF; font-size: 13px; padding: 4px; margin: 0;}
.formContactSelect {width: 446px; background-color: #FFFFFF; font-size: 13px; height: 26px; margin: 0;}
.formContactSelectShort {width: 50px; background-color: #FFFFFF; font-size: 13px; height: 26px; margin: 0;}

.contactFormButtons {position: relative; float: right; display: inline; width: 456px; margin: 10px 0 0 0;}
.formButton {padding: 4px 5px 4px 5px; margin: 10px 0 0 0; background-color: #D8DFE3; border: 1px solid #FFFFFF; color: #31383D; font-size: 14px; font-weight: bold;}


.formRightColumn {position: relative; float: left; display: inline; width: 220px; margin: 20px 0 0 0; padding: 0;}
	.formRightColumn h2 {font-size: 16px; color: #CCCCCC; line-height: 1.2em; font-weight: bold; margin: 0 0 1em 0; padding: 0;}
	.formRightColumn p {line-height: 1.7em; font-size: 14px; color: #CCCCCC;}
	.formRightColumn ul {font-size: 14px; color: #CCCCCC;}
	.formRightColumn li {line-height: 1.8em; margin: 0 0 0 20px;}

/* JavaScript drop-downs */
.trigger{
	border:1px solid #ccc;
	color:green;
	width:15em;
	padding-right:1em;
	background:url(/shop/images/down_arrow.gif) top right no-repeat #fff;
	display:block;
}
.activetrigger{
	border:1px solid #ccc;
	color:green;
	width:15em;
	padding-right:1em;
	display:block;
	background:#ccc;
}
/* style of the UL */
.dropcontainer ul{
	background:#fff;
	border:1px solid #999;
	border-bottom:none;
	list-style-type:none;
	padding:0;
	margin:0;
	width:16em;
	position:absolute;
}
.dropdownhidden{
	top:0;
	left:-999em;
}
.dropdownvisible{
	top:0;
	left:0;
}
.dropcontainer ul a{
	padding:0 .5em;
	display:block;
	width:15em;
	text-decoration:none;
	color:#666;
	border-bottom:1px solid #999;
}
.dropcontainer ul a:hover{
	background:#ccc;
}
.dropcontainer{
	position:relative;
}