/*          HouseCalls Symptom Checker       *

****************  THREE-TAB version of page STYLES **********************************

The comments here help you understand the class names, and what "containers" they define
(often based on the visible content) in the pages.
The classes below are used in every page, unless otherwise noted */

/********** PAGE AND HEADING **************************************************/

/* defines every page
    Use this to define overall size and font 
    */
.ho3-body    {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	width: 800px;
}

.ho3-newwindow-body	{
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	width: auto;
}

/*  the left side of the heading, contains the main title 
    */
.ho3-tophdg		{
	width: 640px;
	font-size: 24pt;
	color: black; 
	padding:  5px 5px 5px 10px;
	border-bottom: thin solid Gray;
}

/* the right side of the heading, where the "in case of emergency"
    graphic is located.  The "...-sp" class is for the Spanish language graphic 
    */
.ho3-topwarn	{
	width: 120pt;
	height: 75pt;
	background-image:  url(../images/top911warn.gif);
	background-repeat: no-repeat;
}
.ho3-topwarn-sp	{
	width: 130pt;
	height: 75pt;
	background-image:  url(../images/top911warn_sp.gif);
	background-repeat: no-repeat;
}
/* ----- end ----- Page And Heading ------------------------------------------*/

/********** TABS AREA *********************************************************/
/*      HOW TABS ARE DESIGNED
Tabs are built in a 3-celled table containing the 3 tabs.
Each of those cells contain a 2-celled table with the left cell having the
    number graphic for the background image, and the right cell contains the title
    of the tab, such as "Symptom Description".
The scripting of "changing" tabs changes the CLASS of the tab in order to change
    its appearance (open or closed), and also hides/shows the appropriate text
    for that tab.   
IMPORTANT - note that the tab classes are ALSO used for the "END LINKS" at the
    bottom of the content of each tab.  For instance, and the bottom of the
    CONTENT section that appears when tab 2 is open, there are 'links' to
    tabs 1 and 3.  These have an appearance that matches the tabs themselves.
    
To change the appearance of tabs, you might eliminate the borders and colors
    of the cells, and add background images with the tab appearance you want.
    Two different background images for open or closed condition could be 
    attached to each cell (tab).
*/

/* the overall container for the tabs table.  If there are no tabs, this
    container (and accompanying scripting) is omitted. 
    */
.ho3-toptabsdiv {
}
/* the table for the 4 cells (tabs) 
    */
.ho3-toptabstbl {
}

/* The classes defining each tab cell appearance based on whether it is 
    open or closed 
    */

.ho3-toptabs1-opn   {		/* Tab 1 cell - if open */
	width: 175px;
	background-color: #F5F5D2;
	padding: 4px 4px 4px 4px;
	border-top: thin solid Gray;
	border-left: thin solid Gray;
	border-right: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}

.ho3-toptabs1-cls   {		/* Tab 1 cell - if closed */
	width: 175px;
	background-color: #e8e8e8;
	padding: 4px 4px 4px 4px;
	border: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}

.ho3-toptabs2-opn   {		/* Tab 2 cell - if open */
	width: 175px;
	background-color: #F5F5D2;
	padding: 4px 4px 4px 4px;
	border-top: thin solid Gray;
	border-left: thin solid Gray;
	border-right: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}
.ho3-toptabs2-cls   {		/* Tab 2 cell - if closed */
	width: 175px;
	background-color: #e8e8e8;
	padding: 4px 4px 4px 4px;
	border: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}

.ho3-toptabs3-opn   {		/* Tab 3 cell - if open */
	width: 175px;
	background-color: #F5F5D2;
	padding: 4px 4px 4px 4px;
	border-top: thin solid Gray;
	border-left: thin solid Gray;
	border-right: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}
.ho3-toptabs3-cls   {		/* Tab 3 cell - if closed */
	width: 175px;
	background-color: #e8e8e8;
	padding: 4px 4px 4px 4px;
	border: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}

.ho3-toptabs4spacer   {		/*Space over the 4th tab*/
	width: 100px;
}

