html { overflow-y:scroll; overflow-x: auto }
html,body { padding:0; margin:0; width: 100%; height: 100%; }
body {
	font-family: "Lucida Sans Unicode", Garamond, sans-serif;
	font-size:13px;
	line-height: 1.3em;
	background: #fff url(../img/body-bg.gif) top repeat-x; 
}

h1 { color: #74A8A7; font-size: 20px; font-weight:normal; margin: 20px; }
h2 { color: #428887; padding:0; margin:0; font-size: 12px; }

form { margin:0; padding:0; }
a { outline:none; color:#A70C2B;text-decoration:none;}
a:hover { text-decoration:underline;}

.slider { background: url(../img/bg-slider.gif) 125px top no-repeat; padding-top: 16px; padding-bottom: 18px; }

#wrapper { width: 743px; margin: 0 auto; }
#header { height: 104px; }
	#header .logo-skip { float:left; }
	#header .logo-thorntons { float:right; }

#footer { color: #6584A3; border-top: 1px solid #C7D3DE; padding: 10px 0; text-align:center; margin-top: 20px; }
	#footer a { color: #6584A3; text-decoration:none;}
	#footer a:hover { text-decoration:underline;}


/*** MENU ***************************************************************************************************/
#menu { float:right; margin-top:40px; width: 280px; list-style:none; padding:0; }
#menu li { padding:0; margin:0; } 
#menu li, 
#menu li a { float:left; background-position:left top; background-repeat:no-repeat; height:25px; position:relative;}
#menu .active, 
#menu .active a, 
#menu li a:hover,  
#menu li:hover { background-position:left bottom; }

#menu li.separator { border-left: 1px solid #fff; margin: 5px; height: 15px;}

#menu .home { background-image: url(../img/menu/home.gif); width: 45px; }
#menu .contact { background-image: url(../img/menu/contact.gif); width: 75px; }
#menu .about { background-image: url(../img/menu/about.gif); width: 66px; }
#menu .help { background-image: url(../img/menu/help.gif); width: 37px; }
/************************************************************************************************************/


/*** COMMON *************************************************************************************************/
.strokebox { width: 711px; margin: 0 auto; clear:both; }
.strokebox .strokebox-top, 
.strokebox .strokebox-bottom, 
.strokebox .strokebox-middle { background-image:url(../img/sprites/stroke-frost.gif); background-repeat:no-repeat; width:711px; }
.strokebox .strokebox-top { background-position: left; height: 24px; }
.strokebox .strokebox-bottom { background-position: -711px;  height: 24px; }
.strokebox .strokebox-middle { background-position: right; background-repeat: repeat-y; padding: 0 20px; width: 671px; overflow:hidden; }

.strokebox-blue .strokebox-top,.strokebox-blue .strokebox-bottom,.strokebox-blue .strokebox-middle { background-image:url(../img/sprites/stroke-blue.gif); }
.strokebox-peach .strokebox-top,.strokebox-peach .strokebox-bottom,.strokebox-peach .strokebox-middle { background-image:url(../img/sprites/stroke-peach.gif); }
.strokebox-yellow .strokebox-top,.strokebox-yellow .strokebox-bottom,.strokebox-yellow .strokebox-middle { background-image:url(../img/sprites/stroke-yellow.gif); }

/************************************************************************************************************/




/*** HOMEPAGE ***********************************************************************************************/
#content .homepage { background: #fff url(../img/home.jpg) center top no-repeat; height: 503px; margin:0; padding-top: 35px;}
#content .homepage .home-info { float:right; color: #40BCD6; font-size: 20px; text-align:right; line-height: 1.6em;  }
#content .homepage .home-bar { float:right; width: 320px; margin: 15px 24px 0 24px; }
#content .homepage .home-bar h1 { color:#000; font-size: 23px; line-height: 1em; margin:14px 0; }
#content .homepage .home-bar h1 em { font-size: 56px; float:left; font-style: normal; font-weight:normal; margin: -5px 15px; line-height:1em; }

#content .homepage .home-bar p { color: #6584A3; margin:0 15px; padding: 15px 0;  font-size:16px; border-bottom: 1px solid #fff;  }
#content .homepage .home-bar ul { list-style:none; margin:0 15px; padding: 0; height: 140px; }
#content .homepage .home-bar ul li { color: #6584A3; padding: 5px 0 5px 38px; font-size: 18px; margin:0; line-height: 1.6em;  
	border-bottom: 1px solid #fff; text-indent: -21px; }
#content .homepage .home-bar ul li img { margin-right: 7px; }  
#content .homepage .home-bar .nodiscounts { margin:0 15px; padding: 15px 0 0; height: 170px; }
#content .homepage .home-bar .nodiscounts p { border: none; font-size: 15px; padding: 10px 0;}

#content .homepage .home-bar .btn-order { background: url(../img/buttons/btn-order.gif) center top no-repeat; width:318px; height:137px; display:block; }
#content .homepage .home-bar .btn-order:hover { background-position: center bottom; }
/************************************************************************************************************/



 
 
 
/*** HOMEPAGE - ORDER ***************************************************************************************/
#content .order .order-bar { background: url(../img/order/order-bar.gif) center top no-repeat; height: 86px; }
#content .order .order-bar ul { list-style:none; float:left; padding:0; margin: 36px 0 0 245px; }

#content .order .order-bar ul li,
#content .order .order-bar ul li a { float:left; background-position:left top; background-repeat:no-repeat; height:25px; position:relative;}
#content .order .order-bar ul .active, 
#content .order .order-bar ul li.active a, 
#content .order .order-bar ul li a:hover { background-position:left bottom; }

#content .order .order-bar ul li.separator { border-left: 1px solid #C2C7B9; margin: 5px 14px; height: 15px;}
#content .order .order-bar ul li.tick { height: 25px; width:10px; background: url(../img/icons/order-tick.gif) right 3px no-repeat; margin-right:-8px; }

#content .order .order-bar ul .select { background-image: url(../img/menu/order-select.gif); width: 78px; }
#content .order .order-bar ul .discount { background-image: url(../img/menu/order-discount.gif); width: 104px; }
#content .order .order-bar ul .delivery { background-image: url(../img/menu/order-delivery.gif); width: 106px; }
#content .order .order-bar ul .checkout { background-image: url(../img/menu/order-checkout.gif); width: 70px; }

#content .order .btn-proceed { width: 127px; height: 59px;  background:url(../img/buttons/btn-proceed.gif) center top; display:block;}
#content .order .btn-proceed:hover { background-position: center bottom; }

#content .order .btn-submit { width: 127px; height: 59px;  background:url(../img/buttons/btn-submit.gif) center top; display:block; float:right; }
#content .order .btn-submit:hover { background-position: center bottom; }



/*** SELECT SKIP ***/ 

#content .order .order-box { border-bottom: 1px solid #DEE9CE; overflow:hidden; padding: 5px 0;	}
#content .order .img-skip {float:left; }

#content .order .description {float:left; width: 270px; margin-top: 10px; }
#content .order .description .icon-info { float:right; }
#content .order .description h2 {color: #428887; padding:0; margin:0; font-size: 12px; text-transform:uppercase;  }
#content .order .description p { color: #2E5857; padding:0; margin:5px 0; font-size: 12px; }

#content .order .price {float:left; width: 130px; margin-left: 30px; }
#content .order .price h3 { font-size: 24px; color: #74A8A7; font-weight:normal; text-align:center; padding:0; margin:20px 0 20px; }



/*** APPLY DISCOUNT ***/
#content .order .order-discount { }
#content .order .order-discount ul { display:inline-block; list-style:none; padding:0; margin:0;  }

#content .order .order-discount .order-disc-or { float:left; width:41px; height: 240px; margin: 0 -25px 0 -3px; position:relative; 
	background:url(../img/order/discount-or.gif) left bottom no-repeat; }

#content .order .order-discount .order-disc { float:left; height:278px; width:224px; margin:0 0 10px 10px;   
	background-position: left top; background-repeat:no-repeat; }
#content .order .order-discount .order-disc h2 { margin: 22px 24px 0 24px; height: 40px; text-align:center; line-height: 1.4em; }
#content .order .order-discount .order-disc .order-disc-content { margin: 5px 24px 0 24px; height: 120px; }

#content .order .order-discount .order-disc-customer { background-image:url(../img/order/discount-customer.png); }
#content .order .order-discount .order-disc-customer h2 { color: #4F7699; }
#content .order .order-discount .order-disc-voucher { background-image:url(../img/order/discount-voucher.png); }
#content .order .order-discount .order-disc-voucher h2 { color: #BB8E60; }
#content .order .order-discount .order-disc-just { background-image:url(../img/order/discount-just.png); }
#content .order .order-discount .order-disc-just h2 { color: #C76977; }

#content .order .order-discount .order-disc .order-disc-content .percent,
#content .order .order-discount .order-disc .order-disc-content .off { color: #fff; font-size: 14px; text-align:center; line-height: 100%; text-transform:uppercase;  }
#content .order .order-discount .order-disc .order-disc-content .percent { font-size: 48px; margin: 5px 0; }
#content .order .order-discount .order-disc .order-disc-content .off { font-weight:bold; }
#content .order .order-discount .order-disc .order-disc-content p { color:#7B9BBB; font-size: 11px; text-align: center; margin:5px; line-height:1.2em;  }

#content .order .order-discount .order-disc .btn-select { width: 128px; height: 58px; background: url(../img/buttons/btn-select.gif) left top no-repeat; display:block; margin: 0 auto; }
#content .order .order-discount .order-disc .btn-select:hover {background-position: left -58px; }
#content .order .order-discount .order-disc .btn-select:active,
#content .order .order-discount .active .btn-select,
#content .order .order-discount .active .btn-select:hover { background-position: left -116px; }

#content .order .order-discount .order-disc .btn-select-customer { background-image: url(../img/buttons/btn-select-customer.gif); }
#content .order .order-discount .order-disc .btn-select-area { background-image: url(../img/buttons/btn-select-area.gif); }
#content .order .order-discount .order-disc .btn-select-voucher { background-image: url(../img/buttons/btn-select-voucher.gif); }

#accNoStatus { float:left; width:16px; height:16px; margin:-40px 0 0 5px; position:relative; }
#pinNoStatus { float:left; width:16px; height:16px; margin:4px 0 0 5px; position:relative; }
#voucherStatus { float:left; width:16px; height:16px; margin:18px 0 0 5px; position:relative; }

.progress { background: url(../img/icons/progress.gif) left top no-repeat; }
.error { background: url(../img/icons/error.gif) left top no-repeat; cursor:default; }
.progress div, .error div { position:relative; }


/*** APPLY DISCOUNT - SELECTED ***/
#content .order .order-discount .strokebox { } 
#content .order .order-discount .strokebox * { color:#428887; font-size:14px; } 
#content .order .order-discount .strokebox h1, 
#content .order .order-discount .strokebox h2 { font-size: 20px; font-weight: normal; padding:0; margin: 0 0 10px 10px; }
#content .order .order-discount .strokebox h2 { font-size: 18px; line-height: 1.2em; }
#content .order .order-discount .strokebox label { margin: 20px 30px 0 40px; float:left; font-weight:bold; }
#content .order .order-discount .strokebox input { margin: 15px 0 0 0; float:left; background-position: left top; background-repeat: no-repeat;  
	border: 0; width: 89px; height: 21px; padding: 4px 10px;  }
