/* 
Belsoy.ca stylesheet
Author: Milena Polimeno
Date: 16/01/2008
Contents:	
	- General styling
	- Homepage
	- Header
	- Content and Navigation left
	- Navigation left
	- Content 
	- Footer
	- Sidebar
	- Shops
	- Recipes and Products
	- Form
 */

/* General styling
--------------------------- */
* {
	margin:0;
	padding:0;
	}
html, body {
	height: 100%;
	}
body, input, select, textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#848687;
	font-size:11px;
	}
body {
		background:url(../_images/bg_container.gif) left top repeat-y;
	}
#container {
	width:975px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin-bottom:-54px; /* the bottom margin is the negative value of the footer's height */
	}
.push {
	height: 54px; /* .push must be the same height as #footer + padding */
	}
h1 {
	margin-bottom:15px;
	}
h2 {
	font-size:13px;
	margin:10px 0;
	}
h3 {
	font-size: 11px;
	border-bottom: 1px solid #0BA5D7;
	margin:5px 0 15px 0;
	color: #0BA5D7;
	}
ul {
	margin-bottom:5px;
	}
ul, li {
	list-style-type: none;
	}
p {
	line-height:1.5em;
	margin-bottom:20px;
	}
a:hover, li a:hover {
	text-decoration:underline;
	}
a, a:link, a:visited {
	text-decoration:none;
	color:#26AFDC;
	line-height:1.5em;
	}
.BlueTxt {
	color:#0BA5D7;
	}
.marginRight30px {
	margin-right:30px;
	}
.marginBottom5px {
	margin-bottom:5px;
	}
.clear {
	clear:both;
	}
.floatLeft {
	float:left;
	}

/* Homepage
--------------------------- */
#home #content p {
	color:#0BA5D7;
	font-style:italic;
	margin:0px 80px 15px 60px;
	font-size:14px;
	}
	
/* Header
--------------------------- */
#topnav {
	background:url(../_images/bg_topnav.gif) left top no-repeat;
	height:38px;
	width:857px;
	float:left;
	}
#topnav ul {
	width:832px;
	margin:0 5px 0 20px;
	}
#topnav li {
	display:block;
	float:left;
	padding-right:5px;
	}
#topnav li.rightPart {
	float:right;
	}
#topnav li img {
	margin-top:13px;
	}
#languageSwitch {
	float:left;
	height:38px;
	width:	98px;
	margin-left:10px;
	}
#languageSwitch p {
	float:right;
	padding-left:5px;
	line-height:38px;
	vertical-align:middle;
	margin-bottom:0;
	color:#000;
	}
#languageSwitch a, #languageSwitch a:link, #languageSwitch a:visited {
	color:#848687;
	line-height:38px;
	}
#languageSwitch a:hover {
	color:#000;
	}
#header {
	float:left;
	}
#navItems {
	width:236px;
	float:left;
	}
#navItems div {
	width:118px;
	float:left;
	}
#bottomHeader {
	background:url(../_images/clouds.jpg) left top no-repeat;
	height:39px;
	width:857px;
	float:left;
	margin-bottom:20px;
	}
	
/* Content and Navigation left 
--------------------------- */
#content {
	width:827px;
	background-color:#D9EFFD;
	clear:left;
	padding:0px 30px 0 0;
	margin-right:4px;
	}

/* Navigation left
--------------------------- */
#leftNav {
	padding:0 40px 0 20px;
	float:left;
	width:170px;
	font-family:Arial, Helvetica, sans-serif;
	margin-top:3px;
	}
#leftNav ul li {
	font-weight:bold;
	background:url(../_images/arrow_link.gif) left 1px no-repeat;
	padding-left:15px;
	margin-bottom:10px;
	color:#0BA5D7;
	}
#leftNav ul li a {
	color:#848687;
	}
#leftNav ul li a:hover {
	color:#0BA5D7;
	}
#leftNav ul li ul {
	line-height:10px;
	}
#leftNav ul li ul li {
	background:none;
	margin:0;
	font-weight:normal;
	padding-left:0;
	line-height:14px;
	}
#leftNav ul li ul li a {
	line-height:14px;
	}

/* Content 
--------------------------- */
#centerContent {
	width: 597px;
	float:left;
	}
#centerContent li {
	list-style-type:square;
	margin-left:20px;
	}
#centerContent p img {
	margin-right:5px;
	}
#breadCrumbs {
	color:#13B5EA;
	font-weight:bold;
	height:40px;
	}
#breadCrumbs li {
	display:inline;
	margin-left:0;
	}

/* Footer
--------------------------- */
#footer {
	padding-top:20px;
	clear:left;
	height: 34px; /* .push must be the same height as .footer */
	background:#D9EFFD url(../_images/bg_footer.gif) left 18px repeat-x;
	width : 854px;
	margin-left:3px;
	}
div#footer div {
	width:280px;
	margin: auto 0;
	float:left;
	}
div#footer div.left {
	text-align:left;
	line-height:33px;
	}
div#footer div.center {
	text-align:center;
	}
