/* CSS Document */
/*img { behavior: url(/includes/iepngfix.htc);}*/
html, body {height: 100%;}
p{ text-align:left; font-size:10px; line-height:16px; font-weight:bold; float:left; width:100%; margin:5px 0 5px 0 }
.pNoBackground{ text-align:left; font-size:10px; line-height:20px; font-weight:bold; color:#000000; }
h1{ color: #000000; font-size:24px; margin-top:20px;}
h2{ color:#FFF; margin:10px 0 10px 0; padding-top:0; text-align:left; text-decoration:none;}
.whitelink{ text-align:left; font-size:10px;font-weight:bold; float:left; width:100%; line-height:12px;} 


label{font-size:12px; color:#FFFFFF; margin:0 0 5px 0;}
a{ color:#FFFFFF;font-family: Helvetica; overflow:hidden; text-align:left; font-size:11px; line-height:20px; text-decoration:none; }
.bodyCol_Rht input{height: 20px; background-color:#FFFFFF; font-size:12px; color:#672E1B; margin:0 0 10px 0; border:none; line-height:18px}
select{height: 20px; background-color:#FFFFFF; font-size:12px; color:#672E1B; margin:0 0 10px 0; line-height:18px}
body{ background-color:#CAAEA3; color:#FFFFFF; font-family: Helvetica; margin:auto; text-align:center; position:relative;}
form, img{margin:0; padding:0}
.left{float:left}
.right{float:right}
.clear{clear:both; margin:0px; padding:0px}
.lh{height:20px; line-height:20px;}
.mt10{margin-top:10px}
.mt5{margin-top:5px}
.ML{margin-left:10px}
.subTitleWhite{font-size:12px; color:#FFFFFF; font-weight:bold}
.subTitleBrown{font-size:12px; color:#662D18; font-weight:bold}
.subTitleYellow{font-size:12px; color:#EFB215; font-weight:bold}
.subTitleBlack{font-size:12px; color:#000000; font-weight:bold}
.buttonAlign{ float:right; }
a img{ border:none;}


.simpleBlack{font-size:14px; color:Black;}

/*Background And Wrapper Styles*/
.bodyWrapper{height:auto; overflow:hidden;margin:auto;width:1009px; position:relative; background-image:url(../images/bodywrapperbg.jpg); background-repeat:no-repeat; background-position:top left;}
.outerBodyBackground{height:auto; margin:auto; overflow:hidden; background-position:right; background-image:url(../images/main_bg_img_rpt.jpg);background-repeat:repeat-y; width:1007px; z-index:1; position:relative;right:4px;}
.genWrapperStyles{height:auto; width:1001px; overflow:hidden; margin:0; padding:0; position:relative; /*right:2px;*/}
.innerBodyWrapper{overflow:hidden; background-image:url(../images/grey_right_rpt.jpg); background-position:right;background-repeat:repeat-y; background-color:#FFFFFF;}
.whiteStripBg{overflow:hidden; background-image:url(../images/white_strip_bg_img.jpg); background-repeat:repeat-x; background-position:top; }
.topOrangeBrownstripBg{height:auto; overflow:hidden; background-image:url(../images/top_strip_rpt.jpg); background-repeat:repeat-x;}
.topOrangeBrownstripFg{height:auto; overflow:hidden; background-image:url(../images/top_header_strip.jpg); background-repeat:no-repeat; background-position:right top;}

/*Header Styles*/
.headerWrapper{ height:224px; margin:0; overflow:hidden;}
.logoHolder{ float:left;}
.sloganHolder{ float:left; margin-top:20px; width:470px;}
.slogan_img{ float:left}
.navWrapper{ float:left; width:700px;}
.navWrapper a img{ float:left;}
.mainnav_home_btn img{ margin:65px 0 0 40px}
.mainnav_hubcard_btn img{ margin:75px 0 0 10px}
.mainnav_ourstory_btn img{ margin:65px 0 0 10px}
.mainnav_hubatwork_btn img{ margin:53px 0 0 15px}
.mainnav_thenexthub_btn img{ margin:65px 0 0 10px}
.mainnav_hubcareers_btn img{ margin:65px 0 0 0px}
.mainnav_fairtrade_btn img{ margin:58px 0 0 10px}

.nav_img{ float:left; margin-top:50px;}

/*Page Body Columns */
#body_Row{width:1003px; overflow:hidden; margin-right:2px;position:relative; right:2px;}
.bodyCol_Lft{ float:left; width:79px;margin-right:10px; overflow:visible; z-index:1;position:relative; right:1px;}
.bodyCol_Center{margin:0 0 0 90px; float:left; width:690px; display:inline;}
.bodyCol_Rht{float:right; width:200px; margin:0 2px 0 0px; overflow:hidden}
.leftBackgroundCol{width:100%; overflow:hidden; background-image:url(../images/template/left-background.jpg); background-repeat:repeat-y; background-position:left; }

/* RIGHT PANEL */
.rightContentWrapper{text-align:left; padding:0 6px 0 0px; margin:0 0 20px 0; overflow:hidden}
.rightContentTitle{margin-top:10px}
.borderBackground{background-color:#DE7A1C; margin:10px 0 0 0; padding:3px}
.borderFill{background-image:url(../images/contact_bg.jpg); overflow:hidden; padding:10px; height:200px;}
.rightPanelContent{padding:10px; overflow:hidden; border:none}
.rightPanelButton{margin:10px 0 0 0; text-align:right; width:100%}
.rightPanelText{width:100%; overflow:hidden}
.rightPanelText a{color:#DF7B1D; text-decoration:underline;}

/*TrayStyles*/
.trayBg{width:79px; overflow:hidden; height:auto; float:left; z-index:1; background-repeat:no-repeat; background-color:#680C00;  }

/*Homepage*/
.homepageRowGen{ float:left; width:700px}
.hompageTopGen, .hompageTopGenWide {height:80px; background-repeat:no-repeat; float:left;}
.hompageTopGen{width:169px; margin-right:4px;}
.hompageTopGenWide{width:226px; margin-right:6px;}


.hompageTopOne{background-image:url(../images/hub-account.jpg);}
.hompageTopTwo{background-image:url(../images/my-usual.jpg);}
.hompageTopThree{background-image:url(../images/order-online.jpg); background-color:Black;}
.hompageTopFour{background-image:url(../images/give-a-gift.jpg);background-color:Black;}
.homepageTopOneLoggedIn{background-image:url(../images/Buttons/logged-in-my-usual.jpg);}
.homepageTopTwoLoggedIn{background-image:url(../images/Buttons/logged-in-top-up-your-account.jpg);}
.homepageTopThreeLoggedIn{background-image:url(../images/Buttons/logged-in-give-a-gift.jpg);}



.beaker{ background-image:url(../images/backgrounds/beaker.jpg)}
.fairtrade{ background-image:url(../images/backgrounds/fairtrade.jpg)}
.cream{ background-image:url(../images/backgrounds/cream.jpg)}
.flower{ background-image:url(../images/backgrounds/flower.jpg)}
.heart{ background-image:url(../images/backgrounds/heart.jpg)}
.hubinterior{ background-image:url(../images/backgrounds/hub-interior.jpg)}
.lattice{ background-image:url(../images/backgrounds/lattice.jpg)}
.machine{ background-image:url(../images/backgrounds/machine.jpg)}
.muffins{ background-image:url(../images/backgrounds/muffins.jpg)}
.pour{ background-image:url(../images/backgrounds/pour.jpg);}
.maker{ background-image:url(../images/backgrounds/maker.jpg)}

.pagebottom{float:left; width:690px; height:278px; background-repeat:no-repeat; background-position:right; margin-top:5px; background-color:#000; overflow:hidden; background-position:top right;}
.pagePanelLeft{ width:400px; float:left; margin:10px 0 0px 20px; display:inline;}
.pagePanelLeft p{ position:relative; bottom:10px;}
.pagePanelLeft .left{ margin-bottom:13px; }
.pagePanelLeft a{ color:#FFFFC9;font-family: Helvetica; overflow:hidden; text-align:left; font-size:10px; line-height:20px; font-weight:bold; text-decoration:underline; }

/*My Usual Page*/


/* LOGIN */
.logged-in-panel{margin:10px 0; width:188px; height:170px; background:url(../images/logged-in-panel-back.gif) no-repeat;} 
.logged-in-panel a img{margin-bottom:4px;}
.loginBalance{width:75px; background:#FFFFFF; margin-left:5px}

/* SHOPPING CART */
.shoppingLine{margin:15px 0 15px 0; border-top:3px solid #ffffff; width:100%}
.shoppingTitle{font-size:20px; color:#FFFFFF; font-weight:bold}
.shopBorderBackground{margin:10px 0 0 0; padding:3px; background-image:url(../images/template/shopping-cart-back.jpg); background-repeat:no-repeat;}
.shopBorderFill{overflow:hidden; padding:10px;}
.shopping-cart{width:188px; height:169px; background:url(../images/shopping-cart-back.gif) no-repeat;}

/* CUSTOMER CONSOLE */
.ccWrapper{overflow:hidden; margin:0 30px 40px 30px}
.ccTabWrapper{height:34px; overflow:hidden; background-image:url(../images/buttons/tab-background.jpg); background-repeat:repeat-x}
.ccContentWrapper{background-color:#DE7A1C; overflow:hidden}
.ccContentBack{margin:0 3px 3px 3px; background-color:#662D18; padding-bottom:24px; overflow:hidden}
.ccTab{width:134px; overflow:hidden}

/*Registration*/
.popupCentral{ width:100%; height:580px; text-align:center; position:absolute; top:25px; left:0; z-index:200008}
#popUpWrapper{ margin:auto; width:890px; position:relative; z-index:200008; border:solid 5px #8d8d8d;background-color:#FFF;}

.greyWrapperGen{ background-repeat:no-repeat;height:611px; width:890px;}
.topGreyWrapper{ background-image:url(../images/registration/outerBorderTop.jpg); background-position:top;}
.leftGreyWrapper{ background-image:url(../images/registration/outerBorderLeft.jpg); background-position:left}
.rhtGreyWrapper{ background-image:url(../images/registration/outerBorderRht.jpg); background-position:right;}
.bottomGreyWrapper{ background-image:url(../images/registration/outerBorderBottom.jpg); background-position:bottom;}
#popupArea{ margin:auto; width:890px; position:relative; z-index:200008}
.backgroundArea { height:600px; width:890px; background-color:#FFF;}

.innerRegBgWrapperGen{float:left; height:600px;width:890px;}
.whitebg{ background-color:#FFFFFF;  margin:5px; }
.registrationBxIntro{ width:551px; float:left; text-align:left; color:#000000; font-size:11px; margin:55px 0 0 0;}
.registrationBxIntro p{ text-align:left; font-size:11px; line-height:14px; font-weight:normal; float:left; width:100%; margin:5px 0 5px 0 }
.registrationBxIntro a{ color:#FFFFFF;font-family: Helvetica; font-weight:bold; overflow:hidden; text-align:left; font-size:11px; line-height:14px; text-decoration:none;}

.headerAndStagesRow{ float:left; width:830px; overflow:hidden;margin-left:30px;}
.headerAndStagesRowSpace{ float:left}
.stagesImages{ float:right; margin-left:5px}

.registrationFormRow{ float:left; width:830px; overflow:hidden;margin-left:30px; margin-top:20px; margin:20px 0px 0px 30px; background-image:url(../images/registration/bg_reg_inner.jpg); background-repeat:repeat-x;}
.registrationFormInnerBg_gen{ height:330px;}
.registrationFormInnerBg_left{ background-image:url(../images/registration/orangeBorderLft.jpg); background-repeat:repeat-y; background-position:left;}
.registrationFormInnerBg_right{ background-image:url(../images/registration/orangeBorderRht.jpg); background-repeat:repeat-y; background-position:right;}
.registrationFormInnerBg_top{ background-image:url(../images/registration/orangeBorderTop.jpg); background-repeat:repeat-x; background-position:top;}
.registrationFormInnerBg_bottom{ background-image:url(../images/registration/orangeBorderBtm.jpg); background-repeat:repeat-x; background-position:bottom;}
.registrationFormInnerBg_inner{ background-image:url(../images/registration/bg_reg_inner.jpg); background-repeat:repeat-x;}
.closebuttonregistration{ position:absolute; right:0px; top:0px}
.registerForm{ margin:10px 10px 0 0px; float:left; width:820px}

#RegisterfirstFormDetails label, #RegistersecondFormDetails label, #RegisterthirdFormDetails label{margin:6px 0 0 0;  width:100%; float:left;}
#RegisterfirstFormDetails select, #RegistersecondFormDetails select, #RegisterthirdFormDetails select {margin:0px;}
.addressgap{ height:18px;}

.selectBoxRegistration{ margin-bottom:0px;}
.titlegap{ height:5px; width:100%}


/*  .registerForm input, label, select{ width:400px; padding:0; margin:5px 0 0 0; float:left; border:none; text-align:left; font-size:12px} */
.formHolder{overflow:hidden; width:380px; float:left; margin:20px 0 0 40px; text-align:left}
.formHolder img{float:left; margin:5px 0 0 10px; }
.formRegisterHeaders{text-align: left; margin-bottom:21px; overflow: hidden; width:100%}
.formRegisterHeaders img{ float:left; padding:0}
.regFormRightCol{ width:350px; float:left; margin:20px 0 0 20px;}
.tipparagraph{ width:350px; text-align:left; font-size:12px; height:190px; margin:28px 0 0 3px;}


.ThankyouPanel {overflow:hidden; width:580px; float:left; margin:20px 0 0 40px; text-align:left}

#nextstepdivider {height:120px;}
*html #nextstepdivider  {height:80px;}

/*Bigh Bean popup styles*/
#bigBeanWrapper{ width:100%; float:left; height:451px; background-image: background-repeat:no-repeat; position:absolute; z-index:8000; top:220px; left:0px; z-index:1; background-position:center; }
/*#bigBeanWrapper{behavior: url(/includes/iepngfix.htc); }*/
#bigBeanWrapper .inner{ width:0px; height:0px; margin:auto; position:relative; left:180px; }
#bigBeanWrapper .closelink{cursor:pointer; margin:0; float:left; width:110px; height:20px; text-indent:70px; font-size:12px; position:relative; left:40px; bottom:2px;}
.closebuttonLinkHolder{float:left; width:200px;height:20px; margin:40px 0 20px 0;}
#bigBeanInnerWrapper{ width:200px;  margin:5px 0px 0 120px; float:left; z-index:1;display:inline; overflow:hidden;}
#bigBeanInnerWrapper label { width:200px; text-align:left;float:left;display:inline;}
.pointer{height:20px; margin:35px 0 0 125px; width:65px;cursor:pointer;}
.beancloserHolder{position:relative;top:0px;display: inline; height:58px; width:180px; float:left;}
.bigbeanImageHolder{position:absolute;  top:0px; left:0px; overflow: inherit; width: 100%; height:451px; background-repeat:no-repeat;}


/*The body text holder*/

.bodyTextHolder{ color:#000; text-align:left; font-size:11px; margin-top:10px;}

/*Enquiry Form*/
.popAreaEnquiry{width:890px; height:500px; overflow:hidden;background-color:#FFF; border:solid 5px #8d8d8d;  margin:80px auto auto auto;}
.enquiryCentral{ width:100%; height:580px; text-align:center; position:absolute; top:30px; left:3px; z-index:200008}
.EnquiryFormRow{ float:left; width:835px; height:250px;  overflow:hidden;margin:0px 0px 0px 30px; background-image:url(../images/registration/bg_reg_inner.jpg); background-repeat:repeat-x;border-bottom:solid 4px orange; display:inline;}
.EnquiryFormInnerBg_gen{ height:330px; text-align:left; }
.EnquiryFormInnerBg_gen label{ width:280px; float:left; margin: 0px 20px 10px 5px; position:relative; top:6px; display:inline;}
.EnquiryFormInnerBg_gen .txt{ width:280px;float:right; border:none; height:20px; margin-bottom:0px; margin-left:0px;}/*6PX DIFF*/
.EnquiryFormInnerBg_gen select{ width:160px;float:left; margin-left:3px}
.clearancedeviders{height:20px; width:100%;clear:both;}
.clearancedevidertop{height:30px; width:100%;clear:both;}
.EnquiryFormInnerBg_gen .btn{ float:right;  position:relative; bottom:14px; }
.EnquiryFormInnerBg_left{ background-image:url(../images/registration/orangeBorderLft.jpg); background-repeat:repeat-y; background-position:left;}
.EnquiryFormInnerBg_right{ background-image:url(../images/registration/orangeBorderRht.jpg); background-repeat:repeat-y; background-position:right;}
.EnquiryFormInnerBg_top{ background-image:url(../images/registration/orangeBorderTop.jpg); background-repeat:repeat-x; background-position:top;}
.EnquiryFormInnerBg_bottom{ background-image:url(../images/registration/orangeBorderBtm.jpg); background-repeat:repeat-x; background-position:bottom;}
.EnquiryFormInnerBg_inner{ background-image:url(../images/registration/bg_reg_inner.jpg); background-repeat:repeat-x;}
#popUpWrapperEnquiry{ margin:auto; width:900px; position:relative; z-index:200008}
.valField{text-align:left;}

.sloganHolderEnquiryForm{ float:left; margin-top:35px; width:470px;}
.headerWrapperEnquiry{height:224px; margin:0; overflow:hidden; position:relative; }
.topOrangeBrownstripBgEnquiry{height:auto; overflow:hidden; background-image:url(../images/enquirstrip.jpg); background-repeat:repeat-x;}
.topOrangeBrownstripFgEnquiry{height:auto; overflow:hidden;}
#thankyou{ text-indent:35px; font-size:14px; font-weight:bold;}

.enquiryBxIntro{ width:550px; float:left; text-align:left; color:#000000; font-size:12px; margin:30px 0 0 0; position:relative; bottom:30px;}
.enquiryBxIntro p{ display:inline;}

#hieghtie{ height:22px; border:solid 1px red; width:100%; margin:0px;}

.clearancedevidertopgap{height:25px}



.enqColumnWrapperLeft{ width:500px; margin-left:37px; padding-top:10px; padding-bottom:10px; display:inline}
.enqColumnWrapperMid{width:330px; float:left; margin-left:80px; margin-right:40px;}
.enqColumnWrapperRight{width:330px; float:left;}
.thankyoupanel{position:relative; bottom:110px}

/* Basket Summary */
.backgroundColour { background-color:#231f1f;}
#shopping-tray-list {margin-left:30px; width:618px;font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; color:#FFFFFF; text-align:left;}
#shopping-tray-list .item {height:19px;border-bottom:solid 1px #4a4a4a;}
#shopping-tray-list .quantity .item-quantity {margin:0; padding:0; font-size:10px; font-weight:bold;}
#shopping-tray-list .title, #shopping-tray-list .item-price, #shopping-tray-list .multiplier {margin-top:4px;}
#shopping-tray-list .left {float:left;}
#shopping-tray-list .title {width:380px;}
#shopping-tray-list .quantity {width:60px; text-align:right;}
#shopping-tray-list .item-price, #shopping-tray-list .multiplier {width:70px; text-align:right;}
#shopping-tray-list .delete-item {margin-top:3px; width:30px; text-align:right;}
#shopping-tray-list .subtotal, #shopping-tray-list .topup-value {clear:both; margin:6px 98px 0 0; text-align:right; float:right;}
#shopping-tray-list .total {clear:both; margin:6px 93px 0 0; width:129px; height:23px; text-align:right; float:right; background:url(../images/total-back.gif) no-repeat;}
#shopping-tray-list .total .padding {margin:5px 5px 0 0;}
#shopping-tray-list .payment-button {clear:both; float:right; margin:6px 93px 0 0;}

/* Payment Details */

#payment-options {width:625px;font-family:Arial, Helvetica, sans-serif; font-size:11px; font-weight:bold; color:#FFFFFF;text-align:left;}
#payment-options .options {float:left; width:270px;}
#payment-options .home-address {float:right; width:310px;}
.options .account-balance, .options .total-amount-payable, .options .optional-topup {margin-left:30px;width:220px;}
.options .optional-topup {margin-top:8px;}
#payment-options .topup-amount {margin:0; padding:0; font-size:10px; font-weight:bold;}
#pick-up-details {margin:16px 0 0 16px; width:261px; height:144px; background:url(../images/pick-up-details.gif) no-repeat;}
#pick-up-details .padding {float:left;margin:45px 14px 14px 14px;}
.right {float:right;}

.radPickupStyle {margin:0;}
#payment-options label, .divHomeAddressLabel {clear:left; float:left; text-align:right; margin-right:15px; width:140px; padding-top:5px; font-size:11px;}
#payment-options .dates {width:80px;}
#payment-options select {font-size:10px;}
.divHomeAddressTextBox {padding:3px; margin:0px 0px 3px 0px; border:0; font-size:10px;}
.payment-button {clear:both; float:right; margin-top:6px;}