@charset "UTF-8";
/* CSS Document */

/* Neutralize styling: 
   Elements we want to clean out entirely: */
html, body, form, fieldset {margin: 0; padding: 0; font: 100% "Trebuchet MS", Arial, Helvetica, Verdana, 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; line-height: 1.2em;}

/* 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: 90%; font-family: inherit;}
img {border: 0;}

/* Sundries */
.clearFloat {clear:both; height:0; font-size: 1px; line-height: 0px;}
.leftImage {float: left; padding: 0; margin: 10px 10px 10px 0;}
.rightImage {float: right; padding: 0; margin: 10px 0 10px 10px;}
.hide {display: none;}


/*---------------------------------- Master Layout Components ----------------------------------*/

body {margin: 0; padding: 20px 0; background-color: #C3E5EF; color: #FFFFFF; font-family: "Trebuchet MS", Arial, Helvetica, Verdana, sans-serif; text-align: center; line-height: 1.2em;}


/*------------ Header Components ------------*/

.header {width: 910px; height: 71px; padding: 38px 50px 0 0; margin: 0 auto; background: url(/css-images/header.gif) top no-repeat; text-align: right; color: #0C6C88; font-weight: normal; font-size: 155%;}


/*------------ Navigation Components ------------*/

#navBar {width: 960px; font-size: 70%; background: url(/css-images/button-grad-off.gif) left repeat-x; padding: 0 0; margin: 0 auto; border-top: #FFFFFF 2px solid; border-bottom: #FFFFFF 2px solid;}
		#navBar ul {list-style: none; display: block; margin: 0; padding: 0;}
		/*#navBar ul .firstLink {border-left: #16BFF1 2px groove;}*/
		#navBar ul .firstLink {border-left: none;}
				#navBar ul li {padding: 0; margin: 0; float: left; display: block; border-right: #16BFF1 2px groove;}
						#navBar li a:link, #navBar li a:visited {float: left; display: block; padding: 0.5em 13px 0.4em 13px; margin: 0; color: #FFFFFF; text-decoration: none; background-image: none;}
						#navBar li a:hover, #navBar li a:active {color: #FFFFFF; text-decoration: none; background: url(/css-images/button-grad-on.gif) left repeat-x;}
						#navBar li a:link.topNavOn, #navBar li a:visited.topNavOn {color: #FFFFFF; background: url(/css-images/button-grad-on.gif) left repeat-x;}
						#navBar li a:hover.topNavOn, #navBar li a:active.topNavOn { /*Nothing*/ }
						

/*------------ Sub Navigation Components ------------*/

.subNavBar {width: 160px; font-size: 70%; background: url(/css-images/sub-nav-grad.gif) top repeat-x; padding: 0 10px 295px 10px; margin: -20px 0 0 0; float: left;}
		.subNavBar ul {list-style: none; display: block; margin: 0; padding: 0;}
		.subNavBar ul .lastLink {border-bottom: none;}
				.subNavBar ul li {padding: 0; margin: 0; display: block; border-bottom: #7BA7B4 1px solid;}
						.subNavBar li a:link, .subNavBar li a:visited {display: block; padding: 0.8em 0; margin: 0; color: #007CB9; text-decoration: none;}
						.subNavBar li a:hover, .subNavBar li a:active {color: #0B54A5; text-decoration: underline;}
						.subNavBar li a:link.subNavOn, .subNavBar li a:visited.subNavOn {color: #0B54A5;}
						.subNavBar li a:hover.subNavOn, .subNavBar li a:active.subNavOn { /*Nothing*/ }


/*------------ Main Page Content ------------*/
.mainContent {width: 960px; padding: 20px 0; margin: 0 auto; background-color: #FFFFFF; text-align: left;}
		.mainContent h1 {color: #0C6C88; font-size: 130%; font-weight: normal; font-style: italic; padding: 1.0em 0 0 0; margin: 0;}
		.mainContent h2 {color: #1197BE; font-size: 100%; font-weight: normal; padding: 1.0em 0 0 0; margin: 0;}
		.mainContent h3 {color: #1197BE; font-size: 90%; font-weight: normal; font-style: normal; padding: 1.0em 0 0 0; margin: 0;}
		.mainContent a:link, .mainContent a:visited {color: #000000; text-decoration: underline;}
		.mainContent a:hover, .mainContent a:active {color: #0B54A5;}
		.mainContent p {color: #000000; font-size: 80%; padding: 0.6em 0 0 0; margin: 0;}
				.mainContent p.smallText {font-size: 60%;}
		
		/*------------ Page Copy Content ------------*/
		.copyContent {width: 550px; padding: 135px 0 0 0; margin: 0 auto 0 auto; background-color: transparent; text-align: left;}
				.copyContent img {float: right; margin: 10px 0 20px 20px; padding: 0;}
				
				.copyContent ul {color: #000000; padding: 0.6em 0 0 20px; margin: 0;}
						.copyContent ul li {color: #1197BE; font-size: 80%; padding: 0.3em 0 0 0; margin: 0; list-style: disc;}
		
		/*------------ Right Hand Banner Content ------------*/
		.rhBannerContent {width: 160px; padding: 0 20px 0 0; margin: 0; background-color: transparent; text-align: left; float: right;}
				.rhBannerContent img {margin: 0 0 10px 0; padding: 0; display: block;}
				
				/*------------ Join Our Mailing List Content ------------*/
				.mailingList {width: 160px; padding: 10px 0 0 0; background: url(/css-images/mailing-list-bg.gif) top no-repeat;}
						.mailingList h1 {font-size: 150%; font-weight: normal; color: #FFFFFF; text-align: right; padding: 0 10px 10px 10px; margin: 0;}
						.mailingList form {width: 140px; padding: 0 10px;}
								.mailingList form {width: 140px; padding: 0 10px;}
										.mailingList form div {padding: 0 0 10px 0;}
										.mailingList form label {font-size: 90%; font-weight: normal; color: #FFFFFF; padding: 0.7em 0 0 0; margin: 0; cursor: pointer;}
										.mailingList form input.txt {color: #000000; background-color: #FFFFFF; border: 1px solid #6A4788; width: 134px; padding: 2px; margin: 0;}
										.mailingList form input.btn {font-size: 80%; font-weight: normal; color: #FFFFFF; width: 140px; padding: 6px 0; margin: 0; border: none; display: block; background: url(/css-images/mailing-list-button.gif) left no-repeat; cursor: pointer;}
						
						.mailingListFoot {width: 160px; height: 10px; padding: 0; margin: 0; background: url(/css-images/mailing-list-foot.gif) bottom no-repeat;}
					

/*------------ Footer Components ------------*/

.footerContent {width: 928px; padding: 10px 16px 16px 16px; margin: 0 auto; background: #16BFF1 url(/css-images/footer-bg.gif) bottom no-repeat; text-align: left;}
		.footerContent h1 {font-size: 140%; font-weight: normal; font-style: italic; line-height: 0.8em; padding: 0; margin: 0; text-align: center;}
		.footerContent p {font-size: 70%; padding: 2.6em 0 0 0; margin: 0; line-height: 1.0em;}
				.footerContent p a:link, .footerContent p a:visited {color: #FFFFFF; text-decoration: none;}
				.footerContent p a:hover, .footerContent p a:active {color: #FFFFFF; text-decoration: underline;}
				.footerContent p.copyright {float:right;}


/*---------------------------------- Home Page ----------------------------------*/

/*------------ Main Home Page Content ------------*/
/*.homeContent {width: 485px; padding: 20px 425px 20px 50px; margin: 0 auto; background: url(/css-images/home-bg.jpg) top no-repeat; border-bottom: #FFFFFF 2px solid; text-align: left;}*/
.homeContent {width: 485px; padding: 20px 425px 20px 50px; margin: 0 auto; border-bottom: #FFFFFF 2px solid; text-align: left;}
		.homeContent h1 {color: #FFFFFF; font-size: 130%; font-weight: normal; font-style: italic; padding: 1.0em 0 0 0; margin: 0;}
		.homeContent h2 {color: #1197BE; font-size: 100%; font-weight: normal; padding: 1.0em 0 0 0; margin: 0;}
		.homeContent h3 {color: #FFFFFF; font-size: 90%; font-weight: normal; font-style: italic; padding: 1.0em 0 0 0; margin: 0;}
		.homeContent p {color: #FFFFFF; font-size: 80%; padding: 0.6em 0 0 0; margin: 0;}

/*------------ Lower Banners ------------*/
.bannerContent {width: 960px; padding: 10px 0; margin: 0 auto; background-color: #16BFF1; text-align: center;}
				.bannerContent ul {width: 910px; padding: 0 0 0 50px; margin: 0;}
						.bannerContent ul li {width: 278px; height: 142px; padding: 0 13px 0 0; margin: 0; float: left; display: block; list-style: none;}
						

/*---------------------------------- Contacts Page ----------------------------------*/

/*------------ Contacts Form ------------*/
.contactsForm {width: 550px; padding: 10px 0 0 0; margin: 20px auto; background: #C5EFFB url(/css-images/contacts-form-head.gif) top no-repeat; text-align: left;}
		.contactsForm form { width: 490px; color: #0C6C88; font-weight: normal; padding: 0 30px 10px 30px; margin: 0;}
				.contactsForm form fieldset.left {width: 230px; border: none; padding: 0; margin: 0; float: left;}
				.contactsForm form fieldset.right {width: 230px; border: none; padding: 0; margin: 0; float: right;}
				.contactsForm form div {padding: 4px 0; margin: 0;}
				.contactsForm form label {color: #0C6C88; font-size: 80%; font-weight: normal; padding: 0; margin: 0;}
				.contactsForm form input.txt {color: #000000; background-color: #FFFFFF; border: 1px solid #0C6C88; width: 224px; padding: 1px 2px; margin: 5px 0 0 0;}
				.contactsForm form textarea.txt2 {color: #000000; background-color: #FFFFFF; border: 1px solid #0C6C88; width: 224px; height: 16em; padding: 1px 2px; margin: 5px 0 0 0;}
				.contactsForm form input.btn {font-size: 80%; font-weight: normal; color: #FFFFFF; width: 490px; padding: 8px 0; margin: 10px 0 0 0; border: none; display: block; background: url(/css-images/contacts-button.gif) left no-repeat; cursor: pointer;}
				
		.contactsFormFoot {width: 550px; height: 10px; padding: 0; margin: 0; background: url(/css-images/contacts-form-foot.gif) bottom no-repeat;}

/*---------------------------------- NEW E-COMMERCE ELEMENTS ----------------------------------*/

/*------------ Basket ------------*/
form.basketForm {padding: 0; margin: 0; border: none;}
		form.basketForm input.txt {color: #000000; background: #FFFFFF; border: 1px solid #0C6C88; width: 40px; padding: 1px 2px; margin: 0;}
		form.basketForm input.btnMinor {font-size: 80%; font-weight: normal; color: #FFFFFF; width: 50px; padding: 2px 0; margin: 0; border: none; display: block; background: #16BFF1; cursor: pointer;}
		form.basketForm input.btn {font-size: 80%; font-weight: normal; color: #FFFFFF; width: 180px; padding: 8px 0; margin: 10px 0; border: none; display: block; background: url(/css-images/checkout-button.gif) left no-repeat; cursor: pointer;}
		
table.basketTable {width: 550px; padding: 0; margin: 20px 0; text-align: left; border-collapse: collapse; font-size: 70%; font-weight: normal;}
		table.basketTable th {padding: 3px 4px 3px 10px; margin: 0; background: #16BFF1; color: #FFF; font-weight: normal; border-right: 1px #FFF solid;}
		table.basketTable td {padding: 4px 4px 4px 10px; margin: 0; color: #000; border-bottom: 1px #000 solid;}
		table.basketTable td.blank {border: none;}
		table.basketTable td.total {background: #C5EFFB;}


/*------------ Checkout ------------*/
.checkoutForm {width: 400px; padding: 0; margin: 20px 0; text-align: left;}
		.checkoutForm form {width: 400px; color: #0C6C88; font-weight: normal; padding: 0; margin: 0;}
				.checkoutForm form fieldset {width: 400px; border: none; padding: 14px 0 0 0; margin: 0; background: #C5EFFB url(/css-images/checkout-form-head.gif) top no-repeat;}
				.checkoutForm form div {padding: 4px 20px 14px 20px; margin: 0;}
				.checkoutForm form label {color: #0C6C88; font-size: 80%; font-weight: normal; padding: 2px 0 0 0; margin: 0;}
				.checkoutForm form input.txt {color: #000000; background-color: #FFFFFF; border: 1px solid #0C6C88; width: 226px; padding: 1px 2px; margin: 0; float: right; display: inline;}
				.checkoutForm form select {color: #000000; background-color: #FFFFFF; border: 1px solid #0C6C88; width: 226px; padding: 1px 2px; margin: 0; float: right; display: inline;}
				.checkoutForm form input.btn {font-size: 80%; font-weight: normal; color: #FFFFFF; width: 180px; padding: 8px 0; margin: 10px 0; border: none; display: block; background: url(/css-images/checkout-button.gif) left no-repeat; cursor: pointer;}
				
		.checkoutForm form div.checkoutFormFoot {width: 400px; height: 10px; padding: 0; margin: 0; background: url(/css-images/checkout-form-foot.gif) bottom no-repeat;}
		

/*------------ Order Confirmation ------------*/
.addressHolder {width: 250px; padding: 0; margin: 0 20px 0 0; float: left; display: inline;}
.rule {padding: 0; margin: 10px 0 0 0; border-bottom: 1px #000 solid;}