div#footer div.center span {
	display:none;
	}
div#footer div.right {
	text-align:right;
	float: right;
	}

/* Sidebar
--------------------------- */
#sidebar {
	float:right;
	width: 110px;
	margin-top:40px;
	}
.box_right {
	margin-bottom: 15px;
	font: normal 10px Verdana, Arial, Helvetica, sans-serif;
	}

/* Shops 
--------------------------- */
#listShops {
	border-top:1px solid #0BA5D7; 
	width:200px; 
	}
#listShops div {
	border-bottom:1px solid #0BA5D7; 
	padding:5px 0 5px 5px;
	text-transform:uppercase;
	}
	
/* Recipes and Products
--------------------------- */
#products, #recipes {
	float:left;
	}
#products {
	width:500px;
	}
#recipes {
	width:400px;
	}
#products div, #recipes div {
	float:left; 
	margin:0 50px 20px 0; 
	width:100px;
	font-size:10px;
	}
#products div p, #recipes div p {
	font-weight:bold; 
	}
#products div p {
	height:60px; 
	}
#recipes div p {
	margin-bottom:5px;
	font-size:12px;
	}
#products img {
	border:1px solid #999; 
	margin-bottom:10px;
	}
a.moreInfo, a:link.moreInfo, a:visited.moreInfo, a:hover.moreInfo {
	color:#155EAD; 
	background:url(../_images/arrow_blue.gif) left 1px no-repeat; 
	padding-left:15px;
	}
#recipeDetail h1 {
	font-size:12px;
	}
#recipeDetail li {
	margin-left:0;
	}
#recipeDetail ul li {
	list-style:none;
	color:#0BA5D7;
	}
#recipeDetail ul li ul {
	margin:5px 0;
	}
#recipeDetail ul li ul li {
	list-style:square;
	color:#848687;
	margin-left:15px
	}
#recipeDetail p.serves {
	margin-bottom:0
	}
#recipeImg {
	float:left;
	width:140px;
	}
.recipeList {
	width:240px; 
	float:left; 
	margin-right:20px; 
	height:100px;
	}
.recipeList p {
	margin-bottom:0;
	}
.serves {
	background:url(../_images/serves.gif) left top no-repeat;
	padding-left:20px;
	line-height:28px;
	vertical-align:middle;
	padding-bottom:10px;
	}
.recipeListImg {
	float:left; 
	width:70px; 
	border-top:1px solid #FFF;
	padding:10px 0 20px 0;
	}
.recipeListTxt {
	float:left; 
	border-top:1px solid #B6B7B7; 
	width:165px;
	height:90px;
	padding:5px 0 5px 5px;
	}
.recipeListTitle   {
	height:30px;
	}
/* these classes have to be added to the last recipes in the overview*/
.brdrBtmWhite {
	border-bottom:1px solid #FFF;
	}
.brdrBtmGrey {
	border-bottom:1px solid #B6B7B7; 
	}

/* Form
--------------------------- */
.contactform input, .contactform select, .contactform textarea {
	border:1px solid #999999;
	padding:2px;
	float:left;
	}
.txtbox-medium {
	width:150px;
	margin:0 4px 0 0;
	}
.txtbox-large {
	width:214px;
	margin:0 4px 0 0;
	}
.txtbox-xlarge {
	margin:0 4px 0 0;
	width:307px;
	}
.txtbox-small {
	width:38px;
	margin:0 4px 0 0;
	}
.dropdown-small {
	width:60px;
	}
.dropdown-large {
	width:268px;
	}
.button {
	margin-left:187px;
	}
.button input {
	background-color:#FFF;
	margin-right:5px;
	}
.subscribe {
	clear:left;
	padding-top:10px;
	}
.subscribe p {
	float:left;
	}
.subscribe input {
	float:left;
	border:0;
	margin-right:5px;
	}
div.formField {
	clear:left;
	width:520px;
	padding-top:5px;
	}
div.formField label {
	float:left; 
	width:187px;
	}
div.formField textarea {
	width:310px;
	height:100px;
	float:left;
	}
.red {
	color:#FF0000;
	}
	
	
/* CSS ADDITIONS BY CPI */

.description_products {
	float:left;
	margin:0pt 0pt 0px;
	padding:0pt;
	width:400px;
}
.description_products_image {
	float:left;
	margin:0pt;
	padding:0pt 0px 0pt 0pt;
	width:135px;
}
.nutritional {
	width:100%;
	text-align:left;
	margin-bottom:25px;
}
.nutritional td {
	padding:2px;
	border-bottom: 1px solid #cccccc;
	vertical-align:top;
}
 .nutritional tr.multiple td {
	padding:2px;
	border-bottom: 1px dashed #CCCCCC;
	vertical-align:top;
}
.nutritional td span{
	padding:0px 15px
}
ul.stores {
	list-style:none !important;
	margin-left:-20px;
}
ul.stores li{
	background-image:url(../products/_images/pdf-icon.gif);
	background-repeat:no-repeat;
	padding-left:35px;
	line-height:20px;
	list-style:none !important;
	}