.ho3-toptabs4-opn   {		/* Tab 4 cell - if open */
	width: 190px;
	background-color: #F5F5D2;
	padding: 4px 4px 4px 4px;
	border-top: thin solid Gray;
	border-left: thin solid Gray;
	border-right: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
}

.ho3-toptabs4-cls   {		/* Tab 4 cell - if closed */
	width: 190px;
	background-color: #e8e8e8;
	padding: 4px 4px 4px 4px;
	border: thin solid Gray;
	-moz-border-top-left-radius: 10px;
	border-top-left-radius: 10px;
	-moz-border-top-right-radius: 10px;
	border-top-right-radius: 10px;
	/* text-align: right; */
}

.ho3-toptab1rt  
{
    width:30px;
}

.ho3-toptab2rt  
{
    width:30px;
}

.ho3-toptab3rt  
{
    width:30px;
}
    

/* the classes defining each tabs NUMBER identifier (left side of tab cell)
    which would likely be a background image.  
    These are based on open/closed condition, because the color or other
    appearance might change based on that condition. */
    
.ho3-toptab1img  {
	border-style: none;
	/* border: none; */
    background:no-repeat;
    display:block;
}
    
.ho3-toptab2img  {
	border-style: none;
	/* border: none; */
    background:no-repeat;
    display:block;
}
    
.ho3-toptab3img  {
	border-style: none;
	/* border: none; */
    background:no-repeat;
    display:block;
}

.ho3-tabnums1-opn	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num1open.gif);
	background-repeat: no-repeat;
}
.ho3-tabnums1-cls	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num1close.gif);
	background-repeat: no-repeat;
}

.ho3-tabnums2-opn	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num2open.gif);
	background-repeat: no-repeat;
}
.ho3-tabnums2-cls	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num2close.gif);
	background-repeat: no-repeat;
}

.ho3-tabnums3-opn	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num3open.gif);
	background-repeat: no-repeat;
}
.ho3-tabnums3-cls	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	display: block;
	background-image: url(../images/num3close.gif);
	background-repeat: no-repeat;
}

/* The tab text (which is in an "anchor" to facilitate the scripting)
    for each tab.
    If you wanted the text to change appearance with the open/closed
    condition, try removing the attribute from here, and adding it to
    the open/closed cell appearance classes above */

.ho3-Atoptabs1  {
	color: black;
	text-decoration: none;
	font-size: 14pt;
}
.ho3-Atoptabs2  {
	color: black;
	text-decoration: none;
	font-size: 14pt;
}
.ho3-Atoptabs3  {
	color: black;
	text-decoration: none;
	font-size: 14pt;
}
.ho3-Atoptabs4  {
	color: black;
	text-decoration: none;
	font-size: 14pt;
}
/* ----- end ----- Tabs Area -------------------------------------------------*/

/********** TAB CONTENT ENCLOSURE *********************************************/
/* 
When one of the 3-tabs are 'open' the content container for that tab is
    open, and the others are closed (by manipulating visibility and 
    display attributes of that item.
    Each tab has specific structure and content, as well.

The top of each content container has a 2-cell table as a 'heading'.
    It contains the identifying tab digit (as a background image) 
    on the left, and the title of the tab on the right.
    
Each tab container is followed by the "End Links" for that open tab.
    These end links are also open and closed as needed, along with the
    tab content.
*/

/* The outside container for all tab content.  This creates a colored 
    "frame" around each of the content pages 
    */    
.ho3-content-div {
	width: 800px;
	background-color: #F5F5D2;
	padding: 20px 20px 20px 10px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/*  These are the three number images in the left side of the table at
    the top of each content area 
    */
.ho3-hdgnums1	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	background-image: url(../images/num1round.gif);
}
.ho3-hdgnums2	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	background-image: url(../images/num2round.gif);
}
.ho3-hdgnums3	{
	border-style: none;
	/* border: none; */
	height: 32px;
	width: 32px;
	background-image: url(../images/num3round.gif);
}

