@media screen
{

.icon-lt {
	margin-right: 10px !important;
}

.icon-rt {
	margin-left: 10px !important;
}
body { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #333333; background-color: White; width: 765px; margin: 0px; }

a, a:link, a:visited { color: #0066D4; }

table { width: 100%; }

hr { color: #DEE5EF; background-color: #DEE5EF; height: 2px; border: none; }

span { vertical-align: baseline; }

sup { font-weight: normal; font-size: x-small; }

input[type="checkbox"] { margin-left: 0px; }

.CheckBox { margin-left: 0px; margin-right: 0px; }

#header{ padding: 0px; margin: 0px 0px 5px 0px; height: 115px; width: 100%; background: none; border-bottom: #E5ECF4 1px solid;}

#header2{ padding: 0px; margin: 0px; width: 100%; height: 115px; background-image: url("images/Self_Service_Header_Green_Image.png"); background-repeat: no-repeat;}

/* Menu */

#headerMenu
{
    position: absolute;
    top: 64px;
    left: 0px;
    width: 200px;
    z-index: 999;
}

.rounded-corners {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px !important;
    padding-right:7px;
    padding-left:7px;   
}

.menuTab
{
    -webkit-border-radius: 10px 10px 0px 0px;
    -moz-border-radius: 10px 10px 0px 0px;
    -khtml-border-radius: 10px 10px 0px 0px;
    border-radius: 10px 10px 0px 0px;
}

.menuDropDown
{
    font-size: 12px;
}

.menuDropDown, .staticMenuItem, .dynamicMenuItem
{
    list-style: none;
    margin: 0;
    padding: 0;
}

.staticMenuItem
{
    display: block;
    line-height: 1.45em;
    margin: 5px 7px 5px 7px;
    border-style: none;
    border-width: 1px 1px 1px 0;
    border-color: white #D9D9D9 #D9D9D9;
    background-color: #0094C7;
    font-weight: bold;
}

.dynamicMenuItem
{
    display: block;
    float: none;
    font-weight: normal;
    vertical-align: middle;
    padding: 7px 10px;
    border-style: none;
    border-width: 1px 1px 1px 0;
    border-color: white #D9D9D9 #D9D9D9;
    background-color: #0094C7;
}

.menuDropDown a:link, .menuDropDown a:visited
{
    text-decoration: none;
    color: White;
}

.dynamicMenuItem a:link, .dynamicMenuItem a:visited 
{
    cursor: auto;
    color: White;
    background-color: Transparent;
}

.menuDropDown .hover, .dynamicMenuItem:hover
{
    background-color: #036;
    position: relative;
    z-index: 599;
    cursor: auto;
}

/* End Menu */

/* Footer */

#footer 
{
    background-image: url("images/footer_bg.jpg");
    float: left;
    border-top: #E5ECF4 1px solid;
    margin-left: 5px;
    margin-top: 35px;
    padding: 12px 12px 40px 5px;
    font-style: normal;
    font-size: 10px;
    color: #999;
}

#footer table
{
    width: 100%; 
    vertical-align: top;    
}

#footer td
{
    vertical-align: top;
    border-left: 1px solid #DEE5EF; 
    padding-left: 10px;
    font-style: normal;
    font-size: 10px;
}

#footer td#col1
{
    border-left-style: none;
    padding-left: 0px;    
    width: 23%;
}

#footer td#col2
{
    width: 60%;
}

#footer td#col3
{
    width: 21%;
}

#footer a
{
    text-decoration: none;
    color: #999;   
}

#footer ul
{
    margin: 0;
    padding: 0;
}

#footer ul li 
{
    padding: 0px;
    margin: 0px 0px 2px 0px;
    list-style: none;
}

#footer ul li.header
{
    font-weight: bold;
    cursor: default;
}

#footer ul li.separator
{
    padding-top: 5px;    
}

a.logosprite
{
    display: block;
    background: url("images/TransparentDPASLogo.png") no-repeat;
    width: 50px;
    height: 60px;
}

#copyright
{
    margin: 10px 0px 0px 0px;
    text-align: center;
}

/* End Footer */

#container { margin: 5px 0px 0px 5px; clear: both; }

#container2 { position: relative; margin: 0px 0px 0px 5px; }

#leftcol { position: absolute; top: 0px; left: 0px; width: 162px; height: 401px; background-image: url("images/Navigation.bmp"); background-repeat: no-repeat; }

#centercol { position: absolute; left: 162px; width: 603px; }

#breadcrumb
{
    position: absolute;
    left: 290px;
    font-size: 10px;  
}

#siteMessage, #errors
{
	padding-left: 7px;
	clear: both;
}

#centercolcontent { padding: 0px 0px 5px 7px; font-family: Arial, Helvetica, sans-serif; /*font attributes are redeclared because of ajax tabs */ font-size: 12px; color: #333333; background-color: White; }

.pageTitle { font-size: 20px; font-weight: bold; margin: 0px; padding: 0px 0px 0px 0px; font-style: normal; text-decoration: none; font-family: inherit; }

#centercolcontent .pagetitle { font-size: 20px; font-weight: bold; padding: 0px; }

#centercolcontent .pageinfo { padding-left: 10px; width: 75%; }

#centercolcontent #header { text-align: right; margin: 0px; padding: 5px 0px 5px 0px; height: auto; }

div.contentheader { text-align: right; }

#centercolcontent .section { margin: 0px 0px 0px 0px; }

#centercolcontent .section .sectionheader { padding: 3px 10px 3px 10px; background-color: #DEE5EF; font-weight: bold; border: solid 1px #DEE5EF; }

#centercolcontent .section .sectioninfo { padding-left: 10px; padding-right: 10px; }

#centercolcontent .section .sectionbody { border: solid 1px #DEE5EF; padding: 5px 0px 5px 0px; }

.sectionbody div.sectionBodyData { padding: 3px 10px 3px 10px; }

.sectionHeaderLight { font-family: Arial, sans-serif; font-size: 14px; text-align: left; font-weight: bold; }

table.sectionBodyData td, table.sectionBodyData th, .sectionbody table.sectionBodyData td, .sectionbody table.sectionBodyData th { padding: 3px 10px 3px 10px; font-size: 12px;}

.sectionbody { border: solid 1px #DEE5EF; padding: 5px 0px 5px 0px; }

.sectionBodyData .ajax__calendar_container table th, .sectionBodyData .ajax__calendar_container table td, table.inputFormData .ajax__calendar_container table th, table.inputFormData .ajax__calendar_container table td { padding: 0px; }

.section .sectionContainer { padding-top: 0px; }

table.sectionBodyData tr.spacer, table.sectionBodyData tr.spacer td { margin: 0px; padding: 0px; }

table.sectionBodyData tr.headerrow th { background-color: #DEE5EF; text-align: left; }

table.sectionBodyData td.dataContent { padding: 3px 3px 3px 10px; }

table.sectionBodyData td.validation { padding: 3px 3px 3px 3px; width: 5px; }

table.spacer > tr { padding-bottom : 10px;}

#centercolcontent .section .sectionfooter { padding: 15px 0px 0px 10px; }

#centercolcontent .section table.sectionHeaderInfo td { padding: 0px 10px 3px 10px; }

.small { font-size: 11px; }

.smallText { width: 75px; }

.smallTextAmount { width: 75px; text-align: right; }

.x-smallText { width: 50px; }

.dateText { width: 63px; }

.x-smallTextAmount { width: 50px; text-align: right; }

.xx-smallText { width: 35px; }

.mediumText { width: 100px; }

.mediumTextAmount { width: 100px; text-align: right; }

.largeText { width: 150px; }

.x-largeText { width: 175px; }

.normalText { width: 126px; }

.spacer { margin-top: 10px; }

a.info, a.info:link, a.info:visited { font-size: 10px; text-decoration: none; }

a.small, a.small:link, a.small:visited { font-size: 11px; text-decoration: none; }

td.note { color: #666666; font-size: 10px; padding-top: 0px; }

span.note { color: #666666; font-size: xx-small; }

span.blueText, .blueText { color: #00A7D4; font-weight: bold; }

td.imgRight { border-left: dashed 2px #DEE5EF; padding-left: 10px; }

.row td, .oddrow td, .alternatingrow td, .headerrow th, table.view td, table.view th { padding: 3px 10px 3px 10px; vertical-align: top; text-align: left; border-color: #DEE5EF; }
.row td.amount, .alternatingrow td.amount { padding: 3px 10px 3px 10px; vertical-align: top; text-align: right; border-color: #DEE5EF;}

.separaterow td { border-top: dashed 1px #DEE5EF; margin: 0px 3px 0px 3px; }

.headerrow th a:hover { text-decoration: underline; color: #2866FA; }

.headerrow th a, .headerrow th a:visited, .headerrow th a:link, .headerrow th a:active, .headerrow th a:hover { text-decoration: underline; color: #2866AF; }

.pagerrow, .pagerrow td { text-align: left; }

.pagerrow table { width: auto; }

.detailsrow td { padding: 3px 10px 3px 10px; }

table.inputForm, div.inputForm { padding: 0px; }

table.inputForm td { padding: 0px; }

.inputForm table.inputFormData td { padding: 3px 10px 3px 10px; }

table.inputFormData table.summaryData td, table.inputFormData table.summaryData th, table.summaryData td, table.summaryData th { padding: 3px 10px 3px 0px; }

table.summaryData td.primaryContact td { padding: 0px; vertical-align: top; }

div.sectionbody table.summaryData { padding: 0px 0px 0px 10px; }

table.summaryData th { text-decoration: underline; font-weight: bold; }

td.primaryContact td { padding: 3px; }

.editrow td { padding: 10px 10px 10px 10px; vertical-align: top; }

table.defaultTable { }

.defaultTable td, .defaultTable th, .sectionBodyData table.defaultTable td, .sectionBodyData table.defaultTable th { padding: 0px; vertical-align: top; }

table.sectionBodyData table.colTable td { padding-left: 0px; vertical-align: top; }

.inlineEdit td { padding: 0px 5px 5px 0px; }

table.view { border-color: #DEE5EF; border-width: 1px; border-style: solid; border-collapse: collapse; }

table.view tr.headerrow { background-color: #F5F6FA; }

table.view tr.footerrow, table.summaryData tr.footerrow { font-weight: bold; }

table.seminars td { padding: 3px 10px 30x 0px; vertical-align: top; }

.date { padding-left: 1em; }

.date .month { background: #029FE0; color: White; padding: 2px 0px 1px 0px; width: 34px; }

.date .day { background: white; border: solid 1px #029FE0; border-top: none; color: #999999; font-size: 1.5em; line-height: 1; padding: 2px 0px 1px 0px; width: 32px; }

.date .month, .date .day { font-weight: bold; text-align: center; text-transform: uppercase; }

table.defaultGrid { border-collapse: collapse; border: solid 1px #DEE5EF; border-spacing: 0px 0px; }

table.defaultGrid td, table.defaultGrid th { padding: 3px 10px 3px 10px; vertical-align: top; }

table.defaultGrid th { background-color: #F5F6FA; text-align: left; font-size: 12px;}

.gridList .row .colLeft, .gridList .alternatingrow .colLeft, .gridList .headerrow .colLeft, .gridList .footerrow .colLeft { padding-left: 0px; }

.gridList .row .colRight, .gridList .alternatingrow .colRight { border-style: none; }

table.sickLeaveEstimate { padding: 5px 0px 5px 0px; border-collapse: collapse; border-style: none; border-bottom: solid 1px #DEE5EF; }

table.sickLeaveEstimate td { padding: 3px 10px 3px 0px; border-style: none; border-bottom: solid 1px #DEE5EF; }

table.sickLeaveEstimate th { background-color: #F5F6FA; border-style: none; border-bottom: solid 1px #DEE5EF; }

table.sickLeaveEstimate th.colBigHeader { font-size: 14px; font-weight: bold; padding-left: 0px; text-align: left; background-color: White; }

table.sickLeaveEstimate th.headerText { border: solid 1px #DEE5EF; text-align: center; }

table.sickLeaveEstimate th.colOperation { background-color: White; }

table.sickLeaveEstimate td.colOperation { background-color: White; text-align: right; font-size: smaller; }

table.sickLeaveEstimate td.sickLeaveEstimateTextCell { text-align: right; background-color: #F2F2F2; border: solid 1px #DEE5EF; }

table.sickLeaveEstimate td.spacer { border-right: solid 1px #DEE5EF; }

table.sickLeaveEstimate th.spacer { background-color: White; border-style: none; border-right: solid 1px #DEE5EF; }

.imageStep { float: left; padding-right: 10px; padding-bottom: 10px; }

.amountField { text-align: right; }

a.goto, a.goto:link, a.goto:visited, span.goto { font-size: 10px; text-decoration: none; vertical-align: top; }

.watermarked { color: #666666; }

/*added to suppress stylesheet in Common.css*/
.AnyDropDown { margin-left: 0px; margin-right: 0px; }

.TextBoxLarge { width: auto; height: auto; margin-right: auto; margin-left: auto; text-align: left; }

span.validation { padding: 0px 3px 0px 3px; width: 2px; display: inline-block; }

label.required, td.validation label.required { color: Red; }

div.importantInfo { border: 1px solid #f99; margin-top: 8px; margin-bottom: 10px; }

div.importantInfo p { margin-top: 15px; margin-bottom: 15px; padding-left: 10px; padding-right: 10px; font-weight: bold; color: red; font-size: 13px; }

label
{
    cursor: default;
}

li 
{
    display: list-item;
}

.sectiontitle
{
    padding: 6px 6px 6px 3px;
    background-color: #DEE5EF; 
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

/* Login */

#loginContainer
{
    float: left;    
}

#loginContainer #loginControl
{
    float: left;
    width: 245px;
}

#loginContainer #info
{
    float: left;
    margin-left: 10px;
    margin-top: 15px;
    display: inline;
}

.loginbox
{
    background-color: #C6DCDF;
    margin: 15px 0px 0px 0px;
    padding: 0px;
    position: relative;
    display: block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
    border: 0px;
    width: 244px;
}

.loginbox h3 
{
    color: white;
    background: #0178B0 url("images/icon_padlock.gif") 10px 8px no-repeat;
    line-height: 32px;
    height: 29px;
    font-size: 14px;
    font-weight: bold;
    padding: 0px 0px 0px 28px;
    margin: 0px;
    border: 0px;
    border-left: 1px solid #4B75A5;
    border-right: 1px solid #4B75A5;
    text-transform: capitalize;
}

.loginbox .logincontent, .loginbox label, .loginbox fieldset 
{
    border: none;
    display: block;
    margin: 0px;
    padding: 0px;
}

.loginbox .logincontent
{
    border-top: 1px solid #4B75A5;
    border-right: 1px solid #4B75A5;
    border-left: 1px solid #4B75A5;
}

.loginbox fieldset 
{
    padding-left: 9px;
    padding-right: 9px;
}

.loginbox label
{
    font-size: 12px;
    margin: 0px;   
}

.loginbox label.username, .loginbox label.password
{
    margin-top: 8px;
}

.loginbox input[type="text"], .loginbox input[type="password"]
{
    border: 1px solid #A4B97F;
    background-color: white;
    padding: 1px 3px;
    width: 124px;
    color: #333;
    margin: 0px 0px 0px 0px;
    font-size: 11px;
}

.loginbox input[type="submit"].submit
{
    margin: 8px 0px 4px 2px;
    display: block;
}

.loginbox ul 
{
    padding: 0px 0px 0px 3px;
    margin: 0px;
    list-style-type: none;
    display: block;
}

.loginbox fieldset ul.register
{
    padding-left: 0px;
}

.loginbox fieldset ul.register li
{
    padding-left: 3px;
}

.loginbox fieldset ul.register li.note
{
    padding-left: 0px;
    border-left-style: none;
}

label.note
{
    font-size: 11px;
}

.loginbox fieldset ul.forgotlinks 
{
    padding-top: 7px;
    padding-bottom: 7px;
}

.loginbox fieldset li {
    border-left: 1px solid #488898;
    display: inline;
    padding: 0;
    margin: 0;
    margin-left: 2px;
    padding-left: 5px;
}

.loginbox li.first 
{
    border-left: none;
    margin: 0px;
    padding: 0px;
}

.loginbox a, .loginbox a:link 
{
    color: #2866AF;
    text-decoration: underline;
    cursor: pointer;
    outline: none;
}

.loginbox label#note
{
    padding-left: 8px;
    padding-bottom: 5px;
    font-size: 11px;
    margin-top: -3px;
    border-left: 1px solid #4B75A5;
    border-right: 1px solid #4B75A5;
}

.loginbox .altlinks 
{
    background-color: #0178B0;
    padding: 0px;
    padding-left: 9px;
    padding-top: 4px;
    margin: 0px;
    height: 40px;
    position: relative;
}

.loginbox .altlinks ul 
{
    position: relative;
    padding: 0;
    margin: 0;
    margin-left: 4px;
    bottom: 4px;
}

.loginbox .altlinks li 
{
    margin: 2px 0px;
}

.loginbox .altlinks ul a, .loginbox .altlinks ul a:link 
{
    color: #EEF7F9;
    text-decoration: underline;
    cursor: pointer;
    outline: none;
}

/* End Login */

/* Login View */

div.loginViewContainer
{
    float: right;
    color: #333;
    font: normal normal normal 10px arial;
    text-transform: capitalize;
    padding: 5px 0px 0px 0px;
}

.loginViewContainer *
{
    box-sizing: content-box;
}

div.loginViewContainer #anonymousLogin
{
	padding-right: 10px;	
	text-transform: none;
}

div.loginView 
{
    height: 68px;
    width: 270px;
    background: transparent url("images/loginView.gif") no-repeat;
    padding: 5px 3px 5px 10px;
    line-height: 1.25em;
    text-align: left;
    position: relative;
    text-transform: capitalize;
}

div.loginView #loginHeader
{
}

div.loginView #loginHeader .appTitle
{
    font-weight: bold;
    padding-left: 13px;
    color: #003A6F;        
}

div.loginView #loginHeader .loginName
{
    padding-bottom: 3px;
    font-size: 10px;
    font-weight: bold;
    word-wrap: break-word;
}

div.loginView #loginControl
{
    float: right;
    padding-right: 10px;
}

div.loginView #loginControl input[type="submit"]
{
    font-size: 10px;    
}

div.loginView #loginBody
{
    clear: both;
}

div.loginView #loginBody select
{
    margin: 0;
}

div.loginView #loginFooter
{
	font-size: 10px;
    position: absolute;
    bottom: 0;
    margin-bottom: 3px;
}

div.loginView #loginFooter a
{
	text-decoration: none;
}

div.loginView #loginFooter #siteHelp
{
	position: absolute;
	left: 210px;
	width: 250px;
}

/* End Login View */

/* Bubble */

.bubble 
{
    width: 288px;
    margin-left: 7px;
}

.bubbleBottom
{
    background: url("images/bubbleBottom.gif") 0 100% no-repeat;
}

.bubblePointer
{
    background: url("images/bubblePointer.gif") 0 0 no-repeat;
    min-height: 60px;
    padding: 10px 15px 15px 15px;
}

.bubblePointer ul
{
    padding-left: 30px;
}

/* End Bubble */

/* Banner */

.bannerBox
{
    border: 1px solid #DEE5EF;
    padding: 12px;
    margin-bottom: 10px;
    background-image: url("images/banner_bg.gif");
    background-repeat: repeat-x;
}

#loginContainer #banner 
{
    width: 200px;
    right: 0px;
    position: absolute;
    padding-top: 15px;
}

.bannerBox .center
{
    padding: 0;
    text-align: center;    
}

.bannerBox h2
{
    margin: 0px 0px 5px 0px;
    padding: 0;
    color: #ff7200;
}

.bannerBox .separator
{
    border-top: dotted 1px #DEE5EF;
    padding: 5px 0px 5px 0px;
}

.bannerBox .bannerContent
{
    position: relative;
    margin: 0;
    padding: 5px 0 0 0;
}

.bannerBox .bannerContent ul 
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: relative;
}

#loginContainer #banner .bannerBox .bannerContent ul 
{
    text-align: left;
}

.bannerBox .bannerContent li 
{
    background-image: url("images/calculator.gif");
    background-position: left;
    background-repeat: no-repeat;
    padding: 8px 0px 4px 15px;
    display: block;
    border-top: 1px dotted #DEE5EF;
}

.bannerBox .bannerContent li a
{
    text-decoration: none;
}

.bannerBox .bannerContent li.first 
{
    border-top-style: none;
}

/* End Banner */

#helpNow
{
    position: absolute;
    left: 430px;
    display: block;
    background: url("images/HelpNow.gif") no-repeat;
    width: 80px;
    height: 25px;
}

#formsContainer
{
	float: right;
}

#formsContainer select
{
	width: 150px;
	z-index: 1;
}

table.estimateData
{
    padding: 5px 0px 5px 0px;
    border-collapse: collapse;
    border-style: none;
    border-bottom: solid 1px #DEE5EF;
}

table.estimateData td
{
    padding: 3px 10px 3px 0px;
    border-style: none;
    border-bottom: solid 1px #DEE5EF;
}

table.estimateData th
{
    background-color: #F5F6FA;
    border-style: none;
    border-bottom: solid 1px #DEE5EF;
}

table.estimateData th.colBigHeader
{
    font-size: 14px;
    font-weight: bold;
    padding-left: 0px;
    text-align: left;
    background-color: White;
}

table.estimateData th.headerText
{
    border: solid 1px #DEE5EF;
}

table.estimateData th.colOperation
{
    background-color: White;
}

table.estimateData td.colOperation
{
    background-color: White;
    text-align: right;    
    font-size: smaller;
}

table.estimateData td.estimateDataTextCell
{
	text-align:right;
	background-color: #F2F2F2;
    border: solid 1px #DEE5EF;
}

table.estimateData td.spacer
{
    border-right: solid 1px #DEE5EF;
}

table.estimateData th.spacer
{
    background-color: White;
    border-style: none;
    border-right: solid 1px #DEE5EF;
}

.numcurrencyAlign{
    text-align: right !important 
}

table td .HeaderLeabelAlignment{
    vertical-align : top
}

.LabelValueTextAlignment{
    display : inline-block
}

.LabelValueTextAlignment{
    display : inline-block
}

    .statusItem {
        background: url(tr.gif) 100% 0 no-repeat grey;
        font-size: larger;
        font-weight: bold;
        color: White;
        width: 100px;
        border-radius: 10px;
        height: 60px;
        vertical-align: middle;
        display: inline-block;
        line-height: 60px;
    }

.statusItem.green
    {
        background: url(bl.gif) 0 100% no-repeat Green !important ;
    }
    
.statusItem.grey
    {
        background: url(bl.gif) 0 100% no-repeat Grey!important ;
    }
    
.statusItem.blue
    {
        background: url(bl.gif) 0 100% no-repeat Blue !important ;
    }

.dataGridNoBorders table tr td{
    border-collapse : collapse !important ;
    border-style : none !important ;
    border-width : 0px !important ;
    background-color : white !important;
    padding : 0px 0px 0px 10px !important;
   
}

}

 #printable { display: none; }     
   @media print    
    {         #non-printable { display: none; }        
              
               #printable { display: block; }    
                            
    } 

   table.table tbody tr.row-group-header, table.table tbody tr.row-group-summary {
	background-color: #f9f9f9;
	font-weight: bold;
	font-size: larger;
	vertical-align: middle;
}

table.table tbody tr.row-general-summary {
	background-color: #e9e9e9;
}

	table.table tbody tr.row-general-summary td {
		vertical-align: middle;
	}

    .scrollableGridWrapper {
    overflow: auto;
    margin: auto;
}