/* Arraid, Inc. Web Site
Stylesheet for the navigation system for the main part of the web site.

Web Site Version 03
Modification History
Date        By              Modification
********************************************************************************************
11/01/2004  Tom Swales		See previous web site version for earlier modification notes.
            SitesByTom, LLC  
11/01/2004	Tom Swales		Convert to ColdFusion.  Implement expandable, drop down menus.
01/03/2005	Tom Swales		Changed drop menu class to fixed width and created three sizes.
*/

/* This class provides the background for the Arraid logo. Full screen width in teal. */
.logoBar {
	background-color: #009999;
	position: static;
	height: 50px;
	width: 100%;
	margin: 0px;
	padding: 0px;
	border-top: 0px solid #CE6300;
	border-right: 0px solid #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 0px solid #CE6300;
}

/* This class sets the appearance of the horizontal nav bar.  The border and padding values must be the same in order
  for the border to show around  the nav bar selections. */
.navMenuBar {
	display: block;
	position: static;
	visibility: visible;
	background-color: #EBFFFF;
	margin-bottom: 10px;
	border-top: 0px solid #CE6300;
	border-right: 0px none #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 0px none #CE6300;
	padding-top: 2px;
	padding-bottom: 2px;
}

/* The next three classes control the appearance of selections in the horizontal nav bar.
  Off is the normal appearance, on is used when the mouse is over the selection and Active when the selection is clicked. */
.navBarSelOff {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #006666;
	font-weight: bold;
	background-color: #EBFFFF;
	padding: 2px 10px;
	cursor: pointer;
	margin: 0px;
	visibility: inherit;
	display: inline;
}
.navBarSelOn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #CE6300;
	font-weight: bold;
	background-color: #EBFFFF;
	padding: 2px 10px;
	cursor: pointer;
	margin: 0px;
	visibility: inherit;
	display: inline;
}
.navBarSelActive {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #EBFFFF;
	font-weight: bold;
	padding: 2px 9px;
	cursor: pointer;
	margin: 0px;
	background-color: #009999;
	border-top: 1px none #CE6300;
	border-right: 1px solid #CE6300;
	border-bottom: 1px none #CE6300;
	border-left: 1px solid #CE6300;
	visibility: inherit;
	display: inline;
}

/* These classes define the drop menu.  The classes define the container that holds the menu selections.
  There are three widths available.  Height is determined by the content.
  By controlling the container you turn everything visible or hidden at once. */
.navMenuDrop200 {
	background-color: #EBFFFF;
	top: 60px;
	left: 0;
	width: 200px;
	height: auto;
	margin: 0;
	padding: 2px;
	visibility: hidden;
	position: absolute;
	z-index: 1000;
	border-top: 0px solid #CE6300;
	border-right: 2px solid #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 2px solid #CE6300;
}
.navMenuDrop250 {
	background-color: #EBFFFF;
	top: 60px;
	left: 0;
	width: 250px;
	height: auto;
	margin: 0;
	padding: 2px;
	visibility: hidden;
	position: absolute;
	z-index: 1000;
	border-top: 0px solid #CE6300;
	border-right: 2px solid #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 2px solid #CE6300;
}
.navMenuDrop350 {
	background-color: #EBFFFF;
	top: 60px;
	left: 0;
	width: 350px;
	height: auto;
	margin: 0;
	padding: 2px;
	visibility: hidden;
	position: absolute;
	z-index: 1000;
	border-top: 0px solid #CE6300;
	border-right: 2px solid #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 2px solid #CE6300;
}
.navMenuDrop400 {
	background-color: #EBFFFF;
	top: 60px;
	left: 0;
	width: 400px;
	height: auto;
	margin: 0;
	padding: 2px;
	visibility: hidden;
	position: absolute;
	z-index: 1000;
	border-top: 0px solid #CE6300;
	border-right: 2px solid #CE6300;
	border-bottom: 2px solid #CE6300;
	border-left: 2px solid #CE6300;
}

/* The next three classes control the appearance of primary selections in the drop menu.
  Off is the normal appearance, on is used when the mouse is over the selection and Active when the selection is clicked. */
.navDropSelOff {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #006666;
	text-align: left;
	font-weight: bold;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 4px 10px 4px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
.navDropSelOn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #CE6300;
	text-align: left;
	font-weight: bold;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 4px 10px 4px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
.navDropSelActive {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #CE6300;
	text-align: left;
	font-weight: bold;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 4px 10px 4px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
/* The next four classes control the appearance of primary selections in the drop menu.
  None is the normal appearance, that is the menu is NOT expanded and this selection is not displayed.
  Off is normal appearance when displayed, On is used when the mouse is over the selection and Active when
  the selection is clicked. */
.navDropExpSelNone {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #006666;
	text-align: left;
	font-weight: normal;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 3px 10px 3px 5px;
	cursor: pointer;
	display: none;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
.navDropExpSelOff {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #006666;
	text-align: left;
	font-weight: bold;
	font-weight: normal;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 3px 10px 3px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
.navDropExpSelOn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
/*	color: #006666; */
	color: #CE6300;
	text-align: left;
	font-weight: normal;
	background-color: #EBFFFF;
	border: 0px none;
	padding: 3px 10px 3px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
.navDropExpSelActive {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 8pt;
	color: #006666;
	text-align: left;
	font-weight: normal;
	background-color: #CBFFFF;
	border: 0px none;
	padding: 3px 10px 3px 5px;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
}
/* This class used to define a separating bar on drop down menus. */
.navDropSeparate {
	text-decoration: none;
	cursor: pointer;
	display: block;
	margin: 0px;
	visibility: inherit;
	z-index: 1000;
	padding-top: 1px;
	padding-bottom: 1px;
	border: 0px none;
	background-color: #CE6300;
}

/* Use this class definition as a template.  The actual popup class definition(s) should be on the cfm page. 
  This class is used to define the appearance of popup 'help' boxes. The width attribute may not be assigned dynamically.
  Using auto allows the text format to control the width regardless of how the browser renders the font. */
.popUpTemplate {
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	color: #006666;
	background-color: #EAEFF8;
	visibility: hidden;
	margin: 0 10px;
	padding: 5px;
	position: absolute;
	border: 1px solid #CE6300;
	width: auto;
	z-index: 500;
}
.footerTotal {
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	visibility: hidden;
	margin-top: 10px;
	margin-right: 6px;
	margin-bottom: 0px;
	margin-left: 6px;
}
.footerInfo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #009999;
	padding: 1px;
	position: static;
	border-right-width: 3px;
	border-left-width: 3px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-top-color: #006666;
	border-right-color: #006666;
	border-bottom-color: #006666;
	border-left-color: #006666;
}
.footerVer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	text-align: left;
	display: inline;
}
.footerRev {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	color: #000000;
	text-align: right;
}