/* ========================================================================================
Ellis Direct: Main Layout 
Version:2.1
Author: Raphael Marsh
Email: raf_marsh@hotmail.com
Freelance Design
Last Updated: 24 Sept 2008
=========================================================================================== */

/* STANDARD FORMATTING 
=========================================================================================== */

#introPanel .basket {
	height:77px;
	background:#000 url(/images/images/admin/basket-trust-message.jpg) top left no-repeat;
}
.content-holder.purchase h2 {
	border:#86ad19 1px solid ;
	background:#86ad19 url(/images/images/admin/purchase-header-bg.gif) bottom repeat-x !important;
}
.content-holder.admin h2 {
	border:#518cbf 1px solid ;
	background:#90b3d2 url(/images/images/admin/admin-header-bg.gif) bottom repeat-x !important;
}

/* Shopping Basket
=========================================================================================== */
table.basket  {
	border-collapse: collapse;
  	width:99%;
 	border:#ccc 1px solid;
  	font-size:110%;
	line-height:130%;
	color:#222;
	text-align:center;
	margin:6px 4px 0 4px;
}
.basket col {
	text-align:center; border-right: 1px solid #ccc;
}
.basket thead {
	border:#989898 1px solid; color:#FFFFFF; height:1.9em;
	background:#b2b2b2 url(/images/images/generic-img/headerbar-bg.gif) bottom repeat-x;
}
.basket th {
	font-size:100%;
}
.basket #quantity {
	width:40px;
}
.basket #varientThumbnail {
	width:36px; text-indent: -1000em;
}
.basket #code {
	width:120px;
}
.basket #remove {
	width:60px;
}
.basket td.price {
	font-weight:bold;
}
.basket #left {
	text-align:left;
}
.basket #varientOrder {
	text-indent: -1000em;
}
.basket th, td {
	padding: 0.3em 0.4em;
	border-right: 1px solid #ccc;
}
.basket .odd {
	background-color:#ededed;
}
.basket tr:hover {
	/*background-color:#7b7b6b; color:#ffffff; cursor:pointer;*/
}
.basket input {
	font-size:120%; text-align:center;
}

.basket thead tr:hover {
  /*background:#b2b2b2 url(/images/images/generic-img/headerbar-bg.gif) bottom repeat-x;
  color:#fff;*/
}
.basket input {
  width:30px;
}


table.basketDetail  {
	border-collapse: collapse;
  	width:99%;
	border-left:#ccc 1px solid;
	border-right:#ccc 1px solid;
	border-bottom:#ccc 1px solid;
  	font-size:110%;
	line-height:130%;
	color:#222;
	text-align:center;
	margin:0 4px 0 4px;
}
.basketDetail #left {
	text-align:left;
}
.basketDetail td {
	padding: 0.3em 0.4em;
	border-bottom: #afafaf 1px dotted;
}
.basketDetail p {
	font-size:100%;
}
.basketDetail .updateBasket {
	float:left; width:113px; display:block; margin:10px;
}
.basketDetail .clearBasket {
	float:left; width: 103px; display:block; margin:10px;
}
.basketDetail .continueBasket {
	float:left; width:133px; display:block; margin:10px;
}
.basketDetail .checkoutBasket {
	float:right; width:140px; display:block; margin:10px;
}
.basketDetail td.noLine {
	border-bottom: none;
}

.basketDetail p.subTotal {
	float:right; width: 400px; display:block; text-align:right; margin:1px 30px 1px 0;
}
.basketDetail p.subTotal-amount {
	float:right; width: 125px; display:block; text-align:left; font-weight:bold; color:#ac0000; margin:1px 0;
}
.basketDetail p.delivery {
	float:right; width: 400px; display:block; text-align:right; margin:1px 30px 1px 0;
}
.basketDetail p.delivery-amount {
	float:right; width: 125px; display:block; text-align:left; font-weight:bold; color:#ac0000; margin:1px 0;
}
.basketDetail p.totalVAT {
	float:right; width: 400px; display:block; text-align:right; margin:1px 30px 1px 0;
}
.basketDetail p.totalVAT-amount {
	float:right; width: 125px; display:block; text-align:left; font-weight:bold; color:#ac0000; margin:1px 0;
}
.basketDetail p.finalTotal {
	float:right; width: 400px; display:block; text-align:right; font-weight:bold; margin:5px 30px 7px 0; font-size:120%;
}
.basketDetail p.finalTotal-amount {
	float:right; width: 125px; display:block; text-align:left; font-weight:bold; color:#7ba800; margin:5px 0 7px 0; font-size:120%;
}