#content .order .order-discount .strokebox .btn-proceed { float: right; margin:0; }


/*** APPLY DISCOUNT - SELECTED - customer ***/
#content .order #order-selected-customer { display:none; } 
#content .order #order-selected-customer input { background-image:url(../img/order/textbox-blue.gif); }
#content .order #order-selected-customer a.help { float:left; clear: both; margin: 0 0 0 10px; font-size: 12px; text-decoration:none; }
#content .order #order-selected-customer a.help:hover { text-decoration:underline; }
#content .order #pinNumberLabel, #content .order #pinNumber { margin: 0 30px 0 40px; }
#content .order #pinNumber { margin-right:0; }



/*** APPLY DISCOUNT - SELECTED - voucher ***/
#content .order #order-selected-voucher { display:none;  } 
#content .order #order-selected-voucher h1 { margin-bottom: 20px; } 
#content .order #order-selected-voucher input { background-image:url(../img/order/textbox-peach.gif); color: #95520E; }
#content .order #order-selected-voucher .strokebox-middle { padding-bottom: 5px; }

#content .order .active { display: block !important;  } 

/*** DELIVERY DETAILS ***/
#content .order .delivery .btn-proceed { float:right; margin-right: 30px; margin-top: -60px; position:relative; z-index:1; }
#deliveryForm  form { padding: 15px 0 15px 30px; color: #5D5D5D; }
#deliveryForm .x-panel-header { background:none; border:none; color:#428887; text-transform:uppercase; padding:0 0 15px; font-size: 13px; }
#deliveryForm  .radiogroup .x-form-item .x-form-check-wrap { height:inherit; }
#deliveryForm  .radiogroup .x-form-item .x-form-check-wrap input { margin-top: 3px; float:left; margin-right: 2px; }
#deliveryForm  .radiogroup .x-form-item .x-form-check-wrap a { color: #000; text-decoration:underline; }
#deliveryForm  .radiogroup .x-form-item .x-form-check-wrap a:hover { text-decoration:none; }

