/* CSS Document */
body {
	background-color: #D1D5D9;
	font-family: "Meta", "Arial", "Verdana", "Helvetica", "sans-serif";
	font-size: 90%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
div, table, #content {
	font-family: "Meta", "Arial", "Verdana", "Helvetica", "sans-serif";
	/*border: solid 1px red;*/
}
a
{
	color: #1B2B42;
	text-decoration: none;
	font-weight: 700;
}
a:hover
{
	text-decoration: underline;
	color: #1B2B42;
}
.HideText
{
	text-indent: -5000px;
}
.Left
{
	float: left;
}
.Right
{
	float: right;
}
.ClearBoth
{
	clear: both;
}
/***********************************
*         MAIN ELEMENTS
***********************************/
#container {
	width:750px;
	min-width: 750px;
	margin: 0 auto 0 auto;
	text-align: left;
	padding: 0 10px;
	background: url(../Graphics/Header-Background.gif) #ffffff top left no-repeat;
}
/**************************************
*          HEADER SECTION
**************************************/
#header {
	margin: 0;
	padding: 0;
	height: 150px;
}
/* there will be multiple banners that can be applied through the admin system */
/*
#header #Kids2, #header #Kids3, #header #Cravings, #header #DayOfWork, #header #MidSnack {
	height: 133px;
	min-height: 140px;
	padding: 0;
	margin: 0;
	background-repeat: no-repeat;
	border-top: solid 1px #c4b3a6;
}
#header #Kids2 {
	background-image: url(../Graphics/Banners/Purple-two-children.jpg);
}
#header #Kids3 {
	background-image: url(../Graphics/Banners/Purple-three-children.jpg);
}
#header #Cravings {
	background-image: url(../Graphics/Banners/Purple-cravings.jpg);
}
#header #DayOfWork {
	background-image: url(../Graphics/Banners/Purple-day-off-work.jpg);
}
#header #MidSnack {
	background-image: url(../Graphics/Banners/Purple-midnight-snack.jpg);
}
*/

/**************************************
*            MENU
**************************************/
#menu {		
	width: 160px;
	min-width: 160px;
	padding:0px;
	float: left;
	margin: 50px 0 0 0;	
}
#menu img
{
	border: none;
	margin-top: 10px;
}
#menu ul.navlist {
	display:block;
	list-style: none;
	margin:0px;
	padding:0px;	
}
#menu ul.navlist a, #menu div {
	display: block;
	/*background-color: #1B2B42;*/
	color: #A2A6AE;
	text-decoration: none;
	padding: 3px 3px 3px 3px;
	margin: 0 0 0 0;
	border-bottom: solid 1px #A2A6AE;
}
#menu ul.navlist li{
	font-size:13px;
	font-weight:600;
	list-style: none;	
	padding: 0 0 2px 0;
	margin: 0;
}
#menu ul.navlist a:hover, #menu ul.navlist li.Selected a {
	color: #1B2B42;
	padding: 3px;
	/*background-color: #ffffff;
	border: solid 1px #1B2B42;*/
}
#menu ul.navlist li.Highlight a 
{
	background-color: #FF0000;
	color: #fff;
}


/***************************
*    SUB MENU 
**************************/
#menu ul.subMenu {
	margin: 0;
	padding: 0;
	list-style: none;
}
#menu ul.subMenu li {
	font-size:13px;
	font-weight:600;
	list-style: none;	
	padding: 0 0 2px 0;
	margin: 0;
	background-color: #D1D5D9;
}
#menu ul.subMenu li a {
	color: #A2A6AE	;
	text-decoration: none;
	display: block;
	font-weight: 600;
	padding: 4px;
	margin: 0 0 0 0;
}
#menu ul.subMenu li a:hover, #menu ul.subMenu li.Selected a {
	color: #ffffff;
	/*background-color: #c8cce9;
	border: solid 1px #1B2B42;*/
	padding: 4px;
}

/***************************
*    Page Titles
**************************/
#PageTitle
{
	padding: 0;
	margin: 0 0 0 20px;
	color: #A2A6AE;
	height: 30px;
	width: 550px;
	font-size: 1.9em;
	float: left;
}
#PageTitleOnly
{
	padding: 0;
	margin: 0 0 20px 20px;
	color: #A2A6AE;
	/*height: 30px;*/
	width: 550px;
	font-size: 1.9em;
	float: left;
}

/***************************
*    Breadcrumb
**************************/
#breadCrumb {
	padding: 0 0 0 20px; 
	font-size: 0.8em;
	color: #A2A6AE;
	height: 20px;
	width: 570px;
	float: left;
}
#breadCrumb ul {
	margin-left: 0;
	padding-left: 0;
	display: inline;
	border: none;
	} 
#breadCrumb ul li {
	margin-left: 0;
	padding-left: 2px;
	border: none;
	list-style: none;
	display: inline;
	}
#breadCrumb ul li a {
	font-weight: bold;
	color: #A2A6AE;
	text-decoration: none;
}
#breadCrumb ul li a:hover {
	color: #1B2B42;
}