.basketDetail td.message {
	background:#f7f0e4;
}
	.basketDetail td.message img {
		float:left;
		margin:4px 10px;
	}
	.basketDetail td.message p {
		float:right;
		text-align:right;
		font-size:100%;
		line-height:140%;
		font-weight:bold;
		margin:10px;
	}
.basketDetail img.creditCard {
	float:right;
	padding:5px 10px;
}

/* Log In / Register
=========================================================================================== */
.screenlet-holder {
	padding:10px;
}
.screenlet-holder p.notice {
	position:relative;
	font-size:120%;
	font-weight:bold;
	color:#cc0035;
	text-align:center;
	padding:5px 0;
}
.screenlet.existingUser {
	float:left;
	width:48%;
	height:240px;
	border-top:none;
 	border-left:#518cbf 2px solid;
	border-right:#518cbf 2px solid;
	border-bottom:#518cbf 2px solid;
  	font-size:110%;
	line-height:140%;
}
.screenlet.existingUser .boxhead {
	font-size:120%;
	font-weight:bold;
	color:#FFF;
	padding:6px 0 7px 0;
	background:#518cbf;
	text-align:center;
}
.screenlet.existingUser .screenlet-body {
	margin:7px; padding:12px 0 18px 12px; background:#f1f4fa; border:#dce3ef 1px solid; height:114px;
}
.screenlet.existingUser .form-label {
	width:90px;
}
.screenlet.existingUser .inputBox {
	width:190px;
}
.screenlet.existingUser .smallSubmit {
	height:21px;
	width:83px;
	margin:5px 0 10px 101px;
	text-indent:5000px;
	overflow:hidden;
	cursor:pointer;
	border:0;
	background:url(/images/images/admin/LoginPanel-button.gif) no-repeat;
}
.screenlet.existingUser p a {
	font-size:90%;
	color:#6a6a6a;
	text-decoration:none;
	margin-left:102px;
}
	.screenlet.existingUser p a:hover {
		color:#cc0035;
		text-decoration:underline;
	}

.screenlet.newUser .screenlet-body {
	margin:7px; padding:12px 0 18px 18px; background:#fdfdde; border:#f0f091 1px solid; height:114px;
}
.screenlet.newUser {
	float:right;
	width:48%;
	height:240px;
	border-top:none;
 	border-left:#81ad1b 2px solid;
	border-right:#81ad1b 2px solid;
	border-bottom:#81ad1b 2px solid;
  	font-size:110%;
	line-height:140%;
}
.screenlet.newUser .boxhead {
	font-size:120%;
	font-weight:bold;
	color:#FFF;
	padding:6px 0 7px 0;
	background:#81ad1b;
	text-align:center;
}
.screenlet.newUser .smallSubmit {
	height:35px;
	width:205px;
	text-indent:5000px;
	overflow:hidden;
	cursor:pointer;
	border:0;
	background:url(/images/images/admin/NewAccount-button.gif) no-repeat;
}

.safeGuarantee {
	float:left;
	width:760px;
	border-top:none;
 	border-left:#adadad 2px solid;
	border-right:#adadad 2px solid;
	border-bottom:#adadad 2px solid;
  	font-size:110%;
	line-height:140%;
	margin-top:30px;
}
.safeGuarantee .boxhead {
	font-size:120%;
	font-weight:bold;
	color:#FFF;
	padding:6px 0 7px 10px;
	background:#adadad;
	text-align:left;
}
.safeGuarantee img {
	float:left;
	margin-right:30px;
}
.safeGuarantee .spacer {
	float:left;
	position:relative;
	display:block;
	padding:15px 25px 15px 15px;
}
.safeGuarantee p a {
	color:#555;
	border-bottom:#222 1px dotted;
	text-decoration:none;
}
.safeGuarantee p a:hover {
	border:none;
}



