





body {
   background-color:#ffffff;
   margin:0px;
   padding:0px;
}

body,td,p {
   color:#000000;
}
h1,h2,h3,h4{   
   margin:5px 0px 10px 0px;
   color:#000000;
   vertical-align:middle;
}


hr {
   border:0px;
   height:1px;
   overflow:hidden;
   color:#cccccc;
   background-color:#cccccc;
   margin: 0 5px 5px 5px;
}


* html hr {
   margin-top:-5px;
   position:relative;
   top:5px;
}


.hv {
   float:right;
   direction:ltr;
   margin: 0 4px 8px 8px;
   height: 16px;
   width: 4px;
   background-image:url(divider.gif);
   cursor: default;
}



form {
   display:inline;
}

input.mini {
   width:50px;
   border: 1px solid #6699cc;
   padding-left: 2px;
}

input.miniError {
   width:50px;
   border: 2px solid red;
   padding-left: 2px;
}

input.small {
   width:100px;
   border: 1px solid #6699cc;
   padding-left: 2px;
}

input.smallError {
   width:100px;
   border: 2px solid red;
   padding-left: 2px;
}

select.medium {
   width:145px;
}

input.medium {
   width:145px;
   border: 1px solid #6699cc;
   padding-left: 2px;
}

input.mediumError {
   width:145px;
   border: 2px solid red;
   padding-left: 2px;
}

input.large {
   width:200px;
   border: 1px solid #6699cc;
   padding-left: 2px;
}

input.largeError {
   width:200px;
   border: 2px solid red;
   padding-left: 2px;
}

input.xlarge {
   width:300px;
   border: 1px solid #6699cc;
   padding-left: 2px;
}

input.xlargeError {
   width:300px;
   border: 2px solid red;
   padding-left: 2px;
}

input.xxlarge {
   width:400px;
   border: 1px solid #6699cc;
   padding-left: 2px;
   padding-right: 10px;
}

input.xxlargeError {
   width:400px;
   border: 2px solid red;
   padding-left: 2px;
   padding-right: 10px;
}

option {
   overflow: visible;
   clip: auto;
}

div.clearFloats {
   clear:both;
   height:1px;
   overflow:hidden;
   margin-bottom:-1px;
}


/* Framework */

.applicationPalette {
   margin: 7px;
}

.leftContentPane {
   border:7px solid #ccc; 
   vertical-align: top;
}

.rightContentPane {
   border-width: 7px 7px 7px 0; 
   border-style: solid; 
   border-color: #cccccc; 
   vertical-align: top; 
   width:100%;
}
.mainRegion {
   padding-top: 5px;
   background-color: #cccccc;
}
.paletteBg {
   padding-top: 11px;
   background-color: #cccccc;
}

.paletteTop h1 {
   margin: 0px !important;
}
.paletteTopButtons {
   margin: 0;
   padding: 6px 8px 0 0;
}
.mainNav {
   width: 214px;
}
#navigationControl {
   padding: 2px;
}
.mainContentArea {
   width: 95%;
}

/* user identification */
div.userId {
   margin:8px 0 8px 15px;
}
td.userId {
   padding: 5px 0 0 15px;
}
td.status {
   text-align: right; 
   padding: 5px 23px 0 0; 
   color: #999999
}


/* Application Masthead */

table.applicationMastheadSmall {
   width: 100%;
}

table.applicationMastheadSmall,
table.applicationMastheadSmall td,
table.applicationMastheadLarge,
table.applicationMastheadLarge td {
   background-color:#4FAF00;
   color:#ffffff;
   vertical-align:top;
}
td.mastheadIcon{
   padding-top:14px;
   padding-left:17px;
}
td.mastheadTitle {
   width:55%;
   padding:16px 0 0 16px;
}
td.medium {
   width:145px;
}

td.large {
   width:30%;
}

table.applicationMastheadLarge td.mastheadIcon {
   padding-top:15px;
   padding-left:17px;
}
table.applicationMastheadLarge td.mastheadTitle {
   padding-top:16px;
   padding-left:16px;
}

