﻿/* PORTAL */
/* Core Style Sheet */
/* @group core styles */
* { padding: 0; margin: 0; }
/* all bodies */
body, td, div, span, input, textarea, select, option { font: 12px "Lucida Grande" , Lucida, Verdana, sans-serif; }
/* main portal body */
body.portal { background-image: url(/nPortal/img/bg.png); background-repeat: repeat-x; }
/* application body */
body.app   { background-color: #BFD7ED; }
body.appT  { background-image: url('/nPortal/img/app_bkg_training.png'); background-repeat: repeat; }
body.appQ  { background-image: url('/nPortal/img/app_bkg_qa.png');  background-repeat: repeat; }
body.appD  { background-image: url('/nPortal/img/app_bkg_dev.png'); background-repeat: repeat; }
body.login { background-image: url(/nPortal/img/bg.png); background-repeat: repeat-x; font: 12px "Lucida Grande" , Lucida, Verdana, sans-serif; }
/* close button */
div.closeX {float:right;}
div.closeX a { display: block; width: 26px; height: 26px; background: url('/nPortal/img/closeX.png') no-repeat; } 
div.closeX a:hover { background-position: -26px 0; }
/* refresh button */
div.refresh16, div.refresh24 {float:right;}
div.refresh16 a { display:block;width:16px;height:16px; background: url('/nPortal/img/refresh-blue16.png') no-repeat; } 
div.refresh24 a { display:block;width:24px;height:24px; background: url('/nPortal/img/refresh-blue24.png') no-repeat; } 
/* print button */
div.print24,div.print16 {float:right;}
div.print16 a { display:block;width:16px;height:16px; background: url('/nPortal/img/print16.png') no-repeat; } 
div.print24 a { display:block;width:24px;height:24px; background: url('/nPortal/img/print24.png') no-repeat; } 
/* delete img */
a.deleteX { display: block; width: 12px; height: 12px; background: url('/nPortal/img/deleteX.png') no-repeat; } 
a.deleteX:hover { background-position: -12px 0; } 

div.wrapper { padding: 0 10px 0 10px; }
.disabled { background-color:#e3e3e3; border:solid 1px gray; }

p  { color: #5e5e5e;   }
h1 { font-size: 1.6em; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.2em; }
.h1 { font-size: 1.6em; }
.h2 { font-size: 1.4em; }
.h3 { font-size: 1.2em; }
.red {color:Red;}
.blue {color:Blue;}
.gray {color:Gray;}
.maroon {color:Maroon;}
.navy {color:navy;}
.green {color:green;}
.bold {font-weight:bold;}
a { color: #003366; font-weight: bold; text-decoration: none; }
a.gray { color: #555555; font-weight: bold; text-decoration: none; }
a:hover { color: #003366; font-weight: bold; text-decoration: underline; }
img { border-style: none; }
ul.dot { list-style-type: disc; margin-left: 15px; color: #003366; line-height: 16px; }

.search_results { padding: 0 10px 0 10px; }
#header h3 { margin-left: 320px; margin-top: 0px; }
.dv-sap { float:left; margin-right:15px;}
/* @group Banner Styles */
#bannernav { text-align: left; float: left; vertical-align: bottom; }

/* @group Logo */
.logo { padding-left: 25px; }
.logo h1#lineone { font-weight: lighter; padding-top: 20px; padding-left: 25px; color: #FFF; border: none; top: 0; left: 14px; letter-spacing: -1px; }
.logo h1#lineone span { color: #003366; }
.logo h2#linetwo { padding-left: 25px; text-transform: none; top: 25px; left: 14px; color: #003366; }
.logo a { color: #003366; text-decoration: none; }

/* @group Navigation */
#navigation { float: right; color: #333; }
#navigation ul { list-style-type: none; text-align: center; }
#navigation li { display: inline; }
#navigation a { float: left; text-decoration: none; color: #FFFFFF; padding: 8px 10px 0; background: url(/nPortal/img/navback.png) repeat-x; border-right: 1px solid #00407c; height: 20px; }
#navigation a:hover { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
#navigationasp { text-align: right; color: #333; }
.mainMenu { padding: 0px; }
.menuItem { color: #FFFFFF; background: url(/nPortal/img/navback.png) repeat-x; padding: 5px; text-align: left; }
.menuItemHover { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; padding: 5px; text-align: left; }
.menuItemHover a { text-decoration: none; }

/* @group Left */
#leftcolumn { color: #333; margin: 10px 0 0 10px; width: 200px; float: left; padding: 0; }
.leftnav ul { list-style: none; }
.leftnav li { font-size: 12px; }
.leftnav li a { display: block; width: 199px; height: 35px; line-height: 30px; background: url(/nPortal/img/nav2.png) no-repeat left top; text-indent: 10px; color: #FFFFFF; text-decoration: none; font-weight: bold; padding-top: 3px; }
.leftnav li a:active, .leftnav li a:hover { background-position: right top; color: #003366; font-weight: 800; }
.leftnav li a:visited { }

/* @group Center */
#centercolumn { float: left; color: #333; min-height: 350px; width: 550px; padding-top: 10px; padding-right: 10px; padding-left: 10px; }
#centercolumn h1 { margin: 0 5px 0 5px; color: #5e5e5e; padding: 5px; }
#centercolumn h2 { margin: 10px 5px 0 5px; padding: 0; color: #5e5e5e; }
#centercolumn p { padding: 10px 5px 0 5px; text-align: justify; }

/* @group Footer */
#footer { height: 70px; color: #5e5e5e; margin: 10px 0 10px 0; text-align: center; font-weight: bold; font-size: 10px; margin: 0 10px 0 10px; }
#footer a { font-weight:normal; }
#footer a :hover { font-weight:normal; }
.footerleft { float: left; }
.footerright { float: right; }

/* @group header_box */
.header_box { display: block; }
.header_box * { display: block; height: 1px; overflow: hidden; font-size: .01em; background: #9abfe1; }
.header_box1 { margin-left: 3px; margin-right: 3px; padding-left: 1px; padding-right: 1px; border-left: 1px solid #a4c7e7; border-right: 1px solid #a4c7e7; background: #9ec2e4; }
.header_box2 { margin-left: 1px; margin-right: 1px; padding-right: 1px; padding-left: 1px; border-left: 1px solid #abcceb; border-right: 1px solid #abcceb; background: #9dc1e3; }
.header_box3 { margin-left: 1px; margin-right: 1px; border-left: 1px solid #9dc1e3; border-right: 1px solid #9dc1e3; }
.header_box4 { border-left: 1px solid #a4c7e7; border-right: 1px solid #a4c7e7; }
.header_box5 { border-left: 1px solid #9ec2e4; border-right: 1px solid #9ec2e4; }
.header_boxMain { background: #9abfe1; }

/* @group content_box */
.content_boxMain { background: #bfd7ed; padding: 10px; }
.content_boxMain_right { background: #bfd7ed; text-align: left; padding: 10px 15px 15px 10px; margin-bottom:10px;}
.content_boxMenu { background: #bfd7ed; padding: 10px 50px 0 10px; }
.content_boxMain_center { background: #bfd7ed; text-align: center; }
.content_boxMain_left { background: #bfd7ed; text-align: left; padding: 10px 15px 15px 10px; }
.content_boxNews { background: #bfd7ed; text-align: left; border-radius: 8px; }
.content_boxNews2 { background: #bfd7ed; text-align: left; border-radius: 8px; padding: 10px 15px 15px 10px; margin:0 0 8px 0; }

.white_boxMain { background: #ffffff; padding: 10px 10px 5px 10px; }
.blue_boxMain { background: #bfd7ed; padding: 10px; }
.nav_boxMain { background: #00508c; }

.light_blue_boxMain { background: #e5effa; padding: 10px; }
.light_blue_boxMain div table tr td { background: transparent;}
.light_blue_boxMain table tr td { background: transparent;}

.top_boxAlert, .top_boxMain { background: #00508c; padding:8px 10px 3px 10px; margin-right:10px; font-size: 12px; text-align:center;}
.top_boxAlert { font-weight: bold; color: black; background-color: yellow; float: left; visibility:hidden;}
.top_boxAlert span { font-weight: bold; color: red; }

.rowsimplealt { background-color: #bfdbf4; }
.rowsimplealt TD { border-right-style: none; padding:3px;}
.rowsimplealt:hover { }
.rosimplewalt TD { border-right-style: none; }
.rosimplewalt TD.end { border-right-style: none; }
.shift { margin-right: -10px; margin-top: -15px; margin-left: -10px; }
.shift2 { margin-right: -10px; margin-top: -20px; margin-left: -15px; }
.shift3 { margin-top: -10px; margin-left: -20px; }
.pad { padding: 0px 10px 0px 0px; }
.resize { font-size: 9px; }
.buffer { height: 10px; }

/* @group tables */
* { }
TABLE.boxview { border-collapse: separate; width: 100%; }
TABLE.boxview TD, h1 { vertical-align: top; padding: 10px; }
TABLE.boxview TD.left { vertical-align: top; width: 200px; padding-top:10px; }
TABLE.boxview TD.center { vertical-align: top; padding: 10px 10px 0 0; }
TABLE.boxview TD.right { vertical-align: top; width: 320px; padding-left: 0; }
TABLE.boxview h2 { margin-bottom: 10px; margin-top: 5px; }
TABLE.boxview h3 { margin-left: 10px; }
TABLE.boxview p { line-height: 15px; margin-bottom: 10px; }
TABLE.contentview { border-collapse: separate; width: 100%; }
TABLE.contentview TD { vertical-align: top; padding: 0 5px 0 0; }
TABLE.formview  { border-collapse: separate; width: 100%; font-size: 12px; margin:0; }
TABLE.toolviewcontainer { border-collapse: separate; vertical-align: middle; margin: 0; padding: 0; vertical-align: middle; width: 100%; border-style: hidden; border-width: 0; }
TABLE.toolviewcontainer TD { border-collapse: separate; vertical-align: middle; padding: 0 6px 0 0; vertical-align: middle; margin-top: 0; margin-left: 0; margin-bottom: 0; }
TABLE.toolview { border-collapse: separate; vertical-align: middle; margin: 0; padding: 0 0 0 0; vertical-align: middle; }
TABLE.toolview TD { border-collapse: separate; vertical-align: middle; padding: 0; vertical-align: middle; margin-top: 0; margin-left: 0; margin-bottom: 0; border-style: hidden; border-width: 1px; }
TABLE.formview TD { vertical-align: top; padding: 3px; }

/* @group popbottom_box */
.popbottom { display: block; }
.popbottom * { display: block; height: 1px; overflow: hidden; font-size: .01em; background: #225589; }
.popbottom1 { margin-left: 3px; margin-right: 3px; padding-left: 1px; padding-right: 1px; border-left: 1px solid #9fb5cc; border-right: 1px solid #9fb5cc; background: #597fa6; }
.popbottom2 { margin-left: 1px; margin-right: 1px; padding-right: 1px; padding-left: 1px; border-left: 1px solid #e8eef3; border-right: 1px solid #e8eef3; background: #4b759f; }
.popbottom3 { margin-left: 1px; margin-right: 1px; border-left: 1px solid #4b759f; border-right: 1px solid #4b759f; }
.popbottom4 { border-left: 1px solid #9fb5cc; border-right: 1px solid #9fb5cc; }
.popbottom5 { border-left: 1px solid #597fa6; border-right: 1px solid #597fa6; }

/* @group poptop_box */
 poptop { display: block; }
.poptop * { display: block; height: 1px; overflow: hidden; font-size: .01em; background: #a2b6cb; }
.poptop1 { margin-left: 3px; margin-right: 3px; padding-left: 1px; padding-right: 1px; border-left: 1px solid #d7dfe8; border-right: 1px solid #d7dfe8; background: #b9c8d8; }
.poptop2 { margin-left: 1px; margin-right: 1px; padding-right: 1px; padding-left: 1px; border-left: 1px solid #f5f7f9; border-right: 1px solid #f5f7f9; background: #b3c3d4; }
.poptop3 { margin-left: 1px; margin-right: 1px; border-left: 1px solid #b3c3d4; border-right: 1px solid #b3c3d4; }
.poptop4 { border-left: 1px solid #d7dfe8; border-right: 1px solid #d7dfe8; }
.poptop5 { border-left: 1px solid #b9c8d8; border-right: 1px solid #b9c8d8; }
.poptopfg { background: #a2b6cb; }

/* @group login---- */
#login { width: 350px; height: 480px; margin: auto; padding: 0px; position: relative; top: 100px; }
#login h1 { text-align: center; color: #5e5e5e; }
#login h2 { text-align: center; color: #5e5e5e; }

.menu { float: right; color: #333; font-size: 11px; }
/* remove all the bullets, borders and padding from the default list styling */
.menu ul { padding: 0; margin: 0; list-style-type: none; z-index: 10; }
.menu ul ul { }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li { float: left; position: relative; background-color: #1A5389; }
/* style the links for the top level */
.menu a, .menu a:visited { float: left; text-align: left; text-decoration: none; color: #FFFFFF; padding: 8px 10px 0; background-color: #1A5389; border-right: 1px solid #00407c; height: 20px; }
/* style the standalone li spans */
.menu span { float: left; text-align: left; text-decoration: none; color: #FFFFFF; padding: 8px 10px 0; background-color: #1A5389; border-right: 1px solid #00407c; height: 20px; }
/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited { float: left; text-align: left; text-decoration: none; color: #FFFFFF; background-color: #1A5389; border-right: 1px solid #00407c; vertical-align: middle; }
.menu .dropText, .menu .dropText { font-style: normal; width: 150px; float: left; text-align: left; background-color: Transparent; padding: 0px; border-right-width: 0px; }
.menu .dropText:hover { color: #003366; }
/* style the second level standalone li spans */
.menu ul ul span { float: left; text-align: left; text-decoration: none; color: #FFFFFF; background-color: #1A5389; border-right: 1px solid #00407c; font-weight: bold; font-style: italic; vertical-align: middle; }
/* style the second level hover */
.menu ul ul a.drop:hover { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
.menu ul ul :hover > a.drop { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited { float: left; text-align: left; text-decoration: none; color: #FFFFFF; background-color: #1A5389; border-right: 1px solid #00407c; }
/* style the second level standalone li spans */
.menu ul ul ul span { float: left; text-align: left; text-decoration: none; color: #FFFFFF; background-color: #1A5389; border-right: 1px solid #00407c; font-weight: bold; font-style: italic; }
/* style the third level hover */
.menu ul ul ul a:hover { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul { visibility: hidden; position: absolute; height: 0; top: 28px; left: 0; width: 180px; border-top: 1px solid #000; }
/* position the third level flyout menu */
.menu ul ul ul { left: 181px; top: -1px; width: 180px; }
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left { left: -180px; }
/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table { position: absolute; top: 0; left: 0; border-collapse: collapse; }
/* style the second level links */
.menu ul ul a, .menu ul ul a:visited { height: auto; line-height: 1em; padding: 5px 10px; width: 180px; border-width: 0 1px 1px 1px; }
/* style the second level spans */
.menu ul ul span { height: auto; line-height: 1em; padding: 5px 10px; width: 180px; border-width: 0 1px 1px 1px; }
/* style the second level links */
.menu ul ul ul a, .menu ul ul ul a:visited { height: auto; line-height: 1em; padding: 5px 10px; width: 180px; border-width: 0 1px 1px 1px; }
/* style the second level spans */
.menu ul ul ul span { height: auto; line-height: 1em; padding: 5px 10px; width: 180px; border-width: 0 1px 1px 1px; }
/* style the top level hover */
.menu a:hover, .menu ul ul a:hover { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
.menu :hover > a, .menu ul ul :hover > a { background: url(/nPortal/img/navhover.png) repeat-x; color: #003366; }
/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul, .menu ul a:hover ul { visibility: visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul { visibility: hidden; }
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul { visibility: visible; }

/* application menu */
.secmenu { color: #333; font-size: 11px; padding-left: 10px; padding-right: 10px; }
/* remove all the bullets, borders and padding from the default list styling */
.secmenu ul { padding: 0; list-style-type: none; }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.secmenu li { float: left; position: relative; list-style-image: none; }
/* menu headers */
.secmenu a, .secmenu a:visited { float: left; text-align: left; text-decoration: none; color: #FFFFFF; padding: 5px 10px 0; background: #9ABFE1; height: 23px; }
/* menu header hover */
.secmenu a:hover, .secmenu :hover > a { background: #4478aa; color: #FFFFFF; text-decoration: none; }
/* menu position */ 
.secmenu ul ul { visibility: hidden; position: absolute; height: 0; top: 28px; left: 0; width: 300px; }
/* menu links */
.secmenu ul ul a, .secmenu ul ul a:visited { height: auto; line-height: 1em; padding: 5px 10px; width: 300px; border-width: 0 1px 1px 1px; background-color: #4478aa; }
/* menu hover */
.secmenu ul ul :hover > a, .secmenu ul ul a:hover { background: #00407c; color: #FFFFFF; text-decoration: none; }
/* make menu visible when hover on menu header */
.secmenu ul li:hover ul, .secmenu ul a:hover ul { visibility: visible; }
/* application name */
.secmenu span { float: left; color: #00407C; padding: 4px 10px 0; font-size: 14px; font-weight: bold; }
/* End application menu */

/* @group grid */
/* Grid Menu */
.gridmenu { margin-bottom: -20px; color: #333; font-size: 10px; float: right; margin-top: -25px; }
/* remove all the bullets, borders and padding from the default list styling */
.gridmenu ul { padding: 0; margin: -3px 0 0 0; list-style-type: none; }
.gridcmenu ul ul { }
.gridmenu ul li a { font-size: 10px; }
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.gridmenu li { float: left; position: relative; }
/* style the links for the top level */
.gridmenu a, .gridmenu a:visited { float: left; text-align: left; text-decoration: none; }
/* style the second level background */
.gridmenu ul ul a, .gridmenu ul ul a:visited { float: left; text-align: left; background-color: #4478AA; color: White; text-decoration: none; font-size: 10px; }
/* style the second level hover */
.gridmenu ul ul a.griddrop:hover { text-decoration: underline; }
.gridmenu ul ul :hover > a.griddrop { text-decoration: underline; }
/* hide the sub levels and give them a positon absolute so that they take up no room */
.gridmenu ul ul { visibility: hidden; position: absolute; height: 0; top: 15px; left: 0; }
/* style the table so that it takes no ppart in the layout - required for IE to work */
.gridmenu table { position: absolute; top: 0; left: 0; border-collapse: collapse; }
/* style the second level links */
.gridmenu ul ul a, .gridmenu ul ul a:visited { height: auto; line-height: 1em; padding: 5px 10px; }
/* style the top level hover */
.gridmenu a:hover, .gridmenu ul ul a:hover { text-decoration: underline; }
.gridmenu :hover > a, .gridmenu ul ul :hover > a { text-decoration: underline; }
/* make the second level visible when hover on first level list OR link */
.gridmenu ul li:hover ul, .gridmenu ul a:hover ul { visibility: visible; }
/* End Grid Menu */

/* @group button */
.clear { overflow: hidden; width: 100%; float: right; }

/* +++++++++++++++++++++++++++++++++++++++ */
/* LEGACY SECTION                          */
/* +++++++++++++++++++++++++++++++++++++++ */

/* modal dialog */
BODY.MODAL { background-color: #FFFFD4; }
SPAN.MODAL { position: relative; width: auto; margin-left: 2px; }

.MODAL_hN_sN { background-color: White;   border: solid 1px white; }
.MODAL_hY_sN { background-color: #FFFFAA; border: dotted 1px gray; }
.MODAL_hN_sY { background-color: #dff3ff; border: solid 1px #2c94fc; }
.MODAL_hY_sY { background-color: #FFFFAA; border: solid 1px #2c94fc; }

.MODAL_hN_sN, .MODAL_hY_sN, .MODAL_hN_sY, .MODAL_hY_sY { cursor: pointer; text-align: left; padding: 5px; }

/* output columns margin */
#tbDataOutputCols DIV { margin: 1px 1px 2px 1px; }
#tbDataOutputCols TD  { margin: 2px; padding: 2px; vertical-align: top; }
#tbDataOutputOpt .MODAL_hN_sN, 
#tbDataOutputOpt .MODAL_hY_sN, 
#tbDataOutputOpt .MODAL_hN_sY, 
#tbDataOutputOpt .MODAL_hY_sY {padding:5px;}

/* Page title */
.PAGE_TITLE { font-weight: bold; margin-top: 5px; margin-bottom: 5px; text-align: center; }
.PRINT_TITLE { font-weight: bold; margin: 0 0 10px 0; text-align: left; }

/* slogan on the page header */
.HEADER_SLOGAN { color: White; font: italic large Verdana, Arial; }

/* group of data entry controls */
.DATA_ENTRY_GROUP, .DATA_ENTRY_GROUP2 { white-space: nowrap; text-align: right; vertical-align: top; font: 12px "Lucida Grande" , Lucida, Verdana, sans-serif; padding: 5px 5px 0 5px; }
.DATA_ENTRY_GROUP_SEARCH { white-space: nowrap; text-align: right; vertical-align: top; font: 12px "Lucida Grande" , Lucida, Verdana, sans-serif; border: solid 1px gray; padding: 10px; margin: 5px; background-color: White; }

/* group of search fields */
DIV.SEARCH_FIELDS { margin-top: 5px; }

/* title for a group of data entry fields */
DIV.DATA_ENTRY_TITLE, SPAN.DATA_ENTRY_TITLE { font-weight: bold; text-align: left; width: 100%; padding: 3px; margin-bottom: 3px; font-size: 1.2em;}
TR.DATA_ENTRY_TITLE { font-weight: bold; text-align: left; padding: 3px; font-size: 1.2em;}
.title_gray {background-color:#cccccc;font-weight:bold;text-align:left;color:Black;padding:3px;margin-bottom:3px;}

IFRAME { margin: 0; padding: 0; }

/* checkbox in grid row */
INPUT.CHK { border: none 0px; margin: 0; padding: 0; font-size: 10px; height: 15px; width: 15px; }

/* modal dialog */
DIV.PRINT_AREA { visibility: hidden; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; text-align: center; vertical-align: top; z-index: 1000; background-color: #E1E1E1; }

/* performance stats */
.PERFORMANCE_STATS { font-size: 10px; color: #A5A5A5; width: 100%; text-align: right; margin-top: 10px; }

/* placeholder INPUT and SPAN to contain the required field asterisk designator */
SPAN.OPTIONAL { width: 7px; padding-left: 0px; color: Blue; font-family: Verdana, Arial, "Courier New" , "MS Sans Serif"; font-size: 10px; }
SPAN.REQUIRED { width: 7px; padding-left: 0px; color: Red; font-family: Verdana, Arial, "Courier New" , "MS Sans Serif"; font-size: 10px; }
INPUT.REQUIRED { width: 4px; visibility: hidden; font-family: Verdana, Arial, "Courier New" , "MS Sans Serif"; font-size: 10px; }

/* bottom status line */
.BOTTOM_STATUS { background-image: url('IMG/gray_box_bottom.gif'); background-repeat: repeat-x; }
.BOTTOM_STATUS_TEXT, .BOTTOM_STATUS_CLOCK { font-family: Verdana, Arial; font-size: 9px; color: #AAAAAA; }
.BOTTOM_STATUS_CLOCK { color: black; }
.BOTTOM_STATUS_TOP_LINE { border-top: solid 1px #2c94fc; }
.SLOGAN { white-space: nowrap; color: #1E1EC8; font-weight: bold; }

/* all input controls */
.input-no-border { border:solid 2px white; }
.InputXXXS,.InputXXS,.InputXS,.InputS,.Input,.InputL,.InputXL,.InputXXL,.InputXXXL,.InputXXXXL { text-align: left;  margin-bottom: 3px;}
.InputXXXS { width: 36px; }
.InputXXS { width: 56px; }
.InputXS { width: 76px; }
.InputS { width: 96px; }
.InputL { width: 116px; }
.InputXL { width: 136px; }
.InputXXL { width: 156px; }
.InputXXXL { width: 176px; }
.InputXXXXL { width: 196px; }

.Select,.SelectXXS,.SelectXS,.SelectS,.SelectL,.SelectXL,.SelectXXL,.SelectXXXL,.SelectXXXXL,.SelectXXXXXL { text-align: left; margin-bottom: 3px;}
.SelectXXS { width: 60px; }
.SelectXS { width: 80px; }
.SelectS { width: 100px; }
.SelectL { width: 120px; }
.SelectXL { width: 140px; }
.SelectXXL { width: 160px; }
.SelectXXXL { width: 180px; }
.SelectXXXXL { width: 200px; }
.SelectXXXXXL { width: 230px;}

/* additional class for read-only input control */
.readonly, .RO { background-color: #F0F0F0; border:solid 2px #F0F0F0; }

/* generic classes for alignment */
.HC { text-align: center; }
.HL { text-align: left; }
.HR { text-align: right; }
.VT { vertical-align: top; }
.VM { vertical-align: middle; }
.VB { vertical-align: bottom; }

/* data grid */
.DATA_GRID { border: solid 1px gray; }

/* DataGrid Navigation bar text */
SP.GRID_NAVIGATION { font-size: 11px; position: relative; top: -1px; }

/* DataGrid Grid Navigation table */
TABLE.GRID_NAVIGATION { border: solid 1px gray; margin-top: 2px; margin-bottom: 2px; margin-left: 0; margin-right: 0; padding: 0; }
TABLE.GRID_NAVIGATION TR { background-color: #E1E1E1; color: Black; font-family: Verdana, Arial; font-size: 10px; vertical-align: middle; }
TABLE.GRID_NAVIGATION SPAN { font-size: 11px; }

/* style sheet for print goes here */
@media print {
   /* buttons are always hidden on printouts */
   .BUTTONb, .BUTTONb:HOVER, .BUTTONb_HOVER, .BUTTONb:ACTIVE, .BUTTONb_ACTIVE, .BUTTONo, .BUTTONo:HOVER, .BUTTONo_HOVER, .BUTTONo:ACTIVE, .BUTTONo_ACTIVE { display: none; }
   /* class to hide any element on print */
   .HIDE_ON_PRINT { display: none; }
   /* class to hide any element on screen, there is no definition for print - just an empty declaration */
   .HIDE_ON_SCREEN { }
   /* hide scroll bars on print */
   .HIDE_SCROLL_ON_PRINT { overflow: hidden; }
   /* hide borders on print */
   .HIDE_BORDERS_ON_PRINT { border: none 0; }
   /* show borders on print */
   .SHOW_BORDER_ON_PRINT { border: solid 1px black; padding: 10px; margin: 0; }
   .SEARCH_HEADER_TABLE {display:none;}
   .PERFORMANCE_STATS {display:none;}
}

@media screen {
   /* class to hide any element on print, there is no definition for screen - just an empty declaration */
   .HIDE_ON_PRINT { }
   /* class to hide any element on screen */
   .HIDE_ON_SCREEN { display: none; }
   /* hide scroll bars on print, there is no definition for screen - just an empty declaration */
   .HIDE_SCROLL_ON_PRINT { }
   /* hide borders on print, there is no definition for screen - just an empty declaration */
   .HIDE_BORDERS_ON_PRINT { }
   /* show borders on print */
   .SHOW_BORDER_ON_PRINT { border: none 0; padding: 0; margin: 0; }
}

/* Block element: DIV or TABLE serving as a container with no offsets around the contents */
.NO_BORDERS { border: 0px none; margin: 0; padding: 0; }
.wide100 { width: 100%; margin: 0px; padding: 0px; }
table.wide100 tbody{ width: 100%; margin: 0px; padding: 0px; }


/* invisible element */
.HIDDEN { display: none; }

/* element sized to 1px. This can be applied to hidden field just so they don't show up in the Visual Studio designer pane */
.OnePX { width: 1px; height: 1px; }

/* help contents */
.HELP_ITAL_MAROON, .HELP_ITAL_BLACK { font-family: Arial; font-style: italic; }
.HELP_ITAL_MAROON { color: Maroon; }
.HELP_ITAL_BLACK { color: Black; }

/* Calendar image */
.IMG_CALENDAR { cursor: pointer; border: 0px; margin: 0px; padding: 0px; position: relative; left: -1px; top: 2px; }

/* left and right arrows - for page navigation */
TD.PAGE_NAVIGATION_FIRST { background-image: url('/nPortal/img/begining.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_PREV { background-image: url('/nPortal/img/back.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_NEXT { background-image: url('/nPortal/img/forward.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_LAST { background-image: url('/nPortal/img/end.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

TD.PAGE_NAVIGATION_HOVER_FIRST { background-image: url('/nPortal/img/begining.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_HOVER_PREV { background-image: url('/nPortal/img/back.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_HOVER_NEXT { background-image: url('/nPortal/img/forward.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_HOVER_LAST { background-image: url('/nPortal/img/end.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

TD.PAGE_NAVIGATION_ACTIVE_FIRST { background-image: url('/nPortal/img/begining.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_ACTIVE_PREV { background-image: url('/nPortal/img/back.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_ACTIVE_NEXT { background-image: url('/nPortal/img/forward.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_ACTIVE_LAST { background-image: url('/nPortal/img/end.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

/* UP and DOWN arrows - for sorting */
TD.PAGE_NAVIGATION_UP { width: 19px; background-image: url('/nPortal/img/up.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_DN { width: 19px; background-image: url('/nPortal/img/down.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

TD.PAGE_NAVIGATION_HOVER_UP { width: 19px; background-image: url('/nPortal/img/up.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_HOVER_DN { width: 19px; background-image: url('/nPortal/img/down.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

TD.PAGE_NAVIGATION_ACTIVE_UP { width: 19px; background-image: url('/nPortal/img/up.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }
TD.PAGE_NAVIGATION_ACTIVE_DN { width: 19px; background-image: url('/nPortal/img/down.png'); background-repeat: no-repeat; background-position: center; cursor: pointer; }

/* divider with images for grid rows */
div.CHKYES, div.CHKNO, div.CHKTrue, div.CHKFalse, div.CHKY, div.CHKN, div.IMG_JUMP, div.IMG_EDIT, div.READ_ONLY_Y, div.IMG_FILTER { width: 100%; background-repeat: no-repeat; vertical-align: middle; }
/* checkbox image */
div.CHKYES,div.CHK1,div.CHKY,div.CHKTrue { background-position: center; cursor: pointer; height: 12px; background-image: url('/nPortal/img/check-yes.gif'); background-repeat: no-repeat; }
div.CHKNO,div.CHK0,div.CHKN,div.CHKFalse { background-position: center; cursor: pointer; height: 12px; background-image: url('/nPortal/img/check-no.gif'); background-repeat: no-repeat; }
/* open/close envelope image */
div.IMG_OPEN_Y { background-position: center; height: 12px; background-repeat: no-repeat; background-image: url('/nPortal/img/open12x12.GIF'); }
div.IMG_OPEN_N { background-position: center; height: 12px; background-repeat: no-repeat; background-image: url('/nPortal/img/closed12x12.GIF'); }
div.IMG_CLOSED_N { background-position: center; height: 12px; background-repeat: no-repeat; background-image: url('/nPortal/img/open12x12.GIF'); }
div.IMG_CLOSED_Y { background-position: center; height: 12px; background-repeat: no-repeat; background-image: url('/nPortal/img/closed12x12.GIF'); }
/* jump to other page link image */
div.IMG_JUMP { background-image: url('/nPortal/img/green_arrow_02.gif'); background-position: left; padding-left: 14px; height: 11px; }
div.IMG_EDIT { background-image: url('/nPortal/img/blue_arrow_02.gif'); background-position: left; padding-left: 14px; height: 15px; }
/* lock (r/o) image */
div.READ_ONLY_Y { background-image: url('/nPortal/img/lock12x12.gif'); background-position: left; height: 12px; width: 12px; }
div.READ_ONLY_N { }
/* jump to other page link image */
div.IMG_FILTER { background-image: url('/nPortal/img/green_filter.gif'); background-position: left; padding-left: 14px; height: 11px; }
/* title of the search area */
.SEARCH_TITLE { color: #5e5e5e; font-size: 1.6em; font-weight: bold; }
.SEARCH_HEADER_TABLE { width: 100%; margin:5px 0 0 0; padding:0; }
/* Add | Search | Refresh menu on search results */
.SEARCH_HEADER_TABLE A, .SEARCH_HEADER A { font-size: 10px; }
/* drop down menus on search results */
UL.SEARCH_DROP_MENU { margin-left: -10px; }
UL.SEARCH_DROP_MENU A { width: 110px; }
UL.SEARCH_DROP_MENU A.HIST { margin-left: -40px; width: 720px; }
UL.SEARCH_DROP_MENU A.HIST SPAN { color:yellow;padding:0 5px 0 5px; font-size:10px;}

/* Grid rows */
.GridHeader { font-weight: bold; background-color: #BFD7ED; }
.GridHeader TD { font-weight: bold; }
/* Precidence: normal < alternate < selected < hover : Alt override Normal, Sel override Alt, Hover override Alt */
.GridRow_altY_selY_hovY, .GridRow_altN_selN_hovN, .GridRow_altN_selN_hovY, .GridRow_altN_selY_hovN, .GridRow_altY_selN_hovN, .GridRow_altY_selN_hovY, .GridRow_altY_selY_hovN, .GridRow_altN_selY_hovY { font-weight: bold; }
.GridRow_altY_selY_hovY { background-color: #00407b; color: white;}
.GridRow_altN_selN_hovN { background-color: #deedfa; }
.GridRow_altN_selN_hovY { background-color: #00407b; color: white;}
.GridRow_altN_selY_hovN { background-color: #5E5E5E; color: white;}
.GridRow_altY_selN_hovN { background-color: #bfdbf4; }
.GridRow_altY_selN_hovY { background-color: #00407b; color: white;}
.GridRow_altY_selY_hovN { background-color: #5E5E5E; color: white;}
.GridRow_altN_selY_hovY { background-color: #00407b; color: white;}
/* A - white if selected or hover */
.GridRow_altY_selY_hovY A, .GridRow_altN_selN_hovY A, .GridRow_altN_selY_hovN A, .GridRow_altY_selN_hovY A, .GridRow_altY_selY_hovN A, .GridRow_altN_selY_hovY A { color: White; }
/* TD borders in rows */
.GridRow_altY_selY_hovY TD, .GridRow_altN_selN_hovN TD, .GridRow_altN_selN_hovY TD, .GridRow_altN_selY_hovN TD, .GridRow_altY_selN_hovN TD, .GridRow_altY_selN_hovY TD, .GridRow_altY_selY_hovN TD, .GridRow_altN_selY_hovY TD { border-right: 1px solid #edf1f5; }

/* movable dialog */
.dlg_div { position: absolute; background-color: Transparent; margin: 0; padding: 0; }
.dlg_body { background: #225589 url(/nPortal/img/popback2.png) repeat-x; padding: 5px 0 0 0; width: 100%; height: 100%; overflow:hidden;}
.dlg_body_main { width: 100%; margin: 0; padding: 10px 15px 0px 15px; background: #225589 url(/nPortal/img/popback.png) repeat-x; cursor: move; }
.dlg_body_main TD { margin: 0px; padding: 0px; vertical-align: middle; }
.dlg_body_main h1 { margin: 0px; padding: 10px; vertical-align: middle; }
.dlg_header { cursor: move; }
.dlg_separator { color: #FFFFFF; }
.dlg_header H1 { margin-top: -10px; margin-left: -10px; color: White; }
.dlg_header A { float: right; }
.dlg_header A IMG { margin-top: -10px; margin-right: -5px; }
.dlg_status, .dlg_status_modal { text-align: center; padding:5px 0 0 0; margin: 0; }
.dlg_status { color: White; }
.dlg_status_modal{ color: dimGray; }
.dlg_extra, .dlg_extra2 { padding: 5px 0 5px 0; }
.dlg_extra a, .dlg_extra2 a { font-size:10px; }
.dlg_extra a { color:#e3e3e3; }
.dlg_iframe { padding: 0; margin: 0; border: none 0; overflow: hidden; }
.notes_iframe { padding: 0; margin: 0; border: none 0; width: 100%; height: 100%;}
.notes_background { background-color: #bfdbf4; }
.scroll_background, .scroll_background2 { background-color: #BFDBF4; padding:10px;}
/*.scroll_background table tr td {background-color:#bfdbf4;}*/

table.ms_calendar{border:solid 0;}
table.ms_calendar td {padding: 3px 8px 3px 8px;}
table.ms_calendar .day_header {padding: 5px;font-size:12px;}
table.ms_calendar .today {background-color:#FFFFFF; color:navy; border:solid 1px red;}

/* grey to yellow background change on hover */
a.a_around_grey_div       div{background-color:#EEEEEE;}
a.a_around_grey_div:hover div{background-color:yellow; }

/* info */
.warning {color: #000000;padding: 5px;text-align: left;background-color: #FFFFAA;border: 1px solid Red;}
.portal_msg {margin:10px 10px 0 10px;display:none;padding:10px 5px 9px 10px;text-align:center;vertical-align:middle;font-size:medium;color:navy;font-weight:bold;}
.information {color: #000000;padding: 5px;text-align: left;background-color: #EEEEEE;border: 1px solid DimGray;}
.information tr td {background-color: #EEEEEE;}
.information ul{margin-left:15px;}
.watermark { color: #B4B4B4; font-weight:lighter;  }   

/* help */
ul.help {margin:5px 0 0 20px;}
ul.help li.hide {display:none;}
ul.help li {margin-top:5px;}

div.dlg_spinner{top:0;left:0;position:fixed;width:100%;height:100%;z-index:1000;padding:0px;filter:alpha(opacity=20);opacity:.2;background:#333333 url('/nPortal/img/ajax-loader66.gif') no-repeat center;}
div.modal_bkg{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10;padding: 0px;filter:alpha(opacity=50);opacity:.5;background:#333333;}
table.modal_bkg {position:fixed;top:0;left:0;height:100%;width:100%;z-index:11;}
table.modal_bkg tr td {text-align:center;vertical-align:middle;}
/* Modal dialog IFRAME - viewport safety net.
   portal.modal_dlg.apply_size() is what normally keeps the dialog inside the viewport and turns on
   internal scrolling when it clamps. This rule is the backstop for any code path that writes a
   height/width onto the IFRAME without going through it: the overlay above is position:fixed, so
   an over-tall dialog is painted off-screen with no page scrollbar to reach it. The subtracted
   values cover the dialog chrome (dlg_body_main + white_boxMain padding, trailing <br/>) plus the
   same 16px margin apply_size() leaves. */
#dlg_ifrm_modal2 { max-height: calc(100vh - 76px); max-width: calc(100vw - 56px); }
div.pctTrue, div.pct1{background-image:url('/nPortal/img/check-yes.png');background-position:center;background-repeat:no-repeat;}
div.pctFalse, div.pct0{background-image:url('/nPortal/img/check-no.png');background-position:center;background-repeat:no-repeat;}

/* overwrites*/
.bkg_white {background-color:White;}
.bkg_blue1 {background-color:#DEEDFA;} /*light blue*/

/* round corners */
.round_border_tr5 {border-top-right-radius: 5px;}
.round_border_tl5 {border-top-left-radius: 5px;}
.round_border_br5 {border-bottom-right-radius: 5px;}
.round_border_bl5 {border-bottom-left-radius: 5px;}      
.round_border_5   {border-radius: 5px;}

.round_border_tr8 {border-top-right-radius: 8px;}
.round_border_tl8 {border-top-left-radius: 8px;}
.round_border_br8 {border-bottom-right-radius: 8px;}
.round_border_bl8 {border-bottom-left-radius: 8px;}      
.round_border_8   {border-radius: 8px;}

.round_border_tr10 {border-top-right-radius: 10px;}
.round_border_tl10 {border-top-left-radius: 10px;}
.round_border_br10 {border-bottom-right-radius: 10px;}
.round_border_bl10 {border-bottom-left-radius: 10px;}
.round_border_10   {border-radius: 10px;}

.round_border_tr5 {border-top-right-radius: 5px;}
.round_border_tl5 {border-top-left-radius: 5px;}
.round_border_br5 {border-bottom-right-radius: 5px;}
.round_border_bl5 {border-bottom-left-radius: 5px;}      

.round_border_tr15 {border-top-right-radius: 15px;}
.round_border_tl15 {border-top-left-radius: 15px;}
.round_border_br15 {border-bottom-right-radius: 15px;}
.round_border_bl15 {border-bottom-left-radius: 15px;}      
.round_border_15   {border-radius: 15px;}

.round_border_tr20 {border-top-right-radius: 20px;}
.round_border_tl20 {border-top-left-radius: 20px;}
.round_border_br20 {border-bottom-right-radius: 20px;}
.round_border_bl20 {border-bottom-left-radius: 20px;}      
.round_border_20   {border-radius: 20px;}

a.button {text-decoration:none;font-weight:normal;}

.button {
  display: inline-block;
  vertical-align: top;
  position: relative;
  overflow: hidden;
  line-height: 25px;
  padding: 0 14px;
  font-size: 12px;
  font-family: "Lucida Grande" , Lucida, Verdana, sans-serif;
  font-style:normal;
  color: white;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 1px #154c86;
  background-color: #247edd;
  background-clip: padding-box;
  border: 1px solid;
  border-color: #1c65b2 #18589c #18589c;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.4), 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0) 50%, rgba(0, 0, 0, 0.12) 51%, rgba(0, 0, 0, 0.04));
}
.button:before {
  content: '';
  position: absolute;
  top: -25%;
  bottom: -25%;
  left: -20%;
  right: -20%;
  border-radius: 50%;
  background: transparent;
  -webkit-box-shadow: inset 0 0 38px rgba(255, 255, 255, 0.5);
  box-shadow: inset 0 0 38px rgba(255, 255, 255, 0.5);
}
.button:hover {
  background-color: #1a74d3; color:white;text-decoration:none;
}
.button:active {
  color: rgba(255, 255, 255, 0.9);
  text-shadow: 0 -1px #154c86;
  background: #1f71c8;
  border-color: #113f70 #154c86 #1c65b2;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.4);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.4);
  background-image: -webkit-linear-gradient(top, #1a5da5, #3a8be0);
  background-image: -moz-linear-gradient(top, #1a5da5, #3a8be0);
  background-image: -o-linear-gradient(top, #1a5da5, #3a8be0);
  background-image: linear-gradient(to bottom, #1a5da5, #3a8be0);
}
.button:active:before {
  top: -50%;
  bottom: -125%;
  left: -15%;
  right: -15%;
  -webkit-box-shadow: inset 0 0 96px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 0 96px rgba(0, 0, 0, 0.2);
}

.button-green {
  text-shadow: 0 1px #0d4d09;
  background-color: #1ca913;
  border-color: #147b0e #11640b #11640b;
}
.button-green:hover {
  background-color: #159b0d;
}
.button-green:active {
  text-shadow: 0 -1px #0d4d09;
  background: #189210;
  border-color: #093606 #0d4d09 #147b0e;
  background-image: -webkit-linear-gradient(top, #126d0c, #20c016);
  background-image: -moz-linear-gradient(top, #126d0c, #20c016);
  background-image: -o-linear-gradient(top, #126d0c, #20c016);
  background-image: linear-gradient(to bottom, #126d0c, #20c016);
}

.button-red {
  text-shadow: 0 1px #72100d;
  background-color: #cd1d18;
  border-color: #9f1713 #891310 #891310;
}
.button-red:hover {
  background-color: #c01511;
}
.button-red:active {
  text-shadow: 0 -1px #72100d;
  background: #b61a15;
  border-color: #5b0d0b #72100d #9f1713;
  background-image: -webkit-linear-gradient(top, #921511, #e4201b);
  background-image: -moz-linear-gradient(top, #921511, #e4201b);
  background-image: -o-linear-gradient(top, #921511, #e4201b);
  background-image: linear-gradient(to bottom, #921511, #e4201b);
}