/* Registration Form
=========================================================================================== */
table.registration  {
  	width:100%;
	border-top:none;
 	border-left:#518cbf 2px solid;
	border-right:#518cbf 2px solid;
	border-bottom:#518cbf 2px solid;
  	font-size:110%;
	line-height:140%;
}
table.registration tr, td  {
  	padding:0;
}
.form-label {
	float:left;
	font-size:110%;
	line-height:140%;
	padding-top:4px;
	padding-right:10px;
	color:#21386e;
	font-weight:bold;
	width:160px;
	text-align:right;	
}
.form-label.mandatory {
	color:#cc0035;
}
.registration .screenlet-body {
	margin:7px; padding:16px 0 18px 18px; background:#f1f4fa; border:#dce3ef 1px solid;
}
.registration .screenlet-body.marketing {
	background:#fdfdde; padding-bottom:30px; border:#f0f091 1px solid;
}
.registration .screenlet-body.marketing input { /*marketing checkbox layout*/
	float:left;
	margin-top:3px;
	display:block;
	margin-right:6px;
}
.form-row {
	padding:2px 0;
}
select, input {
	padding:2px 0 3px 2px;
}

.account .formPanel {
	width:auto; margin:7px; padding:16px 0 18px 18px; background:#f1f4fa; border:#c5d2e8 1px solid;
}

.account .formPanel.marketing {
	background:#fdfdde; border:#f0f091 1px solid;
}
.account .formPanel.marketing input { /*marketing checkbox layout*/
	float:left; margin-top:3px; display:block; margin-right:6px;
}

.account h3 {
	font-size:120%; color:#FFF; margin:0; padding:6px 0 7px 10px; background:#518cbf;
}

.registration h3 {
	font-size:120%;
	color:#FFF;
	margin:0;
	padding:6px 0 7px 10px;
	background:#518cbf;
}
p.intro  {
  	padding:10px;
}
table.registration p.help  {
  	position:relative;
	left:172px;
	font-size:100%;
	display:block;
	margin:5px 0;
	font-style:italic;
	width:500px;
}
table.registration p.description  {
	display:block;
	font-size:100%;
	font-style:italic;
	color:#222;
	margin-top:4px;
	height:20px;
}
.registration em {
	font-weight:bold;
	font-style:normal;
	color:#cc0035;
}
.registration #reg-submit {
	margin:20px 32% 20px 38%;
	text-align:center;
}

.account em {
	font-weight:bold; font-style:normal; color:#cc0035;
}
.account #reg-submit {
	margin:20px 32% 20px 38%; text-align:center;
}
.account p.smallRadio {
	color:#21386e; font-weight:bold; width:50px; text-align:left;
}
.account .smallRadio-table td {
	border:0px !important;
}

table.account  {
  	width:100%;
	border-top:none;
 	border-left:#518cbf 2px solid;
	border-right:#518cbf 2px solid;
	border-bottom:#518cbf 2px solid;
  	font-size:110%;
	line-height:140%;

}
table.account tr, td  {
  	padding:0;
}


/* Account Homepage
=========================================================================================== */
.account .yourAccount {
	float:left; width:45.3%; margin:7px; padding:14px 12px 12px 12px; background:#f1f4fa; border:#dce3ef 1px solid;
}
.account .yourAccount.left {
	margin-left:0;
}
.account .yourAccount.bottom {
	margin-top:0;
}
.account .yourAccount h4 a {
	font-weight:bold; color:#6b9d31; font-size:14px; text-decoration:underline; display:block; margin-bottom:8px;
}
	.account .yourAccount h4 a:hover {
		text-decoration:none;
	}
	.account .formPanel h4 a {
	font-weight:bold; color:#6b9d31; font-size:14px; text-decoration:underline; display:block; margin-bottom:8px;
}
	.account .formPanel h4 a:hover {
		text-decoration:none;
	}
	.account .panelDescription {
		line-height:150%; display:block; width:auto;
	}
	a.accountImage {
		float:left; display:block; width:80px; height:80px; margin-right:10px;
	}
	a.accountImage.order {
		background:url(/images/images/admin/order-image.gif) no-repeat;
	}
	a.accountImage.login {
		background:url(/images/images/admin/login-image.gif) no-repeat;
	}
	a.accountImage.details {
		background:url(/images/images/admin/details-image.gif) no-repeat;
	}
	a.accountImage.addresses {
		background:url(/images/images/admin/address-image.gif) no-repeat;
	}
	a.accountImage.payment {
		background:url(/images/images/admin/payment-image.gif) no-repeat;
	}
	a.accountImage.communication {
		background:url(/images/images/admin/communication-image.gif) no-repeat;
	}

/* Card Holders Details
=========================================================================================== */
table.account p.defaultAddress {
	position:relative;
	font-size:100%;
	padding:5px 0 16px 0;
	left:2px;
	font-weight:normal;
	text-align:left;
	color:#21386e;
}