td.mastheadTitle h1{
   padding:0px;
   margin:0px;
   padding-right:16px;
   color:#ffffff;
   white-space:nowrap;
}
div.mastheadPhoto {
   background:#fff;
   border-left:7px solid #fff;
   border-right:7px solid #fff;
   width:306px;
   height:57px;
}
td.mastheadLinks {   
   padding-top:16px;
   color:#ffffff;
}
table.applicationMastheadSmall a:link,
table.applicationMastheadSmall a:visited,
table.applicationMastheadSmall a:active,
table.applicationMastheadSmall a:hover,
table.applicationMastheadLarge a:link,
table.applicationMastheadLarge a:visited,
table.applicationMastheadLarge a:active,
table.applicationMastheadLarge a:hover{
   color:#ffffff;
   text-decoration:underline;
}


/* Navigation Control */
#navigationControl {
   margin-top: 2px;
}
div.navigationControlOn,div.navigationControlOff,div.navigationControlHeader {
   background-color:#ffffff;
   padding: 3px 7px 4px 8px;
}

div.navigationControlOn {
   background-color:#99ccff;
}
div.navigationControlOff {
   background-color:#ffffff;
}

div.navigationControlOn a:link,div.navigationControlOn a:visited,div.navigationControlOn a:active {
   text-decoration:none;
   color:#000000;
}
div.navigationControlOff a:link,div.navigationControlOff a:visited,div.navigationControlOff a:active {
   text-decoration:none;
   color:#003399;
}
div.navigationControlOn a:hover {
   text-decoration:underline;
   color:#000000;
}
div.navigationControlOff a:hover {
   text-decoration:underline;
   color:#003399;
}
div.navigationControlSpacer {
   height:5px;
   overflow:hidden;
}
div.navigationControlIcon {
   float:left;
   clear:both;
   margin-top:2px;
   padding-left:2px;
}

/* links */
a:link, a:visited, a:active, a:hover {
   color:#003399;
   text-decoration:none;
}
a:hover {
   text-decoration:underline;
}


/* Tabs */
div.tabSet, div.secondaryTabSet {
   
}
div.tabSet {
   background-image:url(tab_set_bg.gif);
}
* html div.tabSet, * html {
   
}
div.tabOff {
/* background color and background image are a part of the theme css */
   background-color:#86BB5B;
   background-image:url(tab_right.gif);
   background-position:top right;
   background-repeat:no-repeat;
   color:#ffffff;
   padding:2px 13px 4px 10px;
   border-bottom:2px solid #fff;
   border-right:2px solid #fff;
   cursor:pointer;
}
div.tabOn {
   background-color:#cccccc;
   color:#333333;
   padding:2px 13px 6px 10px;
   border-right:3px solid #fff;
}
div.tabOff a:link,
div.tabOff a:visited,
div.tabOff a:active,
div.tabOff a:hover{
   color:#ffffff;
   text-decoration:none;
}
div.tabOn a:link,
div.tabOn a:active,
div.tabOn a:visited,
div.tabOn a:hover{
   color:#333333;
   text-decoration:none;
}
div.secondaryTabSet div.tabOn{
   background-color:#ffffff;
   border-right:3px solid #cccccc;
}
div.tabBottomLine {  
   clear:both;
   height:3px;
   overflow:hidden;
   background-color:#cccccc;
}
div.tabOff {
   min-width:88px;
}
div.tabOn {
   min-width:89px;
}
div.secondaryTabSet div.tabOn{
   min-width:59px;
   padding:1px 13px 5px 10px;
}


/* Command Button */
div.buttonSet {
   float:right;
   margin-bottom:10px;
}

div.bWrapperUp,
div.bWrapperOver,
div.bWrapperDown,
div.bWrapperDisabled {
   float:right;
   direction:ltr;
   margin-left:8px;
   margin-bottom:4px;
}

/* buttonsAreLeftAligned is a modifier class, modifying buttonSet */
div.buttonsAreLeftAligned, 
div.buttonsAreLeftAligned div.bWrapperUp,
div.buttonsAreLeftAligned div.bWrapperOver,
div.buttonsAreLeftAligned div.bWrapperDown,
div.buttonsAreLeftAligned div.bWrapperDisabled {
   text-align:center;
   float:left;
   margin-left:0px;
   margin-right:8px;
}

