/*
* Spacing and layout styles
*/

/*The top-left padding for the content area */
.ContentArea 
{
	padding-left:10px;
	padding-top:8px;
	padding-bottom:0px;
	padding-right:0px;			
}

/*The shelf needs to be a bit more squeezed than before*/
.ShelfContentArea 
{	
	padding-left:3px;
	padding-top:8px;	
	padding-bottom:0px;
	padding-right:0px;			
}

/* For a page with limited content width */

.FixedContentWidth 
{
	width:680px;
}


/* Used for page headers */
.FullContentWidth 
{
	padding-right:15px;
}

/* Styles for the left-menu, right-content areas on the site*/
.LeftMenuContent 
{
	float:left;
	width:150px;
}

/* Pads out the left menu items*/
.LeftMenuItem 
{
	padding-bottom:10px;
	padding-left:10px;
}

/*Pushes our right content out beyond our floating left menu*/
.RightContent 
{
	padding-top:5px;
	margin-left:155px;
	height:100%;
}



/* Footer at bottom of page classes - yes these are all used just to put the footer at the bottom*/
#outer
{
	min-height:100%; /*for mozilla as IE treats height as min-height anyway*/
	margin-bottom:-32px;
}
* html #outer /* ie 3 pixel jog*/ 
{
	height:100%;
}

#footer 
{
	width:100%;
	clear:both;
	height:30px;
	text-align:center;
	vertical-align:middle;
}
* html #footer /*only ie gets this style*/
{
	\height:32px;/* for ie5 */
	he\ight:30px;/* for ie6 */
}
#clearfooter
{/*needed to make room for footer*/
	clear:both;height:40px;
}

div,p  
{/*clear top margin for mozilla*/
	margin-top:0
}

* html #centrecontent 
{/* combat IE's 3 pixel jog */
	height:1%;margin-bottom:12px
}


/* 

TwoColumnWrapper Classes 
 - These classes are used to set the total width of all pages using the two column float layout
 - Ideally we wouldn't have to do this but we do not have a consistent width for content on the site
 - These are needed due to float-drop, we need to fix the conainer width else the right column wraps under the left
*/

/*Used to spaceout dynamic content*/
.BlankPage 
{
	width: 95%;
}

.ContactUsDetails 
{
	width: 95%;
}

.ContactUsFeedback 
{
	width: 650px;
}

/* All help pages are 90% stretchy*/
.HelpPages 
{
	width: 95%;
}

.MyProfileMyDetails 
{
	width:660px;
}

.MyProfileMySettings 
{
	width: 700px;
}

/*Put all address pages with the same width*/
.MyProfileMyAddresses 
{
	width: 802px;	
}

/*We want all lists to be a consistent width*/
.MyListsList 
{
	width: 802px;
}

.MyListsUsefulLists 
{
	width:95%;
}

.MyListsSavedRecipes 
{
	width:95%;
}

.MyListsSavedLists 
{
	width:95%;
}

.MyListsSaveNewList 
{
	width:500px;
}

.MyListsManageOnecards 
{
	width:650px;
}

.MyListsAuthoriseOnecard 
{
	width:650px;
}

.MyListsSavedRecipe 
{
	width: 600px;
}

/*
* Shelf Item Wrapping Div
* Width is fixed to keep all items in line
* Div is floated to get them to flow across shelf page
*/
.ShelfItem
{
	width:154px; 
	float:left;
	overflow:hidden;
	margin-top: 3px;
	margin-right:2px;
	margin-bottom:2px;
	margin-left:2px;
	border-right: solid 2px #e6e6e6;
	border-left: solid 2px #e6e6e6;
}


.ShelfItemHeader 
{
	background-color:#e6e6e6;	
}

/*The central div of the item*/
.ShelfItemCentre 
{
	background-color:#FFFFFF;
	margin: 2px 2px 4px 8px;	
}
.ShelfItemCentre div
{
	background-color:#FFFFFF;
}

/*The div contianing the item name - fix this height to keep all products in line*/
.ShelfItemName 
{
	height:40px;
}

/*The div containing the product image - fix this width to keep all products in line*/
.ShelfItemImage 
{
	background-color:White; 
	width:66px;
}

/*The div containing product price - float it next to image */
.ShelfItemPrice 
{
	background: white;
}

/*the div containing the item footer - clears previuos floats*/
.ShelfItemFooter 
{
	background-color:#e6e6e6;
}



/*
* Static Content Layout
*/

.BrowseDepartmentsArea 
{
	width: 200px;	
	padding-left:10px;
	background-color: #EEEEEE;
}

.BrowseDepartmentsBorder
{
	background-color: #EEEEEE;
}

.StaticContentArea 
{
	width: 450px;
}

.LoginArea 
{
	margin-left:10px;
	width: 225px;
}

/*
DAS Menu Styles
*/
.DASCategoryLevelMenuItem
{
	padding-top: 5px;
	padding-left: 5px
}

.DasMenuBucketLevel0
{
	display: none;
	width: 153px
}

.DasMenuBucketLevel1
{	
	display: none;
	width: 153px
}

.DasMenuBucketLevel2
{
	padding-left:10px;	
	display: none;
	width: 143px
}

.DasMenuBucketLevel3
{
	padding-left:10px;	
	display: none;
	width: 128px
}

.DasMenuBucketLevel4
{
	padding-left:10px;	
	display: none;
	width: 113px
}

.DasMenuItemLevel0
{
	width: 153px;
	font-weight:bold;
	background-position: 143px 0px;
	background-repeat: no-repeat;
	padding-bottom: 0px
}

.DasMenuItemLevel1
{
	width: 153px;
	background-position: 143px 0px;
	background-repeat: no-repeat;
	padding-bottom: 0px
}

.DasMenuItemLevel2
{
	width: 143px;
	background-position: 133px 0px;
	background-repeat: no-repeat;
	padding-bottom: 2px
}

.DasMenuItemLevel3
{
	width: 128px;
	background-position: 118px 0px;
	background-repeat: no-repeat;
	padding-bottom: 3px
}

.DasMenuItemLevel4
{
	width: 113px;
	background-position: 103px 0px;
	background-repeat: no-repeat;
}

.DasMenuTextItemLevel0
{
	vertical-align:middle;
	margin-right: 10px;
}

.DasMenuTextItemLevel1
{
	vertical-align:middle;
	margin-right: 10px;
	display:block
}

.DasMenuTextItemLevel2
{
	vertical-align:middle;
	margin-right: 10px;
	display:block
}

.DasMenuTextItemLevel3
{
	vertical-align:middle;
	margin-right: 10px;
	display:block
}

.DasMenuTextItemLevel4
{
	vertical-align:middle;
	margin-right: 10px;
	display:block
}

.InformationPageWidth
{
	width: 753px
}

.PagerWidth
{
	width: 635px
}

.delivery-hide, .pickup-hide, .delivery-pickup-hide
{
	display:none;
	clear:both;
	padding:5px 0px 0px 0px;
}

.div-check-box-field
{
	float:left;
	display:inline-block;
	width:25px;
}

.div-information-field
{
	float:left;
	display:inline-block;	
	width:550px;
	padding-top:3px;
}

.div-first-item
{
	display:block;
	overflow:hidden;
}