/* Manage / Preferences Table
=========================================================================================== */
table.manage {
	width:98%; line-height:140%;
}
	.manage td {
		padding:14px; background:#FFF; border:#f1f4fa 2px solid;
	}
	.manage input {
		float:left; margin:0 5px 0 0; padding:0;
	}
	.manage p {
		color:#21386e;
	}
		.manage p.label {
			float:left; font-weight:bold; padding-left:13px;
		}	
		.manage thead th {
			background:#c9daea;
			height:34px;
			color:#21386e;
			font-size:110%;
		}
			.manage thead tr th {
				border:#f1f4fa 2px solid;
			}
			.manage tbody td input {
				position:relative;
				left:13px;
			}
			.manage tbody tr.defaultRow td { /*Make default option highlight*/
				background:#fdfdde;
			}
	.manage.centre {
		text-align:center;
	}

/* Account Header Icons
=========================================================================================== */
.content-holder.admin img.headIcon {
	position:absolute;
}
.content-holder.purchase img.headIcon {
	position:absolute;
}


/* Purchase Path
=========================================================================================== */
.content-holder.purchase table.checkout  {
 	border-left:#86ad19 2px solid;
	border-right:#86ad19 2px solid;
	border-bottom:#86ad19 2px solid;
	font-size:110%;
	width:100%;
}
.purchase tr, td  {
  	padding:0;
}

.content-holder.purchase table.checkout  {
 	border-left:#86ad19 2px solid;
	border-right:#86ad19 2px solid;
	border-bottom:#86ad19 2px solid;
	font-size:110%;
	width:100%;
}
.purchase tr, td  {
  	padding:0;
}

.checkout .formPanel {
	width:auto; margin:7px; padding:16px 0 18px 18px; background:#f5f5f5; border:#d9d9d9 1px solid; height:1%;
}
table.formTable {
	width:auto;
}
	table.formTable td {
		border-right:0 !important;
		vertical-align:top;
		padding:1px 0;
	}	
	.checkout .formTable p {
		color:#2f2c1f;	
	}
		.checkout p.mandatory {
			color:#cc0035;
		}
		.formTable p.help  {
			color:#555555;
		}

.checkout h3 {
	font-size:120%; color:#FFF; margin:0; padding:6px 0 7px 10px; background:#86ad19;
}
.checkout p.intro  {
  	padding:10px; line-height:140%;
}
	.checkout p.intro a  {
		font-weight:bold; color:#6b9d31; text-decoration:underline;
	}
		.checkout p.intro a:hover  {
			text-decoration:none;
		}
.checkout em {
	font-weight:bold; font-style:normal; color:#cc0035;
}
.checkout .smallRadio {
	width:14px; margin:2px 6px 0 0;
}
.checkout .formTable p.description  {
	font-size:110%;
	font-style:normal;
	color:#555555;
}
.checkout #reg-submit {
	margin:20px 32% 20px 38%; text-align:center;
}
.checkout .smallRadio-table td {
	border:0px !important;
}

/* Purchase - Choose Address
=========================================================================================== */
.address-holder {
	float:left;
	width:27.9%;
	margin-right:15px;
	margin-bottom:15px;
	padding:10px;
	border:#c6c6c3 1px solid;
	background:#fff;
}
	.address-holder:hover {
		background:#fdfdde;
	}
	.address-holder input:hover {
		cursor:pointer;
	}
	.address-holder.end {
		margin-right:0px;
	}
	.address-holder.bottom {
		margin-bottom:0px;
	}
	.address-holder p {
		line-height:150%;
	}
		.address-holder p.reference {
			font-weight:bold;
			padding-bottom:2px;
			border-bottom:#c6c6c3 1px solid;
			margin-bottom:7px;
			color:#000;
		}
	.addAddress-button {
		position:absolute; margin:30px 0 0 24px;
	}
	
/* Purchase - Choose Payment
=========================================================================================== */
.payment-holder {
	float:left;
	width:45%;
	margin:15px 15px 0 0;
	padding:10px;
	border:#c6c6c3 1px solid;
	background:#fff;
}
	.payment-holder:hover {
		background:#fdfdde;
	}
	.payment-holder input:hover {
		cursor:pointer;
	}
	.payment-holder.end {
		margin-right:0px;
	}
	.payment-holder p {
		line-height:150%;
	}
		.address-holder p.reference {
			font-weight:bold;
			padding-bottom:2px;
			border-bottom:#c6c6c3 1px solid;
			margin-bottom:7px;
			color:#000;
		}
	.addAddress-button {
		position:absolute; margin:30px 0 0 24px;
	}