#deliveryForm #x-form-el-deliveryTime_am .x-item-disabled label { color:red !important; }



/*** CHECKOUT ***/
#content .order .checkout #formContainer { float: left; width:270px; padding: 15px 0 15px 30px; }
#content .order .checkout #checkoutForm .x-panel-header { background:none; border:none; color:#428887; text-transform:uppercase; padding:0 0 15px; font-size: 13px; }
#content .order .checkout #checkoutForm form { color: #5D5D5D; }

#content .order .checkout .summaryBlock { float: right; width: 340px; padding: 14px 0 15px 0; }
#content .order .checkout .summaryBlock h1 { color:#428887; text-transform:uppercase; font-weight:bold; margin:0; padding:0 0 15px; font-size: 13px; } 
#content .order .checkout .summaryBlock img { float:right; width: 130px; margin: -10px 5px 0 -10px; } 
#content .order .checkout .summaryBlock p { color: #5D5D5D; margin: 0 0 6px 0;} 

#content .order .checkout .summaryBlock table { width: 100%; margin: 20px 5px 20px -5px;  border-spacing:0px; color: #5D5D5D;  } 
#content .order .checkout .summaryBlock table td { padding: 6px; } 
#content .order .checkout .summaryBlock table .table-header td { border-bottom: 1px solid #A4C176;  } 
#content .order .checkout .summaryBlock table .table-footer { background: url(../img/checkout-summary-bg.png) right top repeat-y; }
#content .order .checkout .summaryBlock table .table-footer td { border-top: 1px solid #fff; color: #333; font-weight:bold; } 
#content .order .checkout .summaryBlock table td.sum { text-align:right; width: 70px; } 