/***************************
*    Normal Content 
**************************/
#content{
	margin: 0 10px 0 10px;
	padding: 0 0 0 0;
	float: left;
	font-size: 0.9em;
	width: 400px;
	min-width: 400px;
}
#content dl
{
	margin: 0 0 10px 0;
	padding: 0;
}
#content dt
{
	font-weight: 700;
	padding-bottom: 5px;
}
#content dd
{
	padding: 0 0 10px 0;
	margin: 0;
}
#content h3
{
	font-size: 1.2em;
	line-height: 20px;
	padding: 0;
	margin: 0 0 10px 0;
	color: #1B2B42;
}
#content .BoxBottom h3
{
	font-size: 1.2em;
	padding: 0;
	margin: 0 0 10px 0;
	color: #1B2B42;
	width: 200px;
}
#content h4
{
	font-size: 1.1em;
	padding: 0;
	margin: 0 0 10px 0;
	color: #1B2B42;
}
#content p
{
	padding: 0;
	margin: 0 0 10px 0;
}
#content #FinishList
{
	margin-bottom: 10px;
}

.BoxTop
{
	/*background: url(../Graphics/BoxTop.gif) top left no-repeat;*/
}
.Box
{
	border-bottom: solid 2px #D1D5D9;
	/*background: url(../Graphics/Box.gif) top left repeat-y;*/
	margin-bottom: 5px;
}
.BoxBottom
{
	/*background: url(../Graphics/BoxBottom.gif) bottom left no-repeat;*/
	padding: 10px 15px;
}
.CompareBox
{
	width: 183px;
	padding: 5px;
	border: solid 1px #1B2B42;
}

#content div.EliteRetailerDetails
{
	border: solid 2px #1B2B42;
}

#content div.RetailerDetails
{
	border: solid 2px #EBE5E0;
}

#content div.EliteRetailerDetails, #content div.RetailerDetails
{
	float: left;
	width: 170px;
	padding: 0 5px 5px 5px;
	font-size: 80%;
	height: 300px;
	margin: 0 5px 5px 0;
}

#content div.EliteRetailerDetails dl, #content div.RetailerDetails dl
{
	margin-bottom: 0;
	margin-top: 0;
}

#content div.EliteRetailerDetails dd, #content div.RetailerDetails dd
{
	margin-left: 10px;
}

#content div.EliteRetailerDetails dt, #content  div.RetailerDetails dt
{
	font-weight: 700;
}

#content div.EliteRetailerDetails a, #content div.RetailerDetails a
{
	float: right;
}
/***************************
*    Right Panel 
**************************/
#rightPanel{
	float: left;
	margin: 0;
	padding: 0;
	width: 170px;
	min-width: 170px;
}
#rightPanel .borderedBox{
	margin: 0 0 10px 0;
	padding: 10px;
	border: solid 1px #1B2B42;
	color: #1B2B42;
	font-size: 0.9em;
}
#rightPanel h3{
	margin: 0;
	padding: 0 0 5px 0;
	font-size: 1.2em;
	line-height: 15px;
	color: #1B2B42;
	text-align: center;
}
#rightPanel .DropDown{
	width: 148px;
	margin-bottom: 5px;
	color: #1B2B42;
}
#rightPanel .TextBox{
	width: 142px;
	margin-bottom: 5px;
	color: #1B2B42;
}
#rightPanel p
{
	margin: 0;
	padding: 0 0 5px 0;
}
#rightPanel a.GranniesRecipes
{
	margin: 0 0 10px 4px;
}
#rightPanel a.GranniesRecipes:hover
{
	text-decoration: none;
}
#rightPanel a.GranniesRecipes img
{
	border: none;
}
/***************************
*    Wide Content 
**************************/
#wideContent{
	margin: 0 0 0 10px;
	padding:0 0 0 0;
	float: left;
	width: 580px;
	min-width: 580px;
}


/***************************
*    Footer
**************************/
#footer{
	float:left;
	width: 750px;
	min-width: 750px;	
	margin: 0;
	padding: 5px;
	text-align: center;
}
#footer a {
	color: #A2A6AE;
	text-decoration: none;
	font-size: 0.6em;
	padding: 0 5px;
}
#footer a:hover {
	color: #1B2B42;
	text-decoration: underline;
}

/***************************
*    Category List
**************************/
.Category
{
}
.Category img
{
	float: right;
	padding: 5px;
}

/***************************
*    Product List
**************************/
.Product
{
}
.Product img
{
	float: right;
	padding: 5px;
}

.Product .Button
{
	line-height: 20px;
}

.Specifications
{
	margin-top: 20px;
}

/***************************
*    Product Details
**************************/
#prodImages
{
	float: right;
	width: 150px;
}