/* buttonsAreRightAligned is a modifier class, modifying buttonSet */
div.buttonsAreRightAligned, 
div.buttonsAreRightAligned div.bWrapperUp,
div.buttonsAreRightAligned div.bWrapperOver,
div.buttonsAreRightAligned div.bWrapperDown,
div.buttonsAreRightAligned div.bWrapperDisabled {
   float:right;
   margin-left:8px;
   margin-right:0px;
   width:100%;
}


div.verticalButtonSet {
   padding-right:10px;
}
div.verticalButtonSet div.bWrapperUp,
div.verticalButtonSet div.bWrapperOver,
div.verticalButtonSet div.bWrapperDown,
div.verticalButtonSet div.bWrapperDisabled {
   float:none;
   margin-left:0px;
}

/* this position relative css is what turns the three divs into the 3px slant effect */
div.bWrapperUp div,
div.bWrapperOver div,
div.bWrapperDown div,
div.bWrapperDisabled div{
   position:relative;
   left:-1px;
   top:-1px;
}

button.hpButtonSmall,input.hpButtonSmall {
   padding:0px 4px;
   height:19px;
   min-width:19px;
   color: #ffffff; 
}

button.helpButton,input.helpButton {
   padding:0px 3px 0px 2px;
   color: #ffffff; 
}

div.bEmphasized button,
div.bEmphasized input,
div.bEmphasized submit{
   background-color:#336633;
   color:#ffffff;
}

div.bDivider {
   float:right;
   direction:ltr;
   margin: 0 4px 8px 8px;
   height: 16px;
   width: 4px;
   height:19px;
   background-image:url(divider.gif);
   cursor: default;
}
div.bDividerBlank {
   float:right;
   direction:ltr;
   margin: 0 2px 8px 8px;
   height: 16px;
   width: 4px;
}

 
input.hpButton {
   height:19px;
   min-width:95px; 
}

input.hpStdButton {
   height:19px;
   color: #ffffff; 
   min-width:89px;
}

input.hpStdButtonLarge {
   height:19px;
   color: #ffffff; 
   text-align:center;
   min-width:110px;
}

button.hpButton {
   height:19px;
   color: #ffffff; 
   min-width:95px;
}

button.hpStdButton {
   height:19px;
   color: #ffffff; 
   min-width:89px;
}

button.hpStdButtonLarge {
   height:19px;
   color: #ffffff;  
   text-align:center;
   min-width:110px;
}


/* works to eliminate the pushed-in button movement on mozilla, 
at the expense of an extra pixel of button jutting out on the 
left side during the pushed-in state.   
button.hpButton:active,input.hpButton:active {
   margin-left:-1px;
   margin-right:1px;
} */


div.verticalButtonSet {
   padding-left:13px;
}

/* LABEL, TEXT,  NOTES  */
.pad10 {
   padding:10px;
}
.pad6x10 {
   padding:6px 10px;
}
.margin2 {
   margin:2px;
}

/* table cell padding */
table.tablePad3 td {
   vertical-align: top;
   padding-bottom: 3px;
}

td.aln {
  text-indent:-4px;
}

td.tableCellNote {
   padding: 7px 0 9px 0 !important;
}

/* LIST STYLES  */
ul,ol {padding-top:5px;margin-top:0px;padding-bottom:10px;margin-bottom:0px;}
ul ul, ol ol, ul ol, ol ul {padding-top:0px;padding-bottom:10px;margin-top:0px;margin-bottom:0px;}
ul {margin-left: 22px; padding-left: 0px;}
ol {margin-left: 22px; padding-left: 0px;}

          ul li,
      ol ul li,
 ol ul ul li,
 ol ol ul li,
 ul ol ul li
 {
   list-style-image:url(bullet.gif);
   margin-bottom:2px;
}
          ol li,
      ul ol li,
 ul ol ol li,
 ul ul ol li,
 ol ul ol li
{
   list-style-image:none;
}
ol li ol li {
   list-style:lower-alpha;
}
ol li ol li ol li{
   list-style:lower-roman;
}

