/*General Heading and Content Styles
*/
body { color: #202b44; font: 16px/16px Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; text-align: left; background-color: #f7f7d4; text-align: center; }
#main { text-align: center; margin-left: auto; margin-right: auto; }
p.Empasis { font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; font-size:12pt; color:#20598d; font-weight:bold; }
p.MainHeader { font-size:24pt; color:#34466e; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight:bold; font-variant: small-caps; line-height: 26pt; }
p.MinorHeader { font-size:18pt; color:#34466e; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight:bold; font-variant: small-caps; line-height: 22px; }
p.HeaderNote { font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-size:14pt; color:#34466e; font-weight:normal; font-style: italic; }

#eventtab a, #eventab a:visted
{
	color: #ffffff;
	text-decoration: none;
}
#eventtab a:hover
{
	text-decoration: underline !important;
	color: #006600 !important;
}

/* This style is specific for the C-Blend image. */
#ctable
{
	margin-top: 26pt;
}
/*Product Verbage Link Styles

The product verbage link styles are essentially the same as the styles used on the "Come Get Some" link. The principles applied are the same, the only difference being some of the properties used, such as width, and height. These are used on the products page to link to various anchor points.*/
td.product { background-color:#faf0aa; border:2px solid; border-color: #20598d; color: #000000; width:250px; height: 50px; text-align:center; font-weight: bold; right:10px; position:relative; }
td.productselected { background-color:#c7d5e2; border: 2px solid; border-color: #20598d; color: #20598d; width:250px; height: 50px; text-align:center; font-weight: bold; right:10px; position:relative; }

td.sproduct { background-color:#faf0aa; border:2px solid; border-color: #20598d; color: #000000; width: 200px; height: 30px; text-align:center; font-weight: bold; font-size:10pt; font-family:Geneva,Arial,Helvetica,sans-serif; }
td.sproductselected { background-color:#c7d5e2; border: 2px solid; border-color: #20598d; color: #20598d; width: 200px; height: 30px; text-align:center; font-weight:bold; font-size:10pt; font-family:Geneva,Arial,Helvetica,sans-serif; }

td.top { background-color:#faf0aa; border:2px solid; border-color: #20598d; color: #000000; width: 250px; height: 25px; text-align:center; font-weight: bold; font-size:10pt;}
td.topsel { background-color:#c7d5e2; border: 2px solid; border-color: #20598d; color: #20598d; width: 250px; height: 25px; text-align:center; font-weight: bold; font-size:10pt;}
/*Form Field Styles

The following styles deal specifically with <form> elements. The input class-type deals with an <input> tag, the textarea class-type deals with a <textarea></textarea> tag, and the td class-type is used to lay out our form submit buttons. The basic syntax for using these styles is the same as for the table syntax I described above. The only difference would be to substitute the correct element for the correct class-type. For example, an input class-type may ONLY be used with an <input> tag. This rule is the same for all Cascading Style Sheets.*/
input.text { width:250px; }
input.warning { background-color:#588dfd; width:250px; font-weight:bold; }
textarea.text { width:250px; }
textarea.warning { background-color:#588dfd; width:250px; font-weight:bold; }
td.button { position:relative; }
select.text { width:250px; }
select.warning { background-color:#6386c4; width:250px; font-weight:bold; }
/* This is the CSS stuff that makes the menus work */
		
			/* ================================================================ 
			This copyright notice must be untouched at all times.
			
			The original version of this stylesheet and the associated (x)html
			is available at http://www.cssplay.co.uk/menus/simple_vertical.html
			Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
			This stylesheet and the associated (x)html may be modified in any 
			way to fit your requirements.
			=================================================================== */
			
			/* Get rid of the margin, padding and bullets in the unordered lists */
			#pmenu, #pmenu ul
			{
				padding:0;
				margin:0;
				list-style-type: none;
				z-index: 500;
			}
			
			/* Set up the link size, color and borders */
			#pmenu a, #pmenu a:visited
			{ font-size: small; display:block; width:135px; font-size:14px; color:green; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; font-weight: 600; height:20px; line-height:24px; text-decoration:none; text-indent:5px; border-color: #000; border-style: solid; border-width:1px 0 1px 1px; }
			
			#pmenu li li a, #pmenu li li a:visited
			{ font-size: small; font-weight:600; display:block; width:250px; font-size:14px; color:green; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; height:20px; line-height:24px; text-decoration:none; text-indent:5px; border-color: #000; border-style: solid; border-width:1px 0 1px 1px; }
			
			#pmenu li li a:hover
			{ color:#ffffff; font-family: Helvetica, Geneva, Arial, SunSans-Regular, sans-serif; }
			
			/* Set up the sub level borders */
			#pmenu li ul li a, #pmenu li ul li a:visited
			{
				border-width:0 1px 1px 1px;
			}
			#pmenu li a.enclose, #pmenu li a.enclose:visited
			{
				border-width:1px;
			}
			
			/* Set up the list items */
			#pmenu li
			{ background: #ffc; float:left; }
			
			/* For Non-IE browsers and IE7 */
			#pmenu li:hover
			{
				position:relative;
			}
			
			/* Make the hovered list color persist */
			#pmenu li:hover > a
			{
				background:#20598d;
				color:#ffffff;
			}
			
			/* Set up the sublevel lists with a position absolute for flyouts and overrun padding. The transparent gif is for IE to work */
			#pmenu li ul
			{
				display:none;
			}
			
			/* For Non-IE and IE7 make the sublevels visible on list hover. This is all it needs */
			#pmenu li:hover > ul
			{
				display:block;
				position:absolute;
				top:-11px;
				left:80px;
				padding:10px 30px 30px 30px;
				/*background:transparent url(../../../../../../../Webdev/Celebration%20Herbals/CelHeb/web-content/images/spacer.gif);*/
				width:120px;
			}
			
			/* Position the first sub level beneath the top level liinks */
			#pmenu > li:hover > ul
			{ top:16px; left: -30px; }
			
			/* get rid of the table */
			#pmenu table
			{
				position:absolute;
				border-collapse:collapse;
				top:0;
				left:0;
				z-index:400;
				font-size:1em;
			}
			
			/* For IE5.5 and IE6 give the hovered links a position relative and a change of background and foreground color. This is needed to trigger IE to show the sub levels */
			* html #pmenu li a:hover
			{
				position:relative;
				background:#20598d;
				color:#ffffff;
			}
			
			/* For accessibility of the top level menu when tabbing */
			#pmenu li a:active, #pmenu li a:focus
			{
				background:#20598d;
				color:#ffffff;
			}
			
			/* Set up the pointers for the sub level indication */
			#pmenu li.fly
			{
				background:#ffc;
			}
			#pmenu li.drop
			{
				background:#ffc;
			}
			
			
			/* This lot is for IE5.5 and IE6 ONLY and is necessary to make the sublevels appear */
			
			/* change the drop down levels from display:none; to visibility:hidden; */
			* html #pmenu li ul
			{
				visibility:hidden;
				display:block;
				position:absolute;
				top:-11px;
				left:80px;
				padding:10px 30px 30px 30px;
				/*background:transparent url(../../../../../../../Webdev/Celebration%20Herbals/CelHeb/web-content/images/spacer.gif);*/
			}
			
			/* keep the third level+ hidden when you hover on first level link */
			#pmenu li a:hover ul ul
			{
				visibility:hidden;
			}
			
			/* keep the fourth level+ hidden when you hover on second level link */
			#pmenu li a:hover ul a:hover ul ul
			{
				visibility:hidden;
			}
			
			/* keep the fifth level hidden when you hover on third level link */
			#pmenu li a:hover ul a:hover ul a:hover ul ul
			{
				visibility:hidden;
			}
			
			/* keep the sixth level hidden when you hover on fourth level link */
			#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul ul
			{
				visibility:hidden;
			}
			
			/* make the second level visible when hover on first level link and position it */
			#pmenu li a:hover ul
			{
				visibility:visible;
				/*left:-30px;
				top:14px;*/
				left:-30px;
				top:14px;
			}
			
			/* make the third level visible when you hover over second level link and position it and all further levels */
			#pmenu li a:hover ul a:hover ul
			{ 
				visibility:visible;
				top:-11px;
				left:80px;
			}
			
			/* make the fourth level visible when you hover over third level link */
			#pmenu li a:hover ul a:hover ul a:hover ul
			{ 
				visibility:visible;
			}
			
			/* make the fifth level visible when you hover over fourth level link */
			#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul
			{ 
				visibility:visible;
			}
			
			/* make the sixth level visible when you hover over fifth level link */
			#pmenu li a:hover ul a:hover ul a:hover ul a:hover ul a:hover ul
			{ 
				visibility:visible;
			}
			
			/* If you can see the pattern in the above IE5.5 and IE6 style then you can add as many sub levels as you like */