/* $RCSfile: style.css,v $
 * $Revision: 1.3 $ $Date: 2005/11/29 23:29:33 $
 * Auth: Dave Loffredo (loffredo@steptools.com)
 * 
 * Copyright (c) 1991-2007 by STEP Tools Inc. 
 * All Rights Reserved.
 * 
 */
 
/* in css dot (.) applies to a class=foo
 * in css hash (#) applies to a id=foo
 * 
 * class=main: Use this for the main content on a page.  In a single
 * 	column flow, mark the content with a DIV tag.  For two column
 *	flows, add a table and mark one TD with this class.
 *
 * class=code: Use with a SPAN for keywords and other code examples in 
 *	text.  For standalone blocks of code, use with a PRE.  We do not
 *	use with a DIV because PRE strips out the leading newline making
 *	the code example look like we expect.  With divs, we would have
 *	to put it on the starting line of the example to avoid extra
 *	whitespace, which is annoying to author.
 */

BODY {
	background: white;
	margin: 10px;
}

/* Use the default browser color, but flash the underline and color */
A:link    { text-decoration: underline; }
A:visited { text-decoration: underline; }
A:hover   { color: #FF0000; text-decoration: none; }


H1,H2,H3 { 
	font-family: helvetica, arial, sans-serif; 
}

/* add a rule separator */
.rule { border-bottom:1px solid black; padding-bottom:0.2em; }
H1.rule { color:#cc0000; }
H2.rule { color:#cc0000; width:75% }
H3.rule { color:#cc0000; width:75% }


/* Use for main content in a single column flow */
DIV.main {
	margin-left: 5%; 
	margin-right:5%; 
	padding: 0.5em; 
}

/* Use for sidebar */
DIV.sidebar {
	width:30%;
	float: right;
	margin: 1em; 
 	padding: 0.5em;
	background:#efefef; 
	border: solid 1px black;
}


DIV.figure {
	text-align:center; 
	padding-top: 1em;
	padding-bottom: 1em;
}

/* Use for single column flow content that you want to stand out */
DIV.box {
	margin-left: 10%; 
	margin-right:10%; 
	padding: 0.5em; 
	background:#efefef; 
	border: solid 1px black;
}

DIV.copyright {
	font-size: 	70%;
	margin-right: 	20%;
	margin-left: 	20%;
	margin-top: 	2em;
	margin-bottom: 	1em;
	padding: 	0.5em;
	text-align: 	center;
	border-top: 	1px solid #000000;
	clear: both; /* avoid interference with floats */
}


/* ============================================================
 * TABLES - We used to define global styles for TABLE and TD, but this
 * disables any cellspacing or cellpadding attributes. Undesireable if
 * we simply add our header to an existing table.
 */
TABLE.format { vertical-align: top; border: none; border-collapse: collapse; } 
TABLE.format TD	{ vertical-align: top; margin: 0px; padding: 0px; }

/* For normal text tables, as opposed to ones used for  formatting. 
 * The auto margins will center tables on Moz and opera, but we force
 * center in the html tag because IE will not center tables through
 * CSS unless you center the entire body block.  
 *
 * In the manuals we normally give this a width and border but here do not
 */
TABLE.normal { 		margin-top: 1em; margin-bottom: 1em; }
TABLE.normal TD { 	vertical-align: top; margin: 0px; padding: 0.25em; } 
TABLE.normal TH { 	vertical-align: top; margin: 0px; padding: 0.25em; 
			border-bottom: solid 2px black; } 


/* Padding for text multi-column flow */
TABLE.textcolumn    { width: 100%; border-collapse: collapse; } 
TABLE.textcolumn TD { vertical-align: top; margin: 0px; padding: 1em; }


/* For the main body in a two column flow content. */ 
TD.main {
	width: 70%; 
	vertical-align: top; 
	padding-top: 0.5ex    !important; 
	padding-left: 1.5em   !important; 
	padding-right: 1.5em  !important; 
}

/* For the display box in a two column flow */
TD.box { 
	width: 30%;
	vertical-align: top; 
	border: solid 1px black; 
	background: #efefef; 
	padding-top: 0.5ex; 
	padding-left: 0.5em; 
	padding-right: 0.5em; 
}

TD.box H2 { 
	font-size: 120%; 
	text-align: center;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	border-bottom: groove thin;
	background: #e0e0e0;
	white-space: nowrap

}

/* TD.box DL { font-size: 80%; } */

TD.box DT { 	
	font-weight: bold; 
	/*
	display: list-item; 
	list-style-type: disc;
	list-style-position: inside;
	*/
}

TD.box DD { 
	font-size: 80%; 
	margin-left: 2em; 
	margin-bottom: 2ex;
}


/* ============================================================
 * SITE BANNER -- With the logo and search box.  We set the size of
 * the logo cell and disable borders on image links to keep the source
 * simple.
 */
TABLE.sitehead 		{ width: 100%; border-collapse: collapse; }
TABLE.sitehead IMG 	{ border: none; }
TABLE.sitehead TD.sitelogo {
	vertical-align: bottom;
	padding: 0; margin: 0;
} 

TABLE.sitehead TD.sitesearch { 
	text-align: right;
} 

TABLE.sitehead TD#logo {
	vertical-align: bottom;
	padding: 0; margin: 0;
} 

TABLE.sitehead TD#search { 
	text-align: right;
} 

TABLE.sitehead INPUT, 
TABLE.sitehead SELECT {
	font-size: 11px;
}


/* ============================================================
 * SITE NAVIGATION SIDEBAR -- for front page multicolumn flow.
 */
TD.sitenav { 
	width: 10%;
	border-left: solid 1px black; 
	padding-top: 0.5em    !important; 
	padding-left: 0.5em   !important;
	padding-right: 0.5em  !important; 
}

TD.sitenav H2 { 
	font-size: 90%; 
	text-align: center;
	padding: 0.2em;
	border-bottom: 1px solid black;
	border-top: 1px solid black;
	background: #e0e0e0;
	white-space: nowrap

}

TD.sitenav A { 
	font-size: 80%; 
	display: block;  /* put them on separate lines */
	white-space: nowrap
} 


DIV.siteprod { 
	text-align: center;
	padding-top: 0.5em    !important; 
	padding-left: 2em   !important; 
	padding-right: 2em  !important; 
}



/* ============================================================
 * SITE NAVIGATION TOPBAR -- for top bar on all pages
 */
DIV.sitenavtop {
	text-align: right; 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 9pt; 
	padding: 1px 3px 1px 3px;
	background: black; 
	color: white; 
}

/* Use the default browser color, but flash the underline and color */
.sitenavtop A:link    { color: #FFFFFF; text-decoration: none; }
.sitenavtop A:visited { color: #DDDDDD; text-decoration: none; }
.sitenavtop A:hover   { color: #FF0000; text-decoration: underline; }

/* ============================================================
 * SITE LOCATION -- Used to indicate location within the site
 */
DIV.siteloc {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 9pt; 
	padding: 0.2em;
	margin-bottom: 2em;
	background: #eeeeee;
}


/* ============================================================
 * TAB LISTS -- For testing
 */
#tabmenu {
	color: black;
	border-bottom: 1px solid black;
	margin: 0px;
	margin-bottom: 0.5em;
	padding: 0px;
	padding-left: 0.5em;
	padding-right: 0.5em;
	white-space: nowrap; 
	text-align: right; 
	z-index: 1;
}

#tabmenu li { 
	display: inline; 
	overflow: hidden;
	list-style-type: none; 
	margin: 0.1em;
}

#tabmenu a, #tabmenu a.active {
	color: black;
	background: #dfdfdf;
	border: 1px solid black;
	padding: 1px 5px 0px 5px;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold; 
	/* font-size: 90%; */
	font-size: 9pt;
	text-decoration: none; 
	vertical-align: bottom;
}

#tabmenu a:visited 	{ color: black; }
#tabmenu a:hover 	{ color: white; background: #7f7f7f; }

#tabmenu a.active 	{ background: white; border-bottom: 1px solid white; }
#tabmenu a.active:hover { color: black; background: white; }


TABLE.tabmenu { 
	border: none; 
	border-collapse: collapse; 
	margin-bottom: 1em;
} 
TABLE.tabmenu TD { 
	vertical-align: bottom; 
	margin: 0px; 
	padding: 0px; 
}
TABLE.tabmenu TD.notab { border-bottom: 1px solid black; }
TABLE.tabmenu TD.notab H1,
TABLE.tabmenu TD.notab H2,
TABLE.tabmenu TD.notab H3 { margin-bottom: 0.1em; }
TABLE.tabmenu #tabmenu { margin-bottom: 0; margin-top: 2px; }

/*
#content {
	background: white;
	padding: 20px;
	border-top: none;
	z-index: 2;	
}
*/

/* ============================================================
 * HOME PAGE STYLES - Used primarily by for formatting the home page.
 * These assume that the default styles in style.css are present too.
 */
/* NEWS POSTS FOR THE FRONT PAGE */
DIV.news {
	text-align: center; 
	padding-top: 1em;
	margin: 1em 3em 1em 3em;
	border-top: 1px solid black;
}
DIV.news H2 {
	font-size: 120%; 
	font-weight: bold; 
	color: #CC0000; 
}



/* ============================================================
 * PARAGRAPH AND FONT STYLES - Used primarily by the reference manuals
 * generated from Framemaker, but available for other pages as well.
 */
SPAN.keyword {
	font-weight: bold;
}

SPAN.code {
	font-size: 95%;
	font-weight: bold;
 	font-family: monospace;
}

PRE.code {
	margin-left: 5%; 
	margin-right:5%; 
	padding: 0.5em; 
	background:#efefef; 
	border: solid 1px black;
}

/* Turn off the fancy backgrounds when used in tables */
TD PRE.code, TH PRE.code { 
	background: none; 
	border: none;
	margin: 0; 
	padding: 0; 
}

/* In the printed manuals, we use an alert icon, here we just use red
 * bars on each side.  There may be better ways to make it stand out.
 */
P.alert {
	border-left: solid 3px red; 
	border-right: solid 3px red; 
	padding-left: 0.5em;
	padding-right: 0.5em;
}


/* Used to emphasise a quote or other statement */
DIV.redcaps {
	font-weight: bold; 
	font-variant: small-caps; 
	color: red;
}