/*titles and subtitles*/
h1.pageTitle {
   margin-top:11px;
   margin-bottom:8px;
   margin-left:8px;
}
div.pageTitleRightArea {

}
div.subTitleBottomEdge {
   height:3px;
   overflow:hidden;
   background:#484848;
}
div.subTitleIcon {
   float:right;
   margin-top:2px;
}




/* PLS specific styles */


/* supplies */
td.supplyInfo {
  width:350px;
}  

.hpGasGaugeBorder {
  border: 1px solid #000000;
  height:11px;
  padding:0px;
  width:100%;
}

.hpMobileGasGaugeBorder {
  border: 1px solid #FFFFFF;
  height:11px;
  padding:0px;
  width:100%;
}

.SupplyTonerGif { 
   width:10%;
}

a.SupplyLinks { 
   text-decoration:underline;
   color:#003399;
}

/* alert & error box styles */
.alertbox {
   margin-left:auto;
   margin-right:auto;
   margin-top:10px;
   margin-bottom:10px;
   border:7px solid #cccccc; 
   vertical-align:top; 
   padding:15px 10px 0px 15px;
   width:311px;
   height:auto;
   text-align:center;
}

.errorbox {
   margin-left:auto;
   margin-right:auto;
   margin-top:10px;
   margin-bottom:10px;
   border:7px solid #cccccc; 
   vertical-align:top; 
   padding:15px 10px 0px 15px;
   width:311px;
   height:100px;
   text-align:center;
}

.alertboxImage {
   background-image:url(info.gif);
   background-repeat:no-repeat;
   padding:0px 15px 0px 15px;
   width:26px;
   vertical-align:top; 
}

.connectingboxImage {
   background-image:url(loading.gif);
   background-repeat:no-repeat;
   padding:0px 15px 15px 15px;
   width:26px;
   vertical-align:top; 
}

.connectedboxImage {
   background-image:url(CheckMark_20x20.gif);
   background-repeat:no-repeat;
   padding:0px 15px 15px 15px;
   width:26px;
   height:20px;
   vertical-align:top; 
}

.errorboxImage {
   background-image:url(status_critical_15.gif);
   background-repeat:no-repeat;
   padding:0px 15px 0px 15px;
   width:26px;
   vertical-align:top; 
}

.enabledImage {
   background-image:url(status_normal_15.gif);
   background-repeat:no-repeat;
   padding:0px 15px 0px 15px;
   vertical-align:top; 
}

.disabledImage {
   background-image:url(status_critical_15.gif);
   background-repeat:no-repeat;
   padding:0px 15px 0px 15px;
   vertical-align:top; 
}

.en_disabledImageText {
   height:30px;
   padding-left:30px;
   vertical-align:top;
   text-align:left;
}

.alertboxText {
   width:240px;
   height:auto;
   padding-left:30px;
   vertical-align:top; 
   text-align:left;
}

.errorboxText {
   width:240px;
   height:62px;
   padding-left:30px;
   vertical-align:top; 
   text-align:left;
   color:rgb(204,0,0);
}

.alertboxButtons {
   padding:20px 0px 7px 8px;
   float:none;
   margin-left:auto;
   margin-right:auto;
}

img {
   border: none;
}


/* url link styles */
.linkHover a:hover {
   text-decoration:underline;
   color:#003399;
}


/* common widths and heights */
.height100 {
   height:100%;
}
.height462px {
   height:462px;
}
.height135px {
   height:135px;
}
.height250px {
   height:250px;
}
.height117px {
   height:117px;
}
.height100px {
   height:100px;
}
.height30px {
   height:30px;
}
.height60px {
   height:60px;
}
.height50px {
   height:50px;
}
.height2px {
   height:2px;
}
.width600px {
   width:600px;
}
.width560px {
   width:560px;
}
.width350px {
   width:350px;
}
.width325px {
   width:325px;
}
.width235px {
   width:235px;
}
.width170px {
   width:170px;
}
.width150px {
   width:150px;
}
.width100px {
   width:100px;
}
.width90px {
   width:90px;
}
.width50px {
   width:50px;
}
.width40px {
   width:40px;
}
.width20px {
   width:20px;
}
.width10px {
   width:10px;
}
.width100 {
   width:100%;
}
.width80 {
   width:80%;
}
.width75 {
   width:75%;
}
.width65{
   width:65%;
}
.width60 {
   width:60%;
}
.width40 {
   width:40%;
}
.width35 {
   width:35%;
}
.width30 {
   width:30%;
}
.width25 {
   width:25%;
}
.width20 {
   width:20%;
}
.width15 {
   width:15%;
}
.width10 {
   width:10%;
}


