/* CSS Document */

/* these declarations produce the active button state of each page */   
body#home a#home,
body#hwo a#hwo,
body#cs a#cs,
body#solution a#solution,
body#res a#res,
body#cont a#cont

{ 
color: #fff; 
background: url(../images/BKG_mainnav_active.gif) repeat-x #000000; 
height: 1.6em 
}

body 
{
background-color: #000000;
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
color: #000;
}

a { color: #990000; font-weight: bold; }
a:hover { text-decoration: none; color: #990000; font-weight: bold; }

h1 
{ 
width: 540px; 
font-size: 2.4em;
line-height: normal;
color: #cd1419;
margin: 0px;
padding: 20px 0 0 0;
}

h2 
{
width: 540px; 
font-size: 1.6em; 
color: #000000; 
margin-left: 0; 
padding: 0; 
}

h3 
{
width: 540px; 
font-size: 1.6em; 
color: #cb171a; 
margin: 0px; 
padding: 16px 0 10px 0; 
}

h4 
{ 
font-size: 0.9em; 
background-color: #b7b7b7;
background-image:url(../images/BKG_h4.gif);
background-position: top right;
background-repeat: no-repeat;
text-align: center;
color: #ffffff; 
margin: 0px; 
padding: 6px 0px 0px 0px; 
width: 200px; 
height: 2.4em 
}

h5 
{ 
font-size: 14px; 
color: #000; 
margin: 0px; 
padding: 6px 0px 6px 0px; 
}

h6 
{ 
font-size: 18px; 
color: #990000; 
margin: 0px; 
padding: 6px 0px 0px 0px; 
}

#container		
{
margin: 0;
padding: 0 0 0 195px;
width: 805px;
background-color: #fff;
}

.style1 
{
color: #990000;
font-weight: bold;
}

.style2 
{
font-size: 12px;
color: #fff;
}
	
#header 
{
background-color: #fff;
height: 150px; 
width: 805px; 
margin: 0; 
padding: 0; 
}

/* width = 805px - left padding */
#content
{
background: url(../images/BKG_content.gif) #fff;
background-repeat: repeat-y;
width: 805px;
padding-top: 0;
padding-bottom: 2em;
margin: 0;
font-size: 11px;	
}

#content table
{
font-size: 12px;
}

* html content { float: left; } /*style for IE*/


#content p 
{ 
width: 540px; 
margin: 8px 0 0 0; 
padding: 0 0 14px 0;
font-size: 12px;
}

.end 
{ 
width: 540px; 
margin: 0; 
padding: 0 0 14px 0;
border-bottom: 1px solid #ccc;
}

.text 
{ 
width: 280px; 
margin: 0; 
padding: 0;
}

#col
{
display: block;
float: right;
width: 200px;
padding:  0;
margin: 0;
background: url(../images/BKG_box.gif) #eee;
font-size: 11px;
}

/* height + top + bottom padding must add up to 25px */
#col h2
{
display: block;
width: 200px;
font-size: 14px;
font-weight: bold;
color: #fff;
background-image:url(../images/BKG_h4.gif);
background-repeat: no-repeat;
background-position: top right;
background-color: #b7b7b7;
height: 19px;
margin: 0;
padding: 4px 0 2px 0;
text-align: center;
}

/* width = -left and -right padding, initial width is 200px */
#col p
{
font-size: 12px;
width: 184px;
margin: 0;
padding: 8px 8px 0 8px;
border: 0;
}

#casestudy 
    {
	background: url(../images/BKG_case_study.gif);
	margin: 0 38px 10px 20px; 
	padding: 0 0 14px 0
	}
#casestudy img
    {
	border: 1px solid #999;
	margin: 6px 10px 0 0; 
	padding: 0
	}
#casestudy p
    {
	width: 520px;
	margin: 0 0 0 6px; 
	padding: 10px 0 6px 10px;
	font-size: 12px;
	}

#cs2 
    {
	text-align: left;
	} /* IE centering method */ 
#cs2 div 
    { 
	background: url(../images/BKG_case_study.gif);
    width: 540px; 
    text-align:centre; /* or left */ 
    margin-left: 30px
    }
#cs2 span 
    { 
    display: table-cell; 
    display: inline-block; 
    width: 100px;
	margin: 10px 10px 0 10px;
    vertical-align: top;  
    margin-right: -4px; /* to compensate for IE/Opera's Whitespace */ 
	padding-bottom: 10px;
}
#cs2 span a
    {
	text-decoration: none;
	color: #990000;
}
#cs2 h2 { font-size: 1.2 em; }
#cs2 span a:hover
    {
	text-decoration: underline;
	color: #990000;
} 


#ingredients 
    {
	text-align: left;
	} /* IE centering method */ 
#ingredients div 
    { 
	background: url(../images/BKG_case_study.gif);
    width: 540px; 
    text-align:centre; /* or left */ 
    margin-left: 28px
    }
#ingredients span 
    { 
    display: table-cell; 
    display: inline-block; 
    width: 100px;
	margin: 10px 10px 0 10px;
    vertical-align: top;  
    margin-right: -4px; /* to compensate for IE/Opera's Whitespace */ 
	padding-bottom: 10px;
}
#ingredients span a
    {
	text-decoration: none;
	color: #990000;
}
#ingredients h2 { font-size: 1.2 em; }
#ingredients span a:hover
    {
	text-decoration: underline;
	color: #990000;
} 
#footer
{
height: 2.6em;
clear: both;
background: url(../images/BKG_footer.gif) no-repeat #000;
padding: 0em;
text-align: left
}

#footer p
{
margin: 0;
padding: 4px 0 0 10px;
font-weight: bold;
font-size: 12px;
}

#footer a { color: #000000; font-weight: bold; text-decoration:none }
#footer a:hover { text-decoration:underline; color: #000000; font-weight: bold; }