﻿/* Color pallette Info:  dark Green: #405a4d  med green:#00841d  light green:#b7d1b7  BLUE: #233b8b YELLOW: #f6e206 GRAY:#808080 */
html,body { text-align: center;border: 0; margin: 0; padding: 0; background-color:#E4E9EE }

body {font-family: Verdana, "Trebuchet MS", Arial, sans-serif; color:#000000; font-size: 10pt; text-align: left }

#main
{
margin-left: auto;
margin-right: auto;
width: 760px;
border:solid 2px #000000;
text-align: left;
background-color:#ffffff
}
a, a:visited, a:active
{ color:#233b8b }

a:hover { color:#405afd}

.blackDivider { width:760px; height:1px; background-color:#000000; overflow:hidden }
.greenDividerShort { width:450px; height:2px; background-color:#405a4d; overflow:hidden }
.navComp { display:none}

#footer {clear:both; width:760px; overflow:hidden; }
#footerTopImg {float:none; clear:both; width:760px; height:100px; overflow:hidden}
#ftLogo
{
	float:left;	width:280px; height:90px;
	text-indent: -1000em; background: url(../images/ftLogo.gif) no-repeat top left; line-height:100px;
}
#ftISO
{
	float:left;	width:280px; height:90px;
	text-indent: -1000em; background: url(../images/ftISO9001.gif) no-repeat top left; line-height:100px;
}
#ftPhone
{
	float:left;	width:200px; height:90px;
	text-indent: -1000em; background: url(../images/ftPhone.gif) no-repeat top left; line-height:100px;
}
#footerText {clear:both; font-size:8pt; text-align:center; color:#808080; padding-bottom:8px }

#footer a, #footer a:visited, #footer a:active
{ color:#808080 }

#footer a:hover { color:#405afd}

/* masthead Start */
#mastHead
{float:none; width:760px; height:100px; overflow:hidden}

#mhLogo
{
	float:left;	width:98px; height:100px;
	text-indent: -1000em; background: url(../images/hygenicLogo.gif) no-repeat top left; line-height:100px;
}
#mhTagLine
{	
	float:left;
	width:182px; height:100px;
	text-indent: -1000em; background: url(../images/tagLineText.gif) no-repeat top left; line-height:100px;
}
#mhSaturnRing
{	float:left; width:280px; height:100px}
#mhThreeDots
{	float:left; width:200px; height:100px;background: url(../images/mhThreeDots.gif) no-repeat top left;}

#mhThreeDotsText 
{ margin-top: 40px; color:#405a4d ; font-weight:bold; font-size:13px; text-align:center }
/* masthead end */
/* start general page content */

.contentArea {background-image:url(../images/contentBG.gif); background-repeat:repeat-y; background-position:top left; }

#theContent
{float:left; 
	width:548px; padding:0px 0px 0px 12px;
	w\idth::560px
}

#theContent p.first  {padding: 8px  4px 8px 0px; line-height:1.25em; margin:0; text-align:left; }
#theContent p  {padding:0px 4px 8px 0px; line-height:1.25em; margin:0; text-align:left; }

#hygCirc {float:left; width:240px}
#homeContent {float:left; 
	width:296px; padding:0px 12px 0px 12px;
	w\idth::320px
	}
#rtNavWrapper {float:left; width:200px; background-color:#CC0000 }
#rtNav {text-align:right;padding-right:6px}
#rtNav a {color:rgb(255, 255, 255); font-size:14px ; font-weight:bold; width:180px; padding-right:12px; text-decoration:none; background-image:url(../images/squareWhite.gif); background-repeat:no-repeat; background-position:top right }
#rtNav a:hover {color:rgb(255, 255, 0) ;font-size:14px ; font-weight:bold; font-weight:bold; width:180px; padding-right:12px;  text-decoration:underline ;background-image:url(../images/squareYellow.gif); background-repeat:no-repeat; background-position:top right  }

#rtNav a.here {color:rgb(255, 255, 0); font-size:14px ; font-weight:bold; width:180px; padding-right:12px;  text-decoration:none; background-image:url(../images/squareYellow.gif); background-repeat:no-repeat; background-position:top right }
#rtNav a.here:hover {color:rgb(255, 255, 0) ;font-size:14px ; font-weight:bold; font-weight:bold; width:180px; padding-right:12px;  text-decoration:underline; background-image:url(../images/squareYellow.gif); background-repeat:no-repeat; background-position:top right  }

.rhLink { padding-bottom:6px}

#rtNavWrapper .prodImage { text-align:right;  float:right; width:194px; padding-right:6px; color:#ffffff}
#rtNavWrapper .caption { color:rgb(255, 255, 255)}
#rtNavWrapper p.prodCaption {font-size:8pt; color:rgb(255, 255, 255) ;line-height:1.25em }

#rtNavWrapper .caption a, #rtNavWrapper  .caption a:visited, a:active {color:rgb(255, 255, 255)}
#rtNavWrapper .caption a:hover {color:rgb(255, 255, 0)}

#rtNav h3 {color:#FFFFFF; font-size:14pt; padding: 12px 0 4px 0 ; margin:0; line-height:1em; }
h2.bread
{
	font-size:10pt; color:#233b8b ; font-weight:bold;
	padding:12px 0px 8px 0px; margin:0; text-align:left
}

h2.bread a, h2.bread a:visited, h2.bread a:active { padding-left:8px; padding-right:12px; color:#405a4d; background: url(../images/rightarrowGreen.gif) no-repeat top left; text-decoration:none; }
h2.bread a:hover {padding-left:8px; color:#233b8b; padding-right:12px; background: url(../images/rightarrowBlue.gif) no-repeat top left; text-decoration:underline  }
.breadItem { padding-left:8px; color:#405a4d; background: url(../images/rightarrowGreen.gif) no-repeat top left; text-decoration:none; }

h1, h1.header
{
	font-size:12pt; color:#405a4d ; font-weight:bold;
	padding:4px 0px 6px 0px; margin:0
}
h2, h2.subHead
{	font-size:10pt; color:#00841d ; font-weight:bold;
	padding:0px 0px 6px 0px; margin:0
}

.bread a:hover
{	font-size:10pt; color:#405a4d ; font-weight:bold; text-decoration:underline
}

/* product Images */
.prodImage200
{
	float:right; width:210px; text-align:right
}
p.prodCaption {font-size:8pt; color:#233b8b;line-height:1em }
div.caption {padding-left:20px; padding-right:4px }

/* end general page content */

.yellowBarTop { width:760px; height:28px; background: url(../images/navYellowBarTop.gif) no-repeat top left;}
.greenBarBottom { clear:both; width:760px; height:28px; background: url(../images/bottomGreenBar.gif) no-repeat top left;}

.green { color:#405a4d}
.medGreen{ color:#00841d}
.ltGreen{ color:#b7d1b7}
.blue{ color:#233b8b}
.yellow{ color:#f6e206}
.gray{ color:#808080}

/* FAQs */
ul.faq {list-style-type: none; padding-left: 0; margin-left: 4px;
}

ul.faq li {padding-bottom:8px; }
ul.faq  a {padding-left:10px ; color:#233b8b; padding-bottom:4px; background:#ffffff url(../images/squareWhite.gif) no-repeat top left }
ul.faq  a:hover {padding-left:10px ; color:#00841d;  padding-bottom:4px; background:#DDDDDD url(../images/squareYellow.gif) no-repeat top left }

ul.faq a.faqShow {padding-left:10px ;  padding-bottom:4px;  color:#00841d; font-weight:bold; text-decoration:none ; background:#ffffff url(../images/squareYellow.gif) no-repeat top left}

p#question { padding-left:10px ;  padding-bottom:2px; font-weight:bold;  color:#00841d; text-decoration:underline; background:#ffffff url(../images/squareYellow.gif) no-repeat top left }

/* end FAQ */

/* General useful Classes */
.center {text-align:center}
B, STRONG, .strong { font-weight:bold}
SMALL, .small { font-size:8pt}
img { border-style:none; border-width:0px}
.errorMsg, .errMessage{ color: #993333}
.para{ margin-bottom:0.5em}
.paraDouble{ margin-bottom:1em}
.paraTop, .separatorTop{ margin-top:0.5em}
.hideIt{ display:none}
.showIt{ display:block}
input { font-size:10pt}
input.ichar1{width:18px; font-size:10pt}
input.itiny{width:60px; font-size:10pt}
input.ismall{width:100px; font-size:10pt}
input.imed{width:150px; font-size:10pt}
input.ilarge{width:200px; font-size:10pt}
input.ihuge{width:400px; font-size:10pt}
textarea.ihuge{width:400px; font-size:10pt}
.pix150Left {width:150px; text-align:right; float:left}
select.small { font-size:9pt}
.leftNav {font-size:12pt; color:#385C75}
.clear {clear:both}
.indent { margin-left:12px}
.indentLarge, .indentBig { margin-left:24px}
.indentXLarge, .indentXBig { margin-left:48px}
.px150L {width:150px; float:left; }
.px220L {width:220px; float:left;}
.px250L {width:250px; float:left;}
.clear {clear:both;}