/*======== TAB 1 CONTENT =====================================================*/
/*
    This tab has 3 columns:  thumbnails | content | see more appropriate topic
    Each column is a cell in a 3-cell, 1-row table.
    If any column data does not exist, the column is left empty. */

/* The entire content area (except for end links).
    This is the part that is either open or hidden 
    */
.ho3-content1 {
	background-color: white;
	border: 1px solid Gray;
	padding: 20px 20px 20px 10px;
	visibility: visible;
	display: block;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

.ho3-tab1tbl1 {
	width:485px;
    background-color: White;
    text-align: left;
    vertical-align: top;
	padding: 4px 4px 4px 4px;
}

.ho3-tab1match {
	background-color: #e8e8e8;
    padding: 4px 4px 4px 4px;
	border: thin solid Gray;
	-moz-border-radius: 5px;
	border-radius: 5px;
	height: 40px;
}

.ho3-tab1match-a {
	color: #000;
    font-size: 14pt;
	padding-left:5px;
	text-decoration:none;
}

.ho3-tab1match-clk {
    color: White;
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-size: 12pt;
}

.ho3-tab1FA-clk {
    font-family: Tahoma, Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-size: 12pt;
}

/*New for border on left of cells so that it goes all the day down*/
.ho3-tab1tbl2 {
    background-color: White;
    text-align: left;
    vertical-align: top;
	border-left: thin solid #cccccc;
	padding: 4px 4px 4px 4px;
}

.ho3-tab1tbl2-content {
	padding-left:10px;
}

/* The thumbnails cell (1st column) on the first tab content area
    */
    
.ho3-tab1thumbcell {
    width: 130px;
    padding: 3px;
	vertical-align:top;
}

.ho3-tab1thumbs  {
	background-color: white;
	text-align: center;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 10pt;
	color: #006400;
	padding: 10px 10px 10px 10px;
	vertical-align: top;
	border-right: thin solid #CCCCCC;
}

/* Heading for the thumbnail cell
    */
.ho3-tab1thumbshdg  {
	background-color: #F5F5D2;
	color: black;
	text-align: center;
	font-size: 12pt;
	margin: 0px 4px 4px 10px;
	padding-top:3px;
	padding-bottom:3px;
	border:thin solid gray;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/* Thumbnail images
    */
.ho3-tab1thumbimg {
	margin-left:8px;
    vertical-align: top;
    text-align: center;
}

/* Title of each thumbnail
    */
.ho3-tab1thumbtitle {
	font-size:10pt;
}

/* styles for First Aid windows */

.ho3-FAfileHdg {
    text-align: center;
    font-size: 14pt;
}

.ho3-FAfileText {
    text-align: right;
    font-size: 10pt;
}

/* The content cell (2nd column) on the first tab content area
    */
.ho3-tab1content { 
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background-color: white; 
    vertical-align: top;
}

/* The SMAT (see more appropriate topic) content cell (3rd column) on the 
    first tab content area
    */
.ho3-tab1smat    {
	/* width: 200px; */
	background-color: white;
	vertical-align: top;
	padding: 15px 0px 10px 12px;
}

.ho3-tab1smat .ho3-ul{
	padding-left:28px;
}

/*========= TAB 2 CONTENT ====================================================*/
/* This tab has a single content area, and uses images to mark text sections
    pertaining to "When to Call" decisions */
    
/* The entire content area (except for end links).
    This is the part that is either open or hidden 
    */
.ho3-content2 {
	background-color: white;
	border: 1px solid Gray;
	padding: 20px 20px 20px 20px;
	visibility: hidden;
	display: none;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/* These are the classes of the images used to mark the different types
    of decision text areas
    */
    
.ho3-call911mark	{
	width: 36px;
	height: 36px;
	background-image: url(../images/redexclaimphone1.gif);
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}
.ho3-callnowmark	{
	width: 36px;
	height: 36px;
	background-image: url(../images/redphone1.gif);
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}
.ho3-call24hrmark	{
	width: 36px;
	height: 36px;
	background-image: url(../images/yellowphone1.gif);
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}
.ho3-callweekdaymark	{
	width: 44px;
	height: 44px;
	background-image: url(../images/greenphone1.gif);
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}
.ho3-homecaremark	{
	width: 36px;
	height: 36px;
	background-image: url(../images/homecare1.gif);
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}

/* These are the text headings for the same decision text areas as above
    Defined here to change colors, etc.
    */
.ho3-h3-dcall911 {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: #ff0000;
 }
.ho3-h3-dcallnow {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: #ff0000;
 }
.ho3-h3-dcall24hr {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: #000000;
 }
.ho3-h3-dcallweekday {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: #000000;
 }
.ho3-h3-dhomecare {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: #339900;
 }

/*========= TAB 3 CONTENT ====================================================*/
    
/* The entire content area (except for end links).
    This is the part that is either open or hidden 
    */
.ho3-content3 {
	background-color: white;
	border: 1px solid Gray;
	padding: 20px 20px 20px 20px;
	visibility: hidden;
	display: none;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/*========= TAB 4 CONTENT ====================================================*/
    
/* The entire content area (except for end links).
    This is the part that is either open or hidden 
    */
.ho3-content4 {
	background-color: white;
	border: 1px solid Gray;
	padding: 20px 20px 20px 20px;
	visibility: hidden;
	display: none;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/*========= END LINKS ========================================================*/
/*
Each tab content area is followed by links to the other (closed) tabs
These use the same classes as the tabs at the top of the page */

/* The tables that hold the three end links on the three open content areas
    */

.ho3-endlinks1	{
	background-color: #F5F5D2;
	visibility: visible;
	display: block;
}
.ho3-endlinks2	{
	background-color: #F5F5D2;
	visibility: hidden;
	display: none;
}
.ho3-endlinks3	{
	background-color: #F5F5D2;
	visibility: hidden;
	display: none;
}
.ho3-endlinks4	{
	background-color: #F5F5D2;
	visibility: hidden;
	display: none;
}

/* ----- end ----- Content Enclosures ----------------------------------------*/

/********** NON-TABBED PAGES **************************************************/

/* for non-tabbed (supplemental) pages - where there is a single container of 
    information, (no tabs) such as index_anatomic, instructions, drug-dosing 
    tables, etc. This table contains the page text, inside of the colored "frame" 
    */
.ho3-toc     {
    width:600px;
	padding: 8px 8px 8px 8px;
	margin: 4px 0px 0px 4px;
}

/* The main content cell in the above table on the supplemental page
    */
.ho3-idxcontent { 
	font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
	background-color: white; 
    vertical-align: top;
}

/* ----- end ----- Non-Tabbed Pages ------------------------------------------*/

/********** INDEX PAGE FORMATTING *********************************************/
/* 
The anatomical_index page requires special formatting.
It is built of two tables, the top-level is the 2-column 1-row table
    containing links to the groups of pages on the left, and links to 
    supplemental pages on the right.
The lower-level table is the 2-column many-row table containing the group
    name (and 'back to top') on the left, and the links to pages in that
    group on the right. */
   
/* The 2-cell table that creates the 2-column top-level index of groups and
    supplemental pages.
    */
.ho3-idxtbl {
	font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 4px 4px 4px 4px;
	margin: 4px 0px 0px 4px;
	width: 700px;
}

/* The left-hand column of the top-level table - this is a single cell containing 
    links to the group names in the lower-level table
    */
.ho3-idxtd {
	vertical-align: top;
	padding: 4px 4px 4px 4px;
}

/* The group item links on the left side of the top-level table
    The "..-h4Top" is a span covering the entire list of anchors.
    The "..-h4TopOut" or "....Over" are classes on the anchor itself.
    These allow us to do 'rollover' effects on the test through scripting.
    */
.ho3-h4Top {
	font-size: 12pt;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-style: normal;
	margin: 10px 0px 2px 0px;
}
.ho3-h4TopOut {
    text-decoration: none;
}
.ho3-h4TopOver {
    text-decoration: underline;
}

/* The right-hand column of the top-level table - this is a single cell containing
    links to the supplemental pages
    */
.ho3-supcell {
    text-align: center;
	vertical-align:top; 
	border-left:solid 1pt #999999; 
}

/* The sub-headings of types of supplemental pages in the right-side of the
    top-level table
    */
.ho3-supsub { 
	margin-top:10pt; 
	margin-bottom:4pt; 
	color:#444444; 
}

/* The supplemental item links on the right side of the top-level table
    The "..-supitem" is a division holding the individual link (anchor)
    The "..-supitemOut" or "....Over" are classes on the anchor itself
    These allow us to do 'rollover' effects on the text through scripting
    */
    
.ho3-supitem { 
	margin-left:8pt; 
	margin-bottom:4pt; 
}
.ho3-supitemOut {
    text-decoration: none;
}
.ho3-supitemOver {
    text-decoration: underline;
}

/* The lower-level table that holds the rows of 2-cells: 
    Group name | links to pages in group
    */
.ho3-idxitemtbl {
    width: 700px;
}

/* The left cell in the lower level table - this holds the group name and
    'back to top'
    */
.ho3-idxitemLt {
	font-size: 12pt;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	vertical-align: top;
	padding:  12px 4px 12px 4px;
	border-bottom: solid thin Gray;
}

/* The right cell in the lower level table - this holds the links to pages in
    the group named at the left.
    */
.ho3-idxitemRt {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	vertical-align: top;
	padding:  12px 4px 12px 4px;
	border-bottom: solid thin Gray;
}

/* ----- end ----- Index Page ------------------------------------------------*/

/********** GENERAL STYLE AND FORMATTING **************************************/
/* Use a text editor 'find' function to identify where any of these classes 
are used.  Be cautious, because these may appear just about anywhere.
Remember that when we have content that is defined with typical HTML markup,
we switch it to some of these.

For instance, any <p> tags are switched to <p class="ho3-p">
Any <h1> tag is switched to <span class="ho3-h1">  (note "span", not "h1")
Any <ul> is switched to <ul class="ho3-ul">

*/

.ho3-h20n {
	font: normal 20pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:#535353;
}
.ho3-h18n {
	font: normal 16pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.ho3-h1 {
	font: normal 16pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:#535353;
}
.ho3-h16n {
	font: normal 14pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.ho3-h16 {
	font: normal 16pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.ho3-h2 {
	font: normal 16pt Verdana, Geneva, Arial, Helvetica, sans-serif;
}
.ho3-h3 {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
}
.ho3-h4 {
	font-size: 12pt;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-style: italic;
	margin: 10px 0px 2px 0px;
}
.ho3-h3red {
	font: bold 12pt Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 10px 0px 2px 0px;
	color: red;
}
.ho3-ul {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 4px 0px 0px 22px;
}
.ho3-ol {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 4px 0px 0px 28px;
}
.ho3-bullet {
	margin: 0px 0px 4px 0px;
}
.ho3-table {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 4px 4px 4px 4px;
	margin: 4px 0px 0px 4px;
}
.ho3-center {
	text-align: center;
}
.ho3-right  {
    text-align: right;
}
.ho3-div {
	width: 800px;
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 4px 0px 0px 4px;
}
.ho3-divA {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 6px 0px 0px 4px;
}
.ho3-p {
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 4px 0px 0px 0px;
}
.ho3-psmall {
	font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
	margin: 4px 0px 0px 0px;
}

a {
	text-decoration:none;
}

.ho3-noborder {
    border-style: none;
}

.ho3-valigntop {
    vertical-align: top;
}

/* ----- end ----- General styles and formatting -----------------------------*/

/********** Currently unused - remove in future release ***********************/
.ho3-toctbl     {
    width:600px;
	font: 14px Verdana, Geneva, Arial, Helvetica, sans-serif;
	padding: 8px 8px 8px 8px;
	margin: 4px 0px 0px 4px;
}
.ho3-suptitle {
	font-weight:bold; 
	margin-top:4pt; 
	margin-bottom:4pt; 
	text-align:center; 
	color:#666666; 
}