/************************************************************************************************************/
 

 
 
 
 
/*** POPUP WINDOWS ******************************************************************************************/
.popup h1 { margin: 0 0 20px 0;  }
.popup h2 { margin: 20px 0 10px 0;  }

.popup table { margin:0 0 20px 0; table-layout:fixed; }
.popup table td { vertical-align:top; padding: 0 20px 0 0; width: 40% }

.popup p { margin: 10px 0; }
.popup ul { list-style: disc; margin: 10px 0 10px 18px; }
.popup ul li { margin: 0 0 5px 0; }
/************************************************************************************************************/


.static h1 { margin: 0 0 20px 0;  }
.static h2 { margin: 20px 0 10px 0; text-transform:uppercase; }

.static { margin:10px 20px; }
.static p { margin: 10px 0; }
.static ul { list-style: disc; margin: 10px 0 10px 18px; }
.static ul li { margin: 0 0 5px 0; }


#unsubscribe { height: 200px; }
#unsubscribe .waitbox { margin: 20px auto 0 auto; width: 330px; float:left;  }
#unsubscribe .errorbox { height: 20px; padding: 0; }
#unsubscribe input { margin: 0 auto; width: 280px; font-size: 16px; padding: 3px !important; height: 21px; font-family:inherit; }
#unsubscribe a { background: url(../img/buttons/btn-submit.gif) left top no-repeat; display:block; height: 59px; width: 127px; margin: 15px 320px;}
#unsubscribe a:hover { background-position: left bottom; }

#unsubscribe.unsubscribe-wait .waitbox { background: url(../img/icons/progress.gif) right 5px no-repeat; }
#unsubscribe.unsubscribe-wait a { opacity: .5; background-position: left bottom; cursor: default; }

#unsubscribeError { color: red; }

#unsubscribed { height: 190px; display:none;  }


.clear { clear:both; }

#x-form-el-usageType_household, #x-form-el-usageType_builders { width:150px !important; }
