@charset "utf-8";
/* CSS Document */



/* -------------- LAYOUT -------------- */
/* -------------- LAYOUT -------------- */
/* -------------- LAYOUT -------------- */

/* This tells all browsers to forget about their settings and use ours */

* {
margin:0px;
padding:0px;
font-family:Arial, Helvetica, sans-serif;
}

body{
/*text-align:center;*/ /* because ie doesn't always calculate the auto margins correctly */
background-image:url(/images/layout/bodyBG.jpg);
background-repeat:repeat-y;
background-position:center;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}

body p {
font-size:12px; 
font-style:normal;
line-height:16px;
margin-bottom:14px;
}

body p a, body li a {
color:#000;
}

body li {
font-size:12px; 
}

div#main {
position:relative;
margin:0 auto;
width:746px;
}

div#branding {
width:746px;
height:121px;
background-image:url(/images/layout/header.jpg);
background-repeat:no-repeat;
position:relative;
text-decoration:none;
}

div#branding h1{
position:absolute;
text-indent:-9999px;
overflow:hidden;
}

/* -------------- END LAYOUT -------------- */
/* -------------- END LAYOUT -------------- */
/* -------------- END LAYOUT -------------- */


/* -------------- NAV -------------- */
/* -------------- NAV -------------- */
/* -------------- NAV -------------- */

div#branding ul{
position:absolute;
height:0px;
}

div#branding ul li{
list-style:none;
}

div#branding ul li a{
display:block;
overflow:hidden;
text-indent:-9999px;
}

/* ---------------------------------- */

div#branding h1 a#home{
position:relative;
display:block;
top:8px;
left:10px;
width:166px;
height:69px;
}

div#branding li#mpc_btn a{
position:absolute;
top:0px;
left:298px;
width:171px;
height:121px;
}

div#branding li#mpc_btn a:hover {
background-image:url(/images/layout/buttonOver.jpg);
}

/* -------------- END NAV -------------- */
/* -------------- END NAV -------------- */
/* -------------- END NAV -------------- */


/* -------------- CONTENT -------------- */
/* -------------- CONTENT -------------- */
/* -------------- CONTENT -------------- */

div#content {
margin:0 auto;
padding:0px;
width:600px;
position:relative;
}

div#content .methods li, ul.indent, li.indent {
margin:0px 0px 6px 16px; /* Keeps bullets on the outside of the paragraph */
list-style-position:outside; /* Keeps bullets inside the paragraph */
line-height:1.33;
}

div#content ul.indent li {
margin-bottom:15px;
}

div#leftCol {
width:390px;
float:left;
position:relative;
}

div#rightCol {
width:190px;
float:right;
position:relative;
}

div.head {
position:relative;
margin:0;
padding:0;
top:0px;
bottom:0px;
width:420px;
height:auto;
min-height:1px;
}

div.head div { /* We have to float this div left inside the container div (as opposed to putting it on the image itself) as a workaround for IE. IE created a gutter on the left of about 3px */
float:left;
width:143px;
height:auto;
left:0px;
margin:-5px -10px 0px 0px; /*Negative right margin fixes IE problem of floated div reflow*/
}

div.head h2 {
position:relative;
float:right;
width:272px;
text-indent:-9999px;
background-position:-5px 0;
background-repeat:no-repeat;
margin-top:-5px;
}

div.head p {
position:relative;
float:right;
width:272px;
font-size:14px;
line-height:18px; 
font-style:normal;
}

div#content h2.header {
position:relative;
text-indent:-9999px;
overflow:hidden;
margin:0 0 3px 0;
padding:0;
background-position:0 0;
background-repeat:no-repeat;
}

div#content h3 {
position:relative;
text-indent:-9999px;
overflow:hidden;
margin-bottom:3px;
background-position:0 0;
background-repeat:no-repeat;
}

/* End General Content */
/* QUESTIONS, SITE MAP, CONTACT US page styling */

div.questions {
margin-bottom:16px;
}

div.questions p{
margin-bottom:12px;
}

div.sitemap ul {
margin:0 0 0 20px;
padding:0 0 8px 0;
}

div.sitemap ul ul {
padding:0;
}

div.sitemap p {
margin-bottom:15px;
}

div.sitemap p, div.sitemap p a, div.sitemap li a {
color:#660000;
font-weight:bold;
}

div.sitemap ul li ul li a, ul.noHead li a {
color:#000000;
font-size:10px;
}

div.sitemap li {
margin:0 0 4px 0;
list-style-position:inside;
list-style:disc;
}

div.sitemap div.twocolLeft {
border-right-color:#660000;
}

div.contactus hr, div.recipe hr, hr {
margin-bottom:12px;
}

div.contactLeft {
position:relative;
width:150px;
float:left;
}

div.contactRight {
width:250px;
float:right;
}

.contactLeft p, .contactRight p {
margin-bottom:4px;
}

/* ---------- Begin Generic Styling / Fonts -------------- */


.bright_red {
color:#F00;
font-weight:bold;
}


.red_bold, .red_bold a {
color:#600;
font-weight:bold;
}

.lightRed_bold, .lightRed_bold a {
color:#a51526;
font-weight:bold;
}

.large_red_bold, h2 {
font-size:18px; 
font-style:normal;
color:#600;
font-weight:bold;
}

.white, .white a {
color:#FFF;
font-weight:normal;
}

.white_bold, .white_bold a {
color:#FFF;
font-weight:bold;
}

.standard_pine_bold {
	color: #006633;
	font-weight:bold;
}

.standard_bold_gray {
	color:#CCCCCC;
	font-weight:bold;
}

.standard_peachpit_bold {
color:#b64829;
	font-weight:bold;
}

ol {
list-style-position:inside;
}

.note {
margin:0 0 25px 0;
}

.subs {
font-size:10px; 
font-style:normal;
line-height:12px;
}

#content .add_margin {
margin-bottom:8px;
}

#content .add_20margin {
margin-bottom:20px;
}

#content .add_20marginRight {
margin-right:20px;
}

#content .add_15marginTop {
margin-top:15px;
}

.inline {
display:inline;
}

.left50 {
position:relative;
margin-left:50px;
}

.floatLeft {
float:left;
}

.floatRight {
float:right;
}

.floatNone {
float:none;
}

.clear { /* standard practice to have a class or id to automatically clear floats */
clear:both;
}


/* ---------- End Generic Styling -------------- */


/* -------------- END CONTENT -------------- */
/* -------------- END CONTENT -------------- */
/* -------------- END CONTENT -------------- */


/* -------------- FOOTER -------------- */
/* -------------- FOOTER -------------- */
/* -------------- FOOTER -------------- */

div#footer{
	position:relative;
	margin:10px auto;
	padding:27px 0px 35px 0px;
	height:150px;
	width:652px;
	overflow:hidden;
	display:block; /* without this, background-image will not show up */
	background-position:top center;
	background-repeat:no-repeat;
	background-image:url(/images/layout/guarantee.jpg);
}

div#footer h2{
	text-indent:-9999px;
}

div#footer p {
padding:2px 20px 0px 20px;
text-align:left;
color:#000;
font-size:10px;
line-height:15px;
}


div#footer p.copyright {
margin: 25px 0 0 0;
text-align:center;
}

div#footer p.copyright a {
color:#000;
text-decoration:underline;
display:inline;
}

/* -------------- END FOOTER -------------- */
/* -------------- END FOOTER -------------- */
/* -------------- END FOOTER -------------- */