@charset "utf-8";
/**
 * Author: Jean-Philippe Steinmetz
 * Date: 11-26-2007
 * ********************************
 *
 * CSS is broken up into two different types of styles...
 *   - classes
 *   - tag overrides
 *
 * A class is a list of styles that can be applied to a
 * selection of text or to a block of HTML. To apply a
 * class you must add
 *    class="name"
 * to the tag you want to transform.
 * For instance, to assign a class to a particular paragraph
 * of text your HTML might look like
 *    <p class="MyClass">My paragraph text goes here</p>
 * Classes in this CSS file are distinguished by
 * a period followed by the name of the class.
 * Example:
 *     .name {
 *     }
 *
 * Tag overrides are particularly useful when you want
 * to alter the parameters of a tag universally. There
 * are two ways to override a tag. You may override a tag
 * universally, meaning every time you use that tag that
 * style will be used, or you may override a tag individually.
 * To override an individual tag you have to give the override
 * a name. To apply an individuala tag override you must add
 *     id="name"
 * to the inside of the tag. Here is an example:
 *    <table id="MyOverride">
 *      ...
 *    </table>
 * Tag overrides in this CSS file are distinguished by
 * the name of the tag, followed by a pound sign, followed
 * by a name for the override.
 * Example:
 *     table#name {
 *     }
 */

/**
 * This is a multiple tag override that sets the styles for the
 * entire page
 */
html,body {
	width: 100%;
	height: 100%;
	background-color: #000000;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

a {
	color:#FFFF00;
	text-decoration:none;
	font-weight:bold;
}

a:hover {
	color:#FF6600;
	text-decoration:none;
	font-weight:bold;
}
	

/**
 * This is a table tag override for any table given the
 * id mainTable
 */
table#mainTable {
	width: 100%;
	height: 100%;
	border: 0px;
	padding: 0px;
	margin: 0px;
}

/**
 * This is a multiple td tag override for any cell given the
 * id mainLeft or mainRight
 */
td#mainLeft, td#mainRight {
	text-align: left;
	vertical-align: top;
	background-color: #999999;
}

/**
 * This is a td tag override for any cell given the
 * id mainCenterStroke.
 *
 * This creates a 10px wide stroke around the main content
 * of the page
 */
td#mainCenterStroke {
	width: 10px;
	height: 100%px;
	background-color: #333333;
}

/**
 * This is a td tag override for any cell given the
 * id banner
 *
 * More specifically this is the banner image displayed
 * at the very top center of the page.
 */
td#banner {
	width: 984px;
	height: 125px;
	background-color: black;
	text-align: center;
	vertical-align: top;
}

/**
 * This is a td tag override for any cell given the
 * id menu
 *
 * Menu is the navigation menu for the entire site and is
 * displayed directly below the banner
 */
td#menu {
	width: 984px;
	height: 25px;
	background-color: black;
	background-image: url(images/Navigation_Bar.jpg);
	background-repeat: repeat-x;
	text-align: right;
	vertical-align: top;
	color: #F7F7F7;
	font-weight: bold;
	font-size: 12px;
}


/**
 * This is a td tag override for any cell given the
 * id content
 *
 * Content is the cell which all content of the page is
 * contained. This cell may contain other tables to layout
 * the page.
 */
td#content {
	width: 984px;
	height: 100%;
	background-color: black;
	text-align: left;
	vertical-align: top;
	padding-top: 10px;
}

/**
 * This is a td tag override that defines the footer text to
 * be displayed at the bottom of every page
 */
td#footer {
	color: #666666;
	text-align: center;
	vertical-align: bottom;
	font-size: 9px;
}

/**
 * This is a table tag override for any table given
 * the id contPanelTable
 *
 * This override defines a content panel. Content
 * panel's are a block of text that have a nice
 * rounded edge and gradient for a background.
 * The table must be broken up into 9 cells to
 * give the visual effect intended. One cell for each
 * corner, one cell for each middle side and a center
 * cell to contain the actual text/graphical content.
 */
table#contPanelTable {
	background-color: #333333;
	background-image: url(images/tmpl_r5_c3.png);
	background-repeat: repeat-x;
	padding: 0px;
	color: #F7F7F7;
}

/**
 * The following are tag overrides for the corner
 * and side cell's of the content panel table.
 *
 * Note that the width and height are fixed for the
 * corner cell's and the side cell's have fixed width
 * or height for their appropriate positions. This
 * allows the table and cell to properly stretch.
 * Further, these cells adopt the table's gradient
 * background image defined in table#contPanelTable.
 */
td#contPanelTopLeft {
	width: 12px;
	height: 12px;
	background-image: url(images/tmpl_r4_c2.png);
	background-position: top left;
	background-repeat: no-repeat;
	text-align: left;
	vertical-align: top;
}
td#contPanelTopMid {
	height: 12px;
	background-image: url(images/tmpl_r4_c3.png);
	background-position: top;
	background-repeat: repeat-x;
	text-align: center;
	vertical-align: top;
}
td#contPanelTopRight {
	width: 12px;
	height: 12px;
	background-image: url(images/tmpl_r4_c4.png);
	background-position: top right;
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: top;
}
td#contPanelMidLeft {
	width: 12px;
	background-image: url(images/tmpl_r5_c2.png);
	background-position: left;
	background-repeat: repeat-y;
	text-align: left;
	vertical-align: middle;
}
td#contPanelMidRight {
	width: 12px;
	background-image: url(images/tmpl_r5_c4.png);
	background-position: right;
	background-repeat: repeat-y;
	text-align: right;
	vertical-align: middle;
}
td#contPanelBotLeft {
	width: 12px;
	height: 12px;
	background-image: url(images/tmpl_r6_c2.png);
	background-position: bottom left;
	background-repeat: no-repeat;
	text-align: left;
	vertical-align: bottom;
}
td#contPanelBotMid {
	height: 12px;
	background-image: url(images/tmpl_r7_c3.png);
	background-repeat: repeat-x;
	background-position: bottom;
	text-align: center;
	vertical-align: bottom;
}
td#contPanelBotRight {
	width: 12px;
	height: 12px;
	background-image: url(images/tmpl_r6_c4.png);
	background-position: bottom right;
	background-repeat: no-repeat;
	text-align: right;
	vertical-align: bottom;
}

/**
 * This is the tag override for the content panel
 * main cell where all text/graphics are displayed.
 * This purposely does not define a width or
 * height in order to make sure it properly stretches
 * with the content placed within.
 *
 * Once again, this cell will adopt the background
 * of the whole table to give the gradient look
 * desired.
 */
td#contPanelContent {
	text-align: left;
	vertical-align: top;
}

/**
 * The following table override definitions are used
 * to define a single column page where only one
 * content panel may display in a row at a time
 */
table#oneColContentTable {
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
	vertical-align: top;
}

/**
 * The following table and td override definitions
 * are used to define a two column page where two
 * contPanelTable's can sit side-by-side.
 */
table#twoColContentTable {
	width: 100%;
	text-align: center;
	vertical-align: top;
}
/**
 * This cell acts as the space between two content
 * panel tables.
 */
td#twoColContentDiv {
	width: 10px;
}
/**
 * These cells are where to put the actual content panel
 * table
 */
td#twoColContentLeftCell {
	width: 50%;
	text-align: center;
	vertical-align: top;
	padding-left: 10px;
}
td#twoColContentRightCell {
	width: 50%;
	text-align: center;
	vertical-align: top;
	padding-right: 10px;
}