/***************************
*         buttons
**************************/
.Button /*, .DetailsButton*/{
	font-size:11px;
	/*border:solid 1px #1B2B42;*/
	text-align:center;
	font-weight:600;
	color:#ffffff;
	margin-bottom: 5px;
	cursor: pointer;
	padding: 4px;
	background-color: #969699;
}
.Button a, .DetailsButton a{
	text-decoration:none;
	font-weight:600;
	color:#1B2B42;
}
.Button:hover, .DetailsButton:hover{
	text-decoration:none;
	font-weight:600;
	color:#1B2B42;
}

.print{
	float: right;
	clear: both;
	font-size: 0.7em;
	cursor: pointer;
	margin-top: 20px;
	/*display: none;*/
}



/***************************
*         Textboxes
**************************/
.TitleTextbox
{
	width: 32px;
}
.FirstnameTextbox
{
	width: 250px;
}
.FullWidthTextbox
{
	width: 300px;
}
.PostcodeTextbox
{
	width: 100px;
}









/*


#productsContainer {
	width:800px;
	min-width: 800px;
	margin: 0 auto 0 auto;
	text-align: left;
	background-color: #ffffff;
	padding: 0 0 0 0;
	
	}
h1 {
	font-size: 120%;
	margin: 15px 0px 15px 30px;
	color: #1B2B42;
	}
h3 {
	margin: 7px 7px 2px 33px;
	color: #1B2B42 ;
	font-weight:1000;
	}
h2 {
	font-size: 90%;
	margin: 7px 7px 2px 15px;
	color: #1B2B42 ;
	}
h4 {
	font-size: 70%;
	margin: 7px 7px 5px 15px;
	color: #1B2B42 ;
	}
*/


/**************************************
*            PANNELS
**************************************/



/**************************************
*            text & images
**************************************/
#footerText{
	font-size:100%;
	color:#1B2B42;
	}
.homepageImage{
	float: left;
	padding: 0 15px 15px 0
	}
.productsImage{
	float: left;
	padding: 0 5px 5px 5px;
	}
.productCategoryImage{
	float: left;
	padding: 0 3px 3px 3px;
	width:138px;
	height:126px;

}
p.purpleText{
	font-size:11px;
	color:#1B2B42;
	margin: 5px 5px 15px 15px;
	}
div.blackText{
	font-size:10px;
	float:left;
	color:#000000;
	margin: 5px 3px 30px 11px;
	padding-bottom:20px;
	width:195px;
	height:126px;
	/*height: 1%;
    display: table;*/
	}
.text{
	font-size:10px;
	color:#000000;
	padding:15px 15px 15px 15px;
	margin:0px;

}
p.title{
	font-size: 120%;
	margin: 10px 0px 0px 30px;
	padding:0 0 0 0px;
	color: #1B2B42;

}
.search{
	margin:10px 10px 4px 0;
	float:right;
	}
.selectionForm{
	margin:3px 10px 0 0;	
	}
#searchForm{
	margin-top:0 ;
	}
.thumbnail{
	margin: 3px 0px 3px 5px;
	}
/**************************************
*            breadcamb
**************************************/
p#breadcramp{
	display:inline;
	
	font-size:10px;
	color:#1B2B42;
	margin: 0 0 5px 30px;
	padding: 0 0 0 0;	
}
p#breadcramp a{
	
	font-size:10px;
	color:#1B2B42;
	text-decoration:none; 
}
a.boldBreadcramp{
	font-weight:700;
	
}

/**************************************
*            content rounded box
**************************************/
/*.tl {
	background: url(../images/TOP.gif) no-repeat top left; 
	width: 387px; 
	height:28px; 
	/*float:left;  
	margin:0 0 0 0px;
 }
.tr {
	background: url(../images/BOTT.gif) no-repeat bottom left ;
	width: 387px; 
	height:25px; 
	margin:-15px 0 0 0
}
.mid{
	background: url(../images/repeat.gif) repeat-y; 
	margin:28px 0px 0px 0px;
	height:1%;
    display: table;}*/
.tl {background: url(../images/TOP.gif) no-repeat top left; width: 387px; height:28px; position:relative; float:left;  margin:0 0 0 0px; }
.tr {background: url(../images/BOTT.gif) no-repeat bottom left ;width: 387px; height:25px; position:relative; float:left; margin:-15px 0 10px 0}
.mid{background: url(../images/repeat.gif) repeat-y; width: 387px; margin:28px 0px 0px 0px;}
/**************************************
*            breadcamb
**************************************/

.extraDetail{
	float:left;
	width:400px;
	height: 1%;
    display: table;

	border:1px solid #990099;
	
	}
#detailImage{
	float: right;
	padding: 0 3px 3px 3px;
	width:138px;
	height:126px;


}
#detailList{
	
	padding: 0 3px 3px 3px;
	width:138px;
	min-height:138px;
	height: 1%;
    display: table;

}
.productDetail{
	/*border: solid 3px purple;*/
	float:left;
	height:250px;
	min-height:250px;
	margin:0 0 0 0px;
	padding:2px 0 0 0px;
	border: solid 1px #F7931D;
	height: 1%;
    display: block;
	/*background-position:left bottom;
	background-repeat:no-repeat*/
}
/********************************
*           CLEARFIX
********************************/
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */