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

Wedge Farms Nutrition Ltd.

Website Design: Steve Melnyk Design Studio  (http://www.smdesign.ca/)

Credits:
- Assorted icons from the Silk icon collection (http://www.famfamfam.com/lab/icons/silk/

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


/***

 Basic Styles
 
***/

	body {
		margin: 0;
		padding: 0;	

		text-align: center;
		font-family: "Lucida Grande", Arial, Helvetica, sans-serif;		
		color: #444;
		background: #4e4e4e url(/img/bg-top.jpg) center top repeat-x;
		}
	

		body {
		font-size: 75%;
		}
		 
		html>body {
		font-size: 12px;
		}
		 
	

	
	li {
		height: 1em;
		}
	
	html>body li {
		height: auto;
		}

	.clear {
		clear: both;
		}

	a img {
		border: none;
		}
	

	form {
		margin: 0;
		padding: 0;
		}
		
	pre {
		position: absolute;
		top: 10px;
		left: 10px;
		opacity: 0.8;
		font-size: 10px;
		background: #eee;
		border: 1px dotted #aaa;
		padding: 10px;
		width: 500px;
		z-index: 999999;
		text-align: left;
		}
	
	pre:hover {
		opacity: 1;
		}



/***

 Layout
	
***/

		
	#header {
		width: 760px;
		padding: 0;
		margin: 0 auto;
		position: relative;
		}
		
	
		#header #logo {
			height: 65px;
			background: url(/img/bg-header.jpg) center top no-repeat;
			}
	
			#header #logo a {
				width: 305px;
				height: 40px;
				position: relative;
				display: block;
				top: 10px;
				left: 20px;
				text-indent: -9999px;
				overflow: hidden;
				}
	
	
		#header #top {
			height: 282px;
			position: relative;
			}
			
			#page-index #top { background: url(/img/top-index.jpg) left top no-repeat; }
			#page-about #top { background: url(/img/top-about.jpg) left top no-repeat; }
			#page-products #top { background: url(/img/top-products.jpg) left top no-repeat; }
			#page-shop #top { background: url(/img/top-products.jpg) left top no-repeat; }
			#page-locations #top { background: url(/img/top-products.jpg) left top no-repeat; }
			#page-recipes #top { background: url(/img/top-products.jpg) left top no-repeat; }
			#page-contact #top { background: url(/img/top-contact.jpg) left top no-repeat; }

/***

  Navigation
 
***/

    #tabs {
      position: absolute;
      bottom: 0px;
      left: 20px;
      width:700px;
      line-height:normal;
      font-size: 11px;
      }
    #tabs ul {
	  margin:0;
	padding: 0;
	  list-style:none;
      }
    #tabs li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabs a {
      float:left;
      background: url(/img/bg-nav.jpg) left bottom repeat-x;
      margin:0 3px 0 0;
      padding:0;
      text-decoration:none;
      }
    #tabs li.nav-shop a {
      background: url(/img/bg-nav-shop.jpg) left bottom repeat-x;
      font-weight: bold;
	  }
	  
	 #tabs li.nav-shop a:hover span {
	 	color: #000;
	 	}

    	
    #tabs a span {
      float:left;
      display:block;
      /*background: url("tabright.gif") no-repeat right top;*/
      padding: 9px 15px 9px 15px;
      color:#fff;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabs a span {float:none;}
    /* End IE5-Mac hack */
    #tabs a:hover span {
      color:#333;
      }
    #tabs a:hover {

      }
    #tabs a:hover span {

      }

	#tabs li#current a {
		font-weight: bold;
		background: url(/img/bg-nav-current.jpg) left bottom repeat-x;
		}
	
		#tabs li#current a:hover span {
	      color: #fff;
		  }






/***

 Main div 

***/

	
	#middle {
		background: #e8e8e8;
		}

	
	#main {	
		width: 760px;
		background: #fff;
		border-left: 1px solid #ddd;
		border-right: 1px solid #ddd;
		margin: 5px auto 0 auto;
	}
	


	

/***

 Main content area

***/

	#content {
		margin: 0 34px;		
		padding-bottom: 20px;
		text-align: left;
		}
				
	
	#content p, #content li {
		font-size:1em;
		margin-top: 1.5em;
		margin-bottom: 1.5em;
		line-height: 1.833em;
		}

	
	#content h1 {
		margin: 0;		
		padding: 25px 0 0 0;
		font-family: Georgia, "Times New Roman", Times, serif;
		color: #0068b3;
		font-weight: normal;
		font-size: 24px;
		line-height: 28px;
		}
		
	#content h2 {
		margin-top: 2em;
		margin-bottom: .5833em;
		padding: 0;
		
		color: #000;
		font-weight: bold;
		font-size: 14px;	
		line-height: 1.1667em;
		}
		
	#content h3 {
		font-size: 12px;
		color: #777;
		margin-top: 1em;
		margin-bottom: .4em;
		border-bottom: 1px dotted #ccc;
		}
		
	#ajax-content h2 {
		margin-top: 0em;
		background: #f3f3f3;
		padding: 10px;
		}	
	
	#content .spaced li {
		margin-top: 1em;
		}
		
	#content p.brief {
		border-bottom: 1px #e6E0D6 dotted;
		padding-bottom: 1.45em;
	}
		
	#content p.center {
		text-align: center;
		}
		
	#content a {
		color: #0068b3;
		font-weight: bold;
		}
		
	#content a:hover {
		color: #000;
		}
	
	.smallcaps {
		text-transform: uppercase;
		font-size: 11px;
		}
		

	
	.nobr {
		white-space: nowrap;
		}
		
		
	
	#content .col50 {
		float: left;	
		width: 45%;
		}

	
	.link-brief {
		font-size: 12px;
		color: #777;
		display: block;
		line-height: 16px;
		}
	
	
	
	#img-oats-front {
		width: 228px;
		float: right;
		position: relative;
		margin: 0;
		padding: 0;
		margin-top: -45px;
		margin-right: -15px;
		margin-left: 10px;
		margin-bottom: 10px;
		}
	
	.youtube {

		padding: 10px;
		}
	
	#movie {
		float: right;
		width: 427px;
		padding-top: 10px;
		}
	
	#img-dragonsden-front {
		width: 230px;
		float: left;
		position: relative;
		margin: 0;
		padding: 0;
		margin-top: 0;
		margin-left: -15px;
		margin-right: 10px;
		}		
	
	#cavena-bullets {
		width: 218px;
		float: right;
		position: relative;
		margin: 0;
		padding: 0;
		margin-right: -34px;
		margin-left: 10px;
		margin-bottom: 15px;
		}
	
	cite {
		display: block;
		background: url(/img/icons/vcard.png) left center no-repeat;
		font-style: italic;
		padding-left: 25px;
		font-size: 11px;
		border-top: 1px dotted #ccc;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	
	.col2-1 {
		width: 45%;
		margin-right: 4%;
		float: left;
		}
	
	.col2-2 {
		width: 45%;
		float: right;
		}
	
		
	.col3-1 {
		width: 32%;
		margin-right: 4%;
		float: left;
		}
	
	.col3-2 {
		width: 32%;
		float: left;
		}
	
	.col3-3 {
		width: 32%;
		float: right;
		}
	
	
	
	
	#headlines {
		position: relative;
		width: 690px;
		height: 40px;
		}
		
	#scrollup {
		position: absolute;
		overflow: hidden;
		background: #eee;
		height: 26px;
		width: 586px;
		top: 14px;
		left: 102px;
		border: 1px solid #ccc;
		border-left: none;
		border-right: 1px solid #aaa;
		border-bottom: 1px solid #aaa;
	}
	
	#headlines .title {
		position: absolute;
		left: 0;
		top: 14px;
		
		font-weight: bold;
		width: 100px;
		height: 26px;
		
		font-size: 11px;	
		text-align: center;	
		text-transform: uppercase;
		color: #fff;
		/*background: url(/img/bg-grey.jpg) left top repeat-x;
		border: 1px solid #555;
		border-bottom: 1px solid #333;
		*/
    	background: url(/img/bg-nav-current.jpg) left bottom repeat-x;
		border: 1px solid #558;
		border-bottom: 1px solid #335;
	}
	
	#headlines .title div {
		margin-top: 6px;
		}
		
	.headline {
		position: absolute;
		top: 210px;
		left: 10px;
		height: 26px;
		padding-top: 2px;
		width:70%;
		font-size: 10px;
		
	}

	.headline a {
	
		}
	.headline .source {
		font-style: italic;
		color: #666;
		padding-left: 4px;
		}
		
		

 	#content h2 a.caps {
 		padding: 3px;
 		background: #eee;
 		text-transform: uppercase;
 		font-size: 12px;
 		font-weight: bold;
 		text-decoration: none;
 		}
	
		#content h2 a.caps:hover {
			background: #ddd;
			color: #000;
			text-decoration: underline;
			}
	
	
	
/***

 Footer

***/


#footer {
	background: #535353;
	width: 760px;
	margin: 0 auto;
	padding: 4px 0 2px 0;
	font-size: 0.916em;
	line-height: 2em;
	text-align: left;
	color: #fff;
}


	#footer p {
		margin-bottom: 2em;
		margin-top: 0;
	}

	.contact-c1 {
		margin-left: 34px;
		padding-top: 15px;
		width: 200px;
		float: left;
		display: inline;
		}
		
		#content .contact-c1 { width: 270px; margin-left: 65px; padding-top: 0; }
		
		.contact-c1 p {
			padding-left: 28px;
			background: url(/img/icons/email_open.png) left 2px no-repeat;
		}
	
	.contact-c2 {
		padding-top: 15px;
		width: 210px;
		margin-left: 20px;
		float: left;
		display: inline;
		}
		
		#content .contact-c2 { width: 270px; padding-top: 0; }

		.contact-c2 p.phone {
			padding-left: 28px;
			background: url(/img/icons/telephone.png) left 2px no-repeat;
			}
		
		.contact-c2 p.email {
			padding-left: 28px;
			background: url(/img/icons/form.png) left 2px no-repeat;
			}
			
			#footer .contact-c2 .email a {
				color: #fff;
				text-decoration: none;
				}
				
			#footer .contact-c2 .email a:hover {
				color: #fff;
				background: #333;
				}
		
		
	
	#footer .contact-map {
		width: 240px;
		padding-top: 12px;
		margin-bottom: 10px;		
		margin-right: 34px;
		float: right;
		display: inline;
	
		}
		
		.contact-map a img {
			border: 3px solid #888;
		}
		
		.contact-map a:hover img {
			border: 3px solid #444;
			}


#copyright {
	width: 760px;
	text-align: center;
	margin: 0 auto;
	padding: 10px 0 13px 0;
	font-size: 0.833em;
	line-height: 2em;
	color: #777;
	}
	
	#copyright a {
		color: #777;
		}
		
	#copyright a:hover {
		color: #ccc;	
		}


/***

 Typography

***/

#content .small {
	font-size: 12px;
	}

.error {
	color: #c00;
	font-weight: bold;
	padding-left: 28px;
	background: url(/img/error.jpg) left 1px no-repeat;
	}

.msg {
		color: #077619;
	font-weight: bold;
	}

.address {
	border-left: 5px solid #eee;
	padding-left: 12px;
	margin-left: 20px;
	}


#content ul li {
	margin-top: 4px;
	margin-bottom: 4px;
	}
#content ul {
	margin-bottom: 1em;
	}
	
	
	
/***

Shop

***/

#shop {

}

#products {
	margin: 20px 0 0 0;
	border-top: 1px solid #333;
	border-bottom: 1px solid #ccc; 
	}
	
	#products-head {
		margin: 0;
		background: #555;
		padding: 15px;
		color: #fff;
		border-bottom: 1px solid #444;
		border-right: 1px solid #444;
		border-left: 1px solid #444;
		}
	
		#products-head p {
			margin: 0;
			font-size: 11px;
			line-height: 16px;		
			}
	
	
	#products-list {
		padding: 15px 5px 15px 30px;
		border-right: 1px solid #ccc;
		border-left: 1px solid #ddd;		
		background: #f0f0f0 url(/img/shop/bg-field.jpg) left top repeat-x;
		}
	
	.product {
		width: 195px;
		float: left;
		border: 1px solid #bbb;
		background: #f3f3f3;
		border-right: 1px solid #999;
		border-bottom: 1px solid #999;
		margin-right: 20px;
		}
		
		.last { margin-right: 0; }
		
	.product:hover {
		border: 1px solid #aaa;
		background: #e9e9e9;
		border-right: 1px solid #777;
		border-bottom: 1px solid #777;
		}
		
	.product-img {
		margin: 10px;
		border: 1px solid #ccc;
		text-align: center;
		background: #fff;
		padding: 5px 0;
		}
	
	.product-details {
		margin: 10px 17px 17px 17px;
		text-align: center;
		}
		
	.product-info {
		margin: 15px 0;
		font-size: 13px;
		font-weight: bold;
		}
		
	.product-price {
		font-weight: bold;
		}
	
	.product-qty {
		font-size: 12px;
		color: #fff;
		text-transform: uppercase;
		text-align: center;
		padding: 6px 0;
		font-weight: bold;
		border-top: 1px solid #185c8d;
		}
		
		.product-qty input.text {
			width: 55px;
			margin-left: 5px;
			font-size: 16px;
			padding: 3px;
			}
			
		input.btn-add {
			padding-top: 15px;
			padding-bottom: 3px;
			}
		
		input.btn-add:hover {
			margin-top: -1px;
			margin-bottom: 1px;
			}


#shop-footer {
	
	}
	
	#shop-footer p {
		margin-top: 0;
		float: left;
		width: 450px;
		font-size: 11px;
		}
	
	#shop-footer input {
		float: right;
		}


#fc_minicart {
	display: none;
	position: absolute;
	width: 173px;
	height: 38px;
	top: 0;
	right: 7px;
	text-align: left;
	}
	
	#fc_minicart a {
		display: block;
		width: 173px;
		height: 38px;
		background: url(/img/shop/bg-minicart.png) left top no-repeat;
		color: #444;
		font-size: 10px;
		text-decoration: none;
		}
	
		#fc_data {
			display: block;
			padding-top: 12px;
			padding-left: 40px;
			}
	
	#fc_minicart a:hover {
		margin-top: -1px;
		color: #000;
		text-decoration: underline;
		}



/***

Misc

***/


#ajax-content {
	padding: 4px;
}

#page-about .coming-soon {
	background: #ebf2fe url(/img/icons/information.png) 17px 22px no-repeat;
	margin: 35px 60px 25px 60px;
	border-top: 1px solid #cbdaf6;
	border-bottom: 1px solid #cbdaf6;
	padding: 20px 20px 23px 40px;
	}
	
.box-error {
	background: #fee url(/img/icons/exclamation.png) 17px 22px no-repeat;
	margin: 35px 60px 25px 60px;
	border-top: 1px solid #d99;
	border-bottom: 1px solid #d99;
	padding: 20px 20px 23px 40px;
	}	

.cavena-locations {
	width: 96%;
	margin-left: 2%;
	}


.cavena-locations ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	font-size: 11px;
	padding-top: 10px;
	}
	
	#content .cavena-locations  ul li {
		font-weight: normal;
		list-style-type: none;
		background: url(/img/icons/building.png) left top no-repeat;
		padding-left: 22px;
		padding-bottom: 5px;
		font-size: 11px;
		font-weight: bold;
		line-height: 15px;
		}
	
	.cavena-locations address {
		font-size: 11px;
		margin: 0;
		font-weight: normal;
		display: block;
		}

.sidebar {
	width: 200px;
	float: right;
	padding: 0;
	margin: 20px 0 15px 10px;
	background: #f9f9f9;
	border: 1px solid #ccc;
	}
	
	.sidebar a {
		border-top: 1px solid #fff;
		display: block;
		text-align: left;
		padding: 5px 5px 5px 26px;
		text-decoration: none;
		font-size: 10px;
		line-height: 16px;	
	}
	
	.sidebar a:hover {
		background-color: #eee;
		}
	
#locations {
	background: #f9f9f9 url(/img/icons/magnifier.png) 6px 5px no-repeat;
	}

#nutrition-link {
	background: #f9f9f9 url(/img/icons/table.png) 6px 5px no-repeat;
	}

#buy-link {
	background: #f9f9f9 url(/img/icons/cart_add.png) 6px 5px no-repeat;
	}

#brochure-link {
	background: #f9f9f9 url(/img/icons/icon-pdf.gif) 8px 6px no-repeat;
	}	
	

table#nutrition {
	margin: 20px auto;	
	width: 520px;
	}
	
	#nutrition thead, #nutrition tbody {
		margin: 0;
		padding: 0;
		}

	#nutrition th, #nutrition td {
		padding: 5px;
		}

	#nutrition thead th {
		font-weight: bold;
		background: #333;
		text-transform: uppercase;
		font-size: 11px;
		color: #fff;		
		text-align: center;
		}
		
	
	#nutrition thead th.title { 
		background: #fff;
		color: #666;
		text-transform: none;
		font-size: 11px; 
		font-style: italic;
		font-weight: normal;
		text-align: center;
		}

	#nutrition tr  {
		background: #f6f6f6;
		margin: 0;
		padding: 0;
		}
	
	#nutrition tr.odd td, #nutrition tr.odd th {
		background: #eee;
		}
	
	#nutrition td {
		text-align: center;
		}
	
	#nutrition thead th.cavena {
		background: #0067b1;
		color: #f7f71e;
		}
	#nutrition td.cavena {
		background: #e3eeff;
		font-weight: bold;
		}
	#nutrition tr.odd td.cavena {
		background: #d3e3f9;
		}			
		
	#nutrition tfoot a {
		text-decoration: none;
		display: block;
		background: url(/img/icons/icon-pdf.gif) right center no-repeat;
		padding-right: 17px;
		text-align: right;
		
	}
	
	#nutrition tfoot td {
		background: #fff;
		}

	#nutrition td.cavena-facts {
		background: #0067b1;
		color: #f7f71e;
		text-transform: uppercase;
		font-weight: bold;
		font-size: 11px;
		padding-top: 6px;
		padding-bottom: 6px;
		}


#page-recipes .ingredients li {
	font-size: 11px;
	margin: 0;
	padding: 0;
	}
	
	#page-recipes .back-link a {
		width: 200px;
		float: right;
		display: block;
		text-align: right;
		padding-right: 22px;
		background: url(/img/icons/arrow_undo.png) right center no-repeat;
		margin-top: 30px;
	}
	
	#page-recipes .back-link-bottom {
		text-align: right;
		margin-top: 20px;
		margin-bottom: 15px;		
		}
	
	#page-recipes .back-link-bottom a {
		padding-right: 22px;
		background: url(/img/icons/arrow_undo.png) right center no-repeat;

	}
	

#recipe-list {
	list-style-type: none;
	margin: 20px 0;
	padding: 0;
	padding-left: 40px;
	}
	
	#recipe-list h2 {
		margin: 0;
		}
	
	#content #recipe-list li {
		width: 290px;
		height: 190px;
		display: block;
		overflow-y: auto;
		float: left;
		margin-right: 20px;
		margin-bottom: 15px;
		border: 1px dotted #ccc;
		background: #fcfcfc;	
		}
	
	#recipe-list .recipe-inner {
		margin: 10px;
		}
		
		#recipe-list li:hover {
			border: 1px solid #cce;
			background: #f9fcff;
			}
		
	#recipe-list cite {
		margin: 8px 0 0 0;
		padding: 4px 0 3px 22px;
		line-height: 13px;
		border: none;
		background-position: 0 2px;		
		}
	
	
	#recipe-list .recipe-link a {
		display: block;
		text-align: right;
		padding-right: 22px;
		background: url(/img/icons/bullet_go.png) right center no-repeat;
		}
	
	#recipe-list .recipe-brief {
		font-size: 11px;
		line-height: 14px;
		}


/***

 Forms

***/

#content .required-label {
	width: 65%;
	margin: 20px auto 4px auto;
	text-align: right;
	font-size: 11px;
	text-transform: uppercase;
	color: #999;
	font-weight: bold;
	}


#page-contact form {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background: #f9f9f9;
	padding: 5px 30px;
	width: 60%;
	margin: 4px auto 30px auto;
	}

form input, textarea {
	font-size: 16px;
	}

form select {
	font-size: 16px;
	}
	
form label {
	font-weight: bold;
	font-size: 12px;
	}


form .text {
	width: 70%;
	}

form textarea {
	width: 100%;
	}

form .button {
	font-size: 1.3em;
	}

form .contacterror {
	border: 2px solid #f00;
	}

.message {
	padding: 0 20px;
	background: #f3feee;
	border-top: 1px solid #9c9;
	border-bottom: 1px solid #9c9;
	margin-top: 20px;
	color: #030;
	}

/***

 Images

***/

img.center {
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	}

img.right {
	float: right;
	margin: 0 0 10px 20px;
	}
	
img.border {
	border: 4px solid #eee;
	padding: 1px;
	}

a:hover img.border {
	border: 4px solid #0068b3;
	}
	
	
#content hr {
	margin-top: 2em;
	margin-bottom: 1.5em;
	}