/* common aligns */
.valignTop{
  vertical-align:top;
}

.valignMiddle{
  vertical-align:middle;
}

.valignBottom{
  vertical-align:bottom;
}

.alignLeft{
  text-align:left;
}

.alignRight{
  text-align:right;
}

.alignCenter{
  text-align:center;
}

/* common border styles */
.borderRidge {
  border-style:ridge;
}

/* common colors */
.bgcolorEEEEEE {
   background-color:#EEEEEE;
}
.bgcolor003366 {
   background-color:#003366;
}
.bgcolor3366CC{
   background-color:#3366CC;
}
.bordercolor003366{
   border-color:#003366;
}

/* support and supplies common styles */
body.supportAndsupplies
{
  background-color:#FFFFFF;
  color:#000000;
  margin-top:0;
  margin-left:0; 
}

td.suppliesSupportFont a:link,
td.suppliesSupportFont a:active,
td.suppliesSupportCopyrightFont a:link,
td.suppliesSupportCopyrightFont a:active{
  color:#003399;
}

td.suppliesSupportFont a:visited,
td.suppliesSupportCopyrightFont a:visited{
  color:#660066;
}

td.suppliesSupportWhiteFont a:link,
td.suppliesSupportWhiteFont a:active,
td.suppliesSupportWhiteFont a:visited{
  color:#FFFFFF;
}

td.ColorLokFont a:link,
td.ColorLokFont a:active,
td.ColorLokFont a:visited{
  color:#003399;
}


.checkboxIndent {
   margin-left:25px;
}




/*  avoid styling the span tag wrt any font settings.  */
body, th, td, div, p, button, select, input {
   font-family:Arial,sans-serif;
}

body,td,input,button,th,caption {
   font-size:70%;
}
* html body,* html td,* html input,* html button,* html th {
   font-size:67%;
}
select {
   font-size:100%;
}


/*  percentage fonts must be used carefully */
/* for ie we dont want to set body td, body th, back to 100%, as these dont properly inherit from the body in the first place.  */
/*  oddly enough though, td does inherit from div in IE, although not from anything else.*/
div td,body input, body button,
td input, td button, th input, th button, 
body div,body table, body td, body th, body caption{
   font-size:100%;
}

h1 {font-size:180%;font-weight:normal; }
h2 {font-size:170%;font-weight:normal;}
h3 {font-size:150%;}
h4 {font-size:130%;}
h5 {
   margin: 0 0 7px 0;
   font-size:100%;
}

table.applicationMastheadLarge td.mastheadTitle h1 {
   font-size:200%;
}

div.navigationControlHeader {
   font-weight: bold;
}

div.tabOff,div.tabOn {
   float:left;
   text-align:center;
   height:14px;
   font-weight:bold;
   white-space:nowrap;
}

button.hpButtonVerySmall,input.hpButtonVerySmall{
   padding:0px 2px;
   height:11px;
   font-size:9px;
   color: #ffffff; 
}

button.hpButton,
button.hpStdButton,
button.hpStdButtonLarge,
button.hpButtonSmall,
button.hpButtonVerySmall,
input.hpStdButton,
input.hpStdButtonLarge,
input.hpButton,input.hpButtonSmall,
input.hpButtonVerySmall {
   background-color: #86BB5B;
   position:relative;
   left:-1px;
   top:-1px;   
/* background color a part of the theme css */
   color: #ffffff; 
   font-weight:bold;
   text-decoration: none;   
   font-family: Arial,sans-serif;
   text-align:center;
   cursor:pointer;
   padding-bottom:3px;
}

