﻿
/* ~~~~~~~~~~~~~~ BalloonTip.js ~~~~~~~~~~~~~~ */
.CMN_BT_BalloonStyle
{
	background-color: #E0EFBF; border: solid 1px #CCCCCC; color: #666666; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 9px; font-weight: normal; text-align: left; position: absolute; padding: 5px; visibility: hidden; line-height: 18px; z-index: 10000; overflow-x: auto; overflow-y: auto; top: -1000px; left: -1000px;
	/*Remove below line to remove OPACITY. Below line should always appear last within this CSS*/
	/* filter:alpha(opacity=85);-moz-opacity:.85;opacity:.85; */
	/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
	filter:				progid:DXImageTransform.Microsoft.Shadow(color=#96A8BA,direction=135,Strength=5);
}
.CMN_BT_iBalloonStyle { position: absolute; z-index: 10; display: none; }
#CMN_BT_ArrowHead { z-index:9999; position:absolute; top:-1000px; left:0; visibility:hidden; }
/* ~~~~~~~~~~~~~~ BalloonTip.js ~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~ Tabs/myTabz.js ~~~~~~~~~~~~~~ */
#switch { BACKGROUND: #e1e1e1; PADDING: 10px; FONT-SIZE: 130%; TEXT-ALIGN: center; }
#switch A { COLOR: #414141; TEXT-DECORATION: none; }
.tab_title { background-color: #1450D3; border: 1px solid #0E365F; color: #FFFFFF; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 24px; font-style: normal; font-weight: bold; height:40px;  text-align:center; vertical-align: middle; }
a.tab_title { text-decoration:underline; }
DIV#container { BACKGROUND: white; MARGIN: 0px auto; TEXT-ALIGN: left; }
DIV#tabs { BORDER: none; FONT-SIZE: 11px; MARGIN: 0px auto; }


/* Vertical Tabs * /
DIV.my_tab { DISPLAY: inline; FLOAT: left; MARGIN: 0px auto; }
DIV#tab-bar { DISPLAY: inline; FLOAT: left; WIDTH: 150px; BACKGROUND: none; BORDER-RIGHT: #414141 1px solid; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 12px; HEIGHT: 50px; MARGIN: 0px 0px 0px 0px; PADDING: 0px 0px 0px 10px; }
DIV#tab-bar DIV.mt-tab { FLOAT: right; MARGIN: 4px -1px 0px 0px; WIDTH: 120px; TEXT-ALIGN: left; BACKGROUND: #FFFFFF; BORDER: #414141 1px solid; COLOR: #000000; CURSOR: pointer; DISPLAY: inline; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 13px; PADDING: 10px 10px 5px 10px; POSITION: relative; }
DIV#tab-bar DIV.mt-tab-active { FLOAT: right; MARGIN: 4px -1px 0px 0px; WIDTH: 120px; TEXT-ALIGN: left; BACKGROUND: #1450D3; BORDER-RIGHT: none; BORDER-LEFT: #414141 1px solid; BORDER-TOP: #414141 1px solid; BORDER-BOTTOM-STYLE: #414141 1px solid;; COLOR: #FFFFFF; CURSOR: pointer; DISPLAY: inline; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 13px; FONT-WEIGHT: bold; FLOAT: left; PADDING: 10px 10px 5px 10px; }
/* */

/* Horizontal Tabs */
DIV.my_tab { MARGIN: 0px auto; }
DIV#tab-bar { BACKGROUND: none; BORDER-BOTTOM: #414141 1px solid; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 12px; HEIGHT: 50px; MARGIN: 0px 0px 0px 0px; PADDING: 0px 0px 0px 10px; }
DIV#tab-bar DIV.mt-tab { DISPLAY: inline; FLOAT: left; MARGIN: 14px 5px -3px 0px; HEIGHT: 20px; TEXT-ALIGN: center; BACKGROUND: #FFFFFF; BORDER: #414141 1px solid; COLOR: #000000; CURSOR: pointer; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 13px; PADDING: 10px 10px 5px 10px; POSITION: relative; }
DIV#tab-bar DIV.mt-tab-active { DISPLAY: inline; FLOAT: left; MARGIN: 14px 5px -3px 0px; HEIGHT: 20px; TEXT-ALIGN: center; BACKGROUND: #1450D3; BORDER-RIGHT: #414141 1px solid; BORDER-LEFT: #414141 1px solid; BORDER-TOP: #414141 1px solid; BORDER-BOTTOM-STYLE: none; COLOR: #FFFFFF; CURSOR: pointer; font-family: Verdana, Arial, Helvetica, sans-serif; Font-Size: 13px; FONT-WEIGHT: bold; FLOAT: left; PADDING: 10px 10px 5px 10px; }
/* */

/* ~~~~~~~~~~~~~~ Tabs/myTabz.js ~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~ JQuery.js ~~~~~~~~~~~~~~ */
#PageWizardWrapper { WIDTH: 100% }
#PageWizardPanel { BACKGROUND-COLOR: #f5f5f5; MARGIN: 0px; DISPLAY: none }

#PageMainNav { CLEAR: both; padding: 0px 0px 0px 0px; MARGIN: 0px 0px 0px 0px;  }

#PageMainNav LI { BACKGROUND-IMAGE: url(images/page_navBtn.gif); BACKGROUND-COLOR: #ebebeb; LIST-STYLE-TYPE: none; BACKGROUND-REPEAT: no-repeat; BACKGROUND-POSITION: right top; FLOAT: left; DISPLAY: block; HEIGHT: 32px }
#PageMainNav LI.lastDone { BACKGROUND-IMAGE: url(images/page_navLastDoneBtn.gif); BACKGROUND-COLOR: #7c8437 }
#PageMainNav LI.current { BACKGROUND-IMAGE: url(images/page_navCurrentBtn.gif); BACKGROUND-COLOR: #c36615 }
#PageMainNav LI.done { BACKGROUND-IMAGE: url(images/page_navDoneBtn.gif); BACKGROUND-COLOR: #7c8437 }

#PageMainNav LI.PageMainNavNoBg { BACKGROUND-IMAGE: none }

.PageStep#PageMainNav LI { WIDTH: 90px }

.Page_Buttons { CLEAR: both }
.Page_Next { FLOAT: right }
.Page_Previous { FLOAT: left }
/* ~~~~~~~~~~~~~~ JQuery.js ~~~~~~~~~~~~~~ */

/* ~~~~~~~~~~~~~~ Scrolling Table ~~~~~~~~~~~~~~ */

/* CSS Document */
/* datTable for styling only */
table.dataTable { margin: 0; padding: 0; border-bottom: 1px solid #999; border-left: 1px solid #999; }
table.dataTable th { margin: 0; border-right: 1px solid #999; border-top: 1px solid #999; font-weight: normal; padding: 4px 3px 3px 4px; background: #ccc; font-weight: bold; }

table.dataTable td { margin: 0; border-right: 1px solid #999; border-top: 1px solid #999; padding: 2px 3px 3px 4px }

/* This makes the scrolling table work */
div.scrollTableContainer { overflow: auto; margin: 15px 0 0 0; position: relative; }

/* The different widths below are due to the way the scroll bar is implamented
we are keeping these here instead of putting them in the IE css file b/c it 
is easier to change the width if both numbers are in the same place. */

/* All browsers accept this, but we are targeting IE with this rule */
div.scrollTableContainer table { width: 100%; }

/* Modern browsers accept this (not IE) and we are targetting firefox */
html>/**/body div.scrollTableContainer table { width: 100%; }

/* Modern browsers accept this (not IE) and we are targetting firefox */
html>/**/body div.scrollTableContainer table>tbody	{ overflow: auto; height: 250px; overflow-x: hidden; }

div.scrollTableContainer thead tr { position:relative; }

/*prevent Mozilla scrollbar from hiding cell content*/
div.scrollTableContainer td:last-child {padding-right: 20px;}

/* non-standard IE Specific Rules*/
div.scrollTableContainer thead tr	{
    /* Causes the pixel header row to stay fixed in IE*/
	top: expression(offsetParent.scrollTop);
	/* This fixes a strange bug in IE where the header row would "shift" 1px to
	   the right after the table was scrolled down.  It would not shift back
       after scrolling all the way, which made my first solution based on
       offSetParent.scrollTop == 0 not an effective solution*/
    left: expression(typeof(myvar) == 'undefined' ? 0+"px"+(myvar='true') : -1+"px");
}

/* ~~~~~~~~~~~~~~ Scrolling Table ~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~ JQuery Tabs ~~~~~~~~~~~~~~ */
ul.tabs { margin: 0; padding: 0; float: left; list-style: none; height: 32px; border-bottom: 1px solid #999; border-left: 1px solid #999; width: 100%; }
ul.tabs li { float: left; margin: 0; padding: 0; height: 31px; line-height: 31px; border: 1px solid #999; border-left: none; margin-bottom: -1px; background: #e0e0e0; overflow: hidden; position: relative; }
ul.tabs li a { text-decoration: none; color: #000; display: block; font-size: 12px; padding: 0 20px; border: 1px solid #fff; outline: none; }
ul.tabs li a:hover { background: #ccc; }

html ul.tabs li.active, html ul.tabs li.active a:hover { background: #fff; border-bottom: 1px solid #fff; }
.tab_container { border: 1px solid #999; border-top: none; clear: both; float: left; width: 100%; background: #fff; -moz-border-radius-bottomright: 5px; -khtml-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -khtml-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; }
.tab_content { padding: 0px; font-size: 5px; }
.tab_content h2 { font-weight: normal; padding-bottom: 10px; border-bottom: 1px dashed #ddd; font-size: 12px; }
.tab_content h3 a{ color: #254588; }
.tab_content img { float: left; margin: 0 20px 20px 0; border: 1px solid #ddd; padding: 5px; }
/* ~~~~~~~~~~~~~~ JQuery Tabs ~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~ dd_menu ~~~~~~~~~~~~~~ */
#dd_menu_left { margin: 0; padding: 0; z-index: 30; }
	#dd_menu_left li { margin: 0; padding: 0; list-style: none; float: left; font: bold 12px Verdana; }
	#dd_menu_left li a { background: #E81118; color: #FFF; display: block; margin: 0 1px 0 0; padding: 4px 10px; width: auto; text-align: center; text-decoration: none }
	#dd_menu_left li a:hover { color: #000000}
	#dd_menu_left div {	background: #E81118; border: 1px solid #5970B2; position: absolute; visibility: hidden; margin: 0; padding: 0; }
	#dd_menu_left div a { color: #FFF; position: relative; display: block; margin: 0; padding: 5px 10px; width: auto; white-space: nowrap; text-align: left; text-decoration: none; font: 12px Verdana; }
	#dd_menu_left div a:hover { color: #000000}

#dd_menu_right { margin: 0; padding: 0; z-index: 30; }
	#dd_menu_right li { margin: 0; padding: 0; list-style: none; float: right; font: bold 12px Verdana; }
	#dd_menu_right li a { background: #E81118; color: #FFF; display: block; margin: 0 1px 0 0; padding: 4px 10px; width: auto; text-align: center; text-decoration: none }
	#dd_menu_right li a:hover { color: #000000}
	#dd_menu_right div {	background: #E81118; border: 1px solid #5970B2; position: absolute; visibility: hidden; margin: 0; padding: 0; }
	#dd_menu_right div a { color: #FFF; position: relative; display: block; margin: 0; padding: 5px 10px; width: auto; white-space: nowrap; text-align: left; text-decoration: none; font: 12px Verdana; }
	#dd_menu_right div a:hover { color: #000000}
/* ~~~~~~~~~~~~~~ dd_menu ~~~~~~~~~~~~~~ */


/* ~~~~~~~~~~~~~~ Pager Control ~~~~~~~~~~~~~~ */
.pagercontainer { margin: 20px 0; background: whitesmoke; padding: 5px; }
.pager { float: right; font-size: 10pt; text-align: left; }
.pagerbutton,.pagerbutton-selected,.pagertext { display: block;     float: left; text-align: center; border: solid 2px maroon; min-width: 18px;  margin-left: 3px; text-decoration: none; padding: 4px; }
.pagerbutton-selected { font-size: 130%; font-weight: bold; color: maroon; border-width: 0px; background: khaki; }
.pagerbutton-first { margin-right: 12px; }
.pagerbutton-last,.pagerbutton-prev { margin-left: 12px; }
.pagertext { border: none; margin-left: 30px; font-weight: bold; }
.pagerbutton a { text-decoration: none; }
.pagerbutton:hover { background-color: maroon; color: cornsilk; }
.pagerbutton-prev { background-image: url(images/prev.png); background-position: 2px center; background-repeat: no-repeat; width: 35px; padding-left: 20px; }
.pagerbutton-next { background-image: url(images/next.png); background-position: 40px center; background-repeat: no-repeat; width: 35px; padding-right: 20px; margin-right: 0px; }
/* ~~~~~~~~~~~~~~ Pager Control ~~~~~~~~~~~~~~ */

