/*	--------------------------------------------------------------------------

	(c) 2004-2005 U.S. Robotics Corporation

	-------------------------------------------------------------------------- */

HR
{
	height:	1px;
	color:	silver;
	align:	left;
}

A:hover
{
	cursor: hand;
	color: red;
}


BODY, TABLE
{
	font-family:	Verdana, Arial, sans-serif;
	font-size:		small;
}

BODY
{
	margin:	0 0 0.5em;
	background-color:	white;
}
DIV#idContent
{
	margin:	0 0.7em;
}

/* Tutorial page */
H2
{
}

H3
{
	padding:				0.4em;
	width:				60%;

	font-size: 			large;
	font-weight:		bold;
	letter-spacing:	1pt;
	border:				1px solid #202080;
	background-color:	#F8F8FF;
}

/*
	UL and LI are only used in the tutorial for the moment.
*/
UL
{
	line-height: 150%;
}

LI
{
	margin-left: -1.5em;
}



/* ----------------------------------------------

	CUSTOM CLASSES

*/

.clsNote
{
	font-family: Verdana, Arial, sans-serif;
	font-size: xx-small;
}

.clsHighlight
{
	font-weight:		bold;
	background-color:	#FEFAF2;
	border:				1px solid silver;
	padding:				0 0.2em;
	text-align:			center;
	line-height:		150%;
}


P.clsCopyright
{
	padding-top:	0.5em;
	padding-left:	0.5em;

	border-top:		2px solid #202080;
	font-family:	Verdana, Arial, sans-serif;
	font-size:		xx-small;
	white-space:	nowrap;
	color:			#202080;
}
P.clsCopyright A
{
	color:				#202080;
	text-decoration:	none;
}


/* Notice of no Internet cxn, firmware update, and SecureEZSetup. */
.clsNotice
{
	border:				3px double red;
	padding:				1em;
	margin:				0.5em 0 0.5em 0;
	width:				60%;
	background-color:	#F8F8FF;
}



/* ----------------------------------------------

	Welcome page elements

*/

BODY#idWelcomePage
{
	margin:	0.7em;
}

DIV#idWelcomeBlock
{
	border:	3px solid red;
}

DIV#idWelcomeBlock DIV#idContent
{
	margin:				1em;
	padding-bottom:	4em;
}

DIV#idWelcomeBlock DIV#idContent IMG#idMAX
{
	float:	right;
	margin:	0em;
	border:	0;
}

BODY#idWelcomePage DIV#idBar1
{
	margin:				0;
	background-color:	red;
	padding-left:		1em;
}
BODY#idWelcomePage DIV#idBar1 IMG
{
	padding:	0.5em 0;
}

BODY#idWelcomePage DIV#idBar2 P
{
	margin:		0.5em;
	text-align:	right;
}

BODY#idWelcomePage P.clsCopyright
{
	margin-top:	0.5em;
	color:		black;
	border:		0;
}


/* ----------------------------------------------

	Headers

*/

IMG#idImgHeader
{
	float:			right;
	margin-top:		0.5em;
	margin-right:	0.2em;
	border:			0;
}

/* ----------------------------------------------
	Same for other pages and Setup Wizard 1-2-3 steps
*/

DIV#idHeader, DIV#idSteps
{
	margin-bottom:		0.5em;
	padding:				0.7em 0.5em;

	font-family:		Verdana, Arial, sans-serif;
	font-weight:		bold;
	font-size:			x-large;
	color:				white;
	background-color:	red;
	letter-spacing:	1pt;
}

/* ----------------------------------------------
	For Setup Wizard 1-2-3 steps
*/

DIV#idSteps .clsStepCurrent
{
	background-color:	red;
	border:				2px solid white;
	padding:				0.3em 0.5em 0.3em 0.5em;
}

DIV#idSteps .clsStepDone
{
}

DIV#idSteps .clsStepNotDone
{
	color: silver;
}



/* ----------------------------------------------

	Table elements

*/

/*
	This is close to the same effect as:
		<table cellspacing="5" border="1" frame="void" rules="rows"
			bordercolor="silver" bordercolordark="white" bordercolorlight="silver">
	However, the line has a small gap between each cell on a row.
*/
TABLE.clsRuled TH, TABLE.clsRuled TD
{
	frame: void;
	rules: rows;
	border-bottom: 1px solid silver;
	padding: 0.2em;
}