h3.subTitle {
   background-color:#666;
   font-weight:bold;
   color:#fff;
   padding:3px 5px 3px 9px;
   margin:0px;
   font-size:100%;
}

label.error {
   background-color:#666;
   font-weight:bold;
   color:red;
   padding:3px 5px 3px 9px;
   margin:0px;
   font-size:100%;
}

.buttonA {  
   margin-left: 5px;
   background-color:#86BB5B; 
   color: #ffffff; 
   font-weight:bold;
   text-decoration: none;   
   font-family: Arial,sans-serif;
   text-align:center;
   cursor:pointer;
   width:86px;
   height:21px;
}

.buttonHelp { 
   margin-left:5px;
   background-color:#86BB5B; 
   color: #ffffff; 
   font-weight:bold;
   text-decoration: none;   
   font-family: Arial,sans-serif;
   text-align:center;
   cursor:pointer;
   width:18px;
   height:19px;
}

.buttonB { 
   margin-right:5px;
   margin-left:5px;
   background-color:#86BB5B; 
   color: #ffffff; 
   font-weight:bold;
   text-decoration: none;   
   font-family: Arial,sans-serif;
   text-align:center;
   cursor:pointer;
   width:95px;
   height:20px;
   padding-bottom:3px;
}



/* PLS specific styles */

/*buttons*/
.buttonTxtSize { 
   margin-right:5px;
   margin-left:5px;
   background-color:#86BB5B; 
   color: #ffffff; 
   font-weight:bold;
   text-decoration: none;   
   font-family: Arial,sans-serif;
   text-align:center;
   cursor:pointer;
   height:20px;
   padding-bottom:3px;
}

.buttonTxtSizeDisabled {
	TEXT-ALIGN: center;
	PADDING-BOTTOM: 3px;
    BACKGROUND-COLOR:; 	
    FONT-FAMILY: Arial, sans-serif;
	HEIGHT: 20px;
	COLOR: #999;
	MARGIN-LEFT: 5px;
	CURSOR: pointer;
	FONT-WEIGHT: bold;
	MARGIN-RIGHT: 5px;
	TEXT-DECORATION: none
}

/*tables*/
td.tableColumnHeader {
   background-color:#968F89;
   font-weight:bold;
   color:#FFFFFF;
   padding:3px 5px 3px 9px;
   margin:0px;
   font-size:100%;
}
td.tableDataCellStand {
   background-color:#EEEEEE;
   font-weight:normal;
   color:#000000;
   padding:3px 5px 3px 9px;
   margin:0px;
   font-size:100%;
}
td.tableDataCellAlt {
   background-color:#F5F5F5;
   font-weight:normal;
   color:#000000;
   padding:3px 5px 3px 9px;
   margin:0px;
   font-size:100%;
}

/*fonts*/
.boldFont {
  font-weight:bold; 
}

.itemFont {
  width:65%;
}

.labelFont { 
  font-weight:bold; 
  width:35%;
}

.itemFontLonger {
  width:55%;
}

.labelFontLonger { 
  font-weight:bold; 
  width:45%;
}

.labelFontError { 
  font-weight:bold; 
  width:35%;
  color:rgb(204,0,0);
}

.itemLargeFont {
  font-size:16px;
}

.labelLargeFont { 
  font-weight:bold; 
  font-size:16px;
}

/* supplies */
.hpDocVaryText {
  font-size:7pt;
  width:100%; 
}

.itemSpsFont {
  width:10%;
  white-space:nowrap; 
}

.labelSpsFont { 
  font-weight:bold; 
  width:90%;
  white-space:nowrap; 
}

.SupplyName { 
   background-color:#003366;
   font-weight:bold;
   color:#FFFFFF;
}

/* support and supplies common styles */
.suppliesSupportHeaderFont {
  font-size:18pt;
}

.suppliesSupportFont {
   font-size:10pt;
}

.suppliesSupportFontButton {
   font-size:10pt;
   vertical-align:top;
}

td.suppliesSupportWhiteFont {
   font-size:10pt;
   color:#FFFFFF;
}

.suppliesSupportCopyrightFont {
   font-family:Arial;
   font-size:7pt;
}