TABLE.clsRuled TH
{
	font-family: Verdana, Arial, sans-serif;
	font-size: x-small;
	background-color: #F2F2F2;
}

/*
	This underlines only the thead elements.
*/
TABLE.clsTitled TH
{
	border-bottom: 1px solid darkgray;
}

/*
	Used with COLGROUP/COL, this lightly shades a table's column.
*/
.clsColumnShaded
{
	background-color: #F2F2F2;
}

.clsEntry
{
	font-size:	x-small;
}



/* ----------------------------------------------

	Form elements

*/

/*
	Treat neighboring borders as one.
	border-collapse: collapse;
*/

TABLE.clsGroupBox
{
	border:	2px dashed silver;
	padding:	1em;
}

/*
	Cells inside tables with groupboxes have some padding.
*/
TABLE.clsGroupBox TD
{
	padding: 0.4em;
}


SPAN.clsGroupBox
{
	display:	inline-block;
	border:	2px dashed silver;
	margin:	0.3em 0.1em;
	padding:	1em;
}

SPAN.clsGroupBox INPUT.clsTextfield
{
	margin-left:	-0.7em;	/* offset effect of idContent's margin-left -- why? */
}

LABEL
{
}

.clsStatic
{
	font-weight:	bold;
}

.clsRadio
{
}

INPUT, SELECT
{
}

INPUT.clsTextField
{
}

INPUT.clsSmall, SELECT.clsSmall
{
	font-size:	x-small;
}

INPUT.clsBtnSave, INPUT.clsBtnFeature
{
	font-weight:		bold;
	color:				white;
	background-color:	#202080;
}

P.clsSave
{
	border-top:		1px solid #202080;
	padding-top:	0.5em;
}



/*---------------------------------------------------------------------------

	Menu bar styles

*/

DIV#idMenu
{
	margin:				1.4em 0 1em;
	padding-bottom:	0.2em;
	border-bottom:		1px solid #202080;
}

DIV#idMenu A.clsMenuInactive, DIV#idMenu SPAN.clsMenuActive
{
	margin-left:	0.4em;
	padding:			0.2em 0.7em;

	background-color:	#F0F0F0;
	text-align:			center;

	border-top:		2px solid darkgray;
	border-left:	2px solid darkgray;
	border-right:	2px solid darkgray;
}

DIV#idMenu SPAN.clsMenuActive
{
	padding-top:		0.4em;		/* make this tab a little taller than the inactive ones */

	background-color:	white;
	border-top:			4px solid #202080;
	border-left:		4px solid #202080;
	border-right:		4px solid #202080;
	border-bottom:		1px solid white;
	font-weight:		bold;
}

DIV#idMenu A
{
	color:				black;
	text-decoration:	none;
}

DIV#idMenu A:hover
{
	border-top:			2px solid #202080;
	border-left:		2px solid #202080;
	border-right:		2px solid #202080;
	cursor:				hand;
	background-color:	white;
}



/*---------------------------------------------------------------------------

	Help panel styles

*/

DIV#idPanelHelp
{
	float:			right;
	width:			30%;
	margin-left:	0.3em;
	margin-bottom:	0.3em;
	padding:			0.5em 0.3em 1em 1em;

	background-color:	#FEFAF2;
	border:				1px dashed gray;
}

DIV#idPanelHelp H1
{
	font-family:	Verdana, Arial, sans-serif;
	font-size:		small;
}

DIV#idPanelHelp P
{
	font-family:	Georgia, Times New Roman, serif;
}

/*
	For some reason we have to define this distinct from the simple .clsNote.
	(Used on Status page.)
*/
DIV#idPanelHelp .clsNote
{
	font-family:	Verdana, Arial, sans-serif;
}

DIV#idHelpOpen, DIV#idHelpClose
{
	float: right;

	font-family:		Verdana, Arial, sans-serif;
	font-size:			x-small;
	font-weight:		bold;
	color:				white;
	background-color:	#202080;
	text-transform:	uppercase;

	border:				2px outset silver;
	padding:				0.3em;
	text-align:			center;
	width:				1.2em;

	cursor: hand;
}

DIV#idHelpOpen
{
	margin:		0.3em;
	font-size:	small;
}

