/*globally remove all margin & padding*/
* {
    margin: 0;
    padding: 0;
}

/*this overrides the Ext JS field background.*/
.x-form-text, .x-form-field {
    background: none;
}

#divWarningText{
    background-color:yellow;
    color: #ff0000;
    text-align: left;
    height: 35px;
    display: none;
}

.menuOptionBorder {
    border: 2px groove gray;
}

/* This ID definition is for the header bar of every parent page in ICUE. */
#header {
    z-index: 1;
    padding: 3px 0 0 0;
    margin: 0 0 0 0;
    position: absolute;
    height: 24px;
    width: 100%;
    top: 0;
    background: #9ac7f6;
    border: none;
}

#headerText {
    text-align: center;
    z-index: 1;
    font-size: 1.05em;
    font-weight: bold;
    width: 98%;
    position: absolute;
}

#header1 {
    z-index: 1;
    font-size: 1.5em;
    font-weight: bold;
}

/* This Id is used in footer to render watermark in the application*/
#watermark{
    font-size:25px;
    width: 400px;
    height: 30px;
    position:relative;
    opacity:0.1;
    filter:alpha(opacity=10); /* For IE8 and earlier */
    float:right;
    top:5px;
    Z-index:2;
}

/* This ID definition is for the menu bar of every parent page in CAMS*/
#menubar {
    text-align: left;
    z-index: 2;
    text-indent: 7px;
    position: absolute;
    height: 24px
}

#menubar A {
    color: black;
    display: block;
    height: 20px;
    padding: 3px 3px 0;
    border-bottom: none;
}

/* Used for all <a></a> within the menubar DIV */
#menubar A:HOVER {
    color: black;
    background-color: #9AC7F6;
}

/* Used for all onMouseOver event @ <a></a> within the menubar DIV */
#menubar A:ACTIVE {
    color: black;
    background-color: #9AC7F6;
    border-color: #4D4D4D;
}

#menubar TABLE {
    z-index: 5;
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
}

#menubar td {
    padding: 0;
}

#menubar TD:focus {
    background-color: yellow;
}

/* This ID definition is for the main part of every parent page in CAMS*/
#main {
    position: absolute;
    z-index: 0;
    background-color: rgb(245, 245, 245);
    height: auto;
    top: 44px;
    left: 8px;
    width: 97%;
    padding: 5px;
    border: solid #4d4d4d 2px;
    border-right-style: outset;
    border-bottom-style: outset;
}

#sectionLink {
    color: #fff;
}

#mainColumnLayout {
    z-index: 0;
    background-color: rgb(245, 245, 245);
    position: absolute;
    top: 55px;
    width: 98%;
    left: 8px;
    padding: 5px;
    border: solid #d7d7d7 2px;
    border-right-style: outset;
    border-bottom-style: outset;
}

#main TABLE {
    padding: 0 0 0 0;
    width: 100%;

}

.reviewTable {
    padding: 0px 0px 0px 0px; /*5px 10px 20px 50px;*/
    border-left: solid #6666ff 2px;
    border-bottom: solid #6666ff 1px; /*border-bottom-width:1px;*/
    margin-left: 7px;
}

.reviewBlankTextAreaTable {
    padding: 0px 0px 0px 0px; /*5px 10px 20px 50px;*/
    border-left: solid #6666ff 2px;
    border-bottom: solid #6666ff 1px; /*border-bottom-width:1px;*/
    margin-left: 5px;
    margin-bottom: 5px;
}

.reviewBlankTextAreaTableRow {
    padding: 5px 5px 5px 5px;
    border-bottom: solid #000000 1px;
    cellspacing: 2px;
    margin-bottom: 5px;
    margin-right: 5px;
}

.x-toolbar TABLE, .x-toolbar TABLE TD, .x-toolbar TD, .x-toolbar TH, .x-toolbar TABLE TH {
    border: 0px;
    padding: 0px 0px 0px 0px;
    font-size: 1em;
    font-weight: normal;
    text-align: left;
}

#main TD {
}

#popupHeader {
    z-index: 0;
    margin: auto;
    padding: 0 0 0 0;
    position: relative;
    width: 95%;
    height: auto;
    top: 0;
    background-color: white;
    background-position: center;
    border: 1px solid rgb(71, 82, 69);
    color: rgb(71, 82, 69);
    text-align: center;
    font-size: 1.4em;
}

#popupMain {
    z-index: 0;
    position: absolute;
    width: 98%;
    top: 0;
    height: auto;
    font-size: 1em;
    font-weight: normal;
}

.menubarStyle {
    font-size: 1.1em;
    color: rgb(71, 82, 69);
}

.menuDropDown {
    background-color: #9AC7F6;
    margin-top: -1px;
    padding: 0 0 0 3px;
    line-height: 20px;
    text-align: left;
    display: block;
    border: 1px solid #4D4D4D;
    border-top: none;
}

.menuDropDown A {
    color: black;
    text-decoration: none;
    font-weight: 100;
}

.menuDropDown A:ACTIVE {
    color: black;
    font-weight: 900;
}

.menuDropDown A:HOVER {
    color: black;
    font-weight: 900;
}

/** The following ID definitions are for the menu drop downs. **/
#homeMenu1, #workQueueMenu1, #searchMenu1, #quickLinksMenu1, #toolMenu1, #toolMenu2 {
    z-index: 5;
    position: absolute;
    top: 27px;
}

#homeMenu1 {
    left: 0;
}

#workQueueMenu1 {
    left: 50px;
}

#searchMenu1 {
    left: 150px;
}

#quickLinksMenu1 {
    left: 210px;
}

/* keep tools menu furthest to the right */
#toolMenu1, #toolMenu2, #ruleMenu2 {
    left: 300px;
}

#tabDiv {
    position: absolute;
    z-index: 2;
    padding: 0;
    margin: 0;
    top: 30px;
    left: 8px;
    width: 98%;
    height: 21px;
    border: 1px solid #cccccc;
    border-left: none;
}

/*#tabDiv table {*/
/*border-collapse: collapse;*/
/*border-spacing: 0;*/
/*}*/

/* Top-of-page navigation tabs */
.tabs {
    padding: 0 0 19px 0;
    margin: 0;
    font-size: 1em;
    font-weight: normal;
}

.tabs td {
    white-space: nowrap;
    border-left: 1px solid #cccccc;
    text-align: center;
    padding: 0;
}

.tabs td a {
    color: #000;
    text-decoration: none;
    padding-left: 12px;
    margin-right: 2px;
}

.tabs td a span {
    padding-right: 12px;
    padding-top: 3px;
    padding-bottom: 4px;
}

.tabs td a, .tabs td a span {
    display: block;
    float: left;
}

/* Hide from IE5-Mac \*/
.tabs td a, .tabs td a span {
    float: none;
}

/* End hide */

.tabs td a:hover {
    color: #000;
    padding-left: 12px;
}

.tabs td a:hover span {
    padding-right: 12px;
    text-decoration: underline;
}

.tabs td.current a span {
    color: #175564;
    font-weight: bold;
}

.tabs td.current {
    /*background: #F3F3F3;*/
    background: #DDD;
    z-index: 4;
}

.tabs td.disabled a {
    color: #999999;
}

.tabs td.disabled a:hover {
    color: #999999;
}

.tabs td.disabled a:hover span {
    color: #999999;
}

.tabs td a:link {
    text-decoration: none;
}

.button {
    background-color: white;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    height: 22px;
    color: #000;
    font-weight: bold;
    border: outset #c6c6c6 1px;
    background-image: url("../../../images/buttonBG.gif");
    background-repeat: repeat-x;
}

#prevButton {
    width: 100px;
    background-position: left;
}

#ROprevButton {
    width: 100px;
    color: #737373;
    background-color: RGB(232, 232, 232);
    background-position: left;
}

#nextButton {
    width: 100px;
    background-position: right;
}

#ROnextButton {
    width: 100px;
    color: #737373;
    background-color: RGB(232, 232, 232);
    background-position: right;
}

#ascButton {
    width: 16px;
    height: 16px;
    background-image: url("../../../images/ascend.gif");
    background-color: transparent;
    background-position: center;
    border: none;
}

#descButton {
    width: 16px;
    height: 16px;
    background-image: url("../../../images/descend.gif");
    background-color: transparent;
    background-position: center;
    border: none;
}

p {
    line-height: 1.3em;
    margin-top: .5em;
    margin-bottom: .5em;
}

/*removing global and forcing class only*/
.iframe {
    visibility: hidden;
    border: none;
}

INPUT {
    font-family: "Lucida Console", Terminal, "Courier New", Courier, monospace;
    padding-top: 1px;
    padding-bottom: 1px;
}

INPUT::-ms-clear, INPUT::-ms-reveal {
    display: none; /* For ie10+ */
}

INPUT:focus {
    background-color: #FFFFCC
}

SELECT {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    background-color: white;
}

SELECT:focus {
    background-color: #FFFFCC
}

IMG {
    border: 0;
}

OPTION {
    padding-right: 9px;
}

TEXTAREA {
    font-size: .9em;
    font-family: "Lucida Console", Terminal, "Courier New", Courier, monospace;
}

TABLE {
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 1em;
}

TD {
    border: 1px;
    padding: 3px 3px 3px 3px;
    font-size: 1em;
    font-weight: normal;
}

TH {
    border: 1px;
    padding: 5px 3px 5px 3px;
    background-color: #82C0FF;
    font-weight: bold;
    text-align: center;
}

A {
    color: blue;
    text-decoration: none;
}

A:hover {
    text-decoration: underline;
}

A:focus {
    text-decoration: underline;
}

A:active {
    color: #192C78
}

BODY {
    background-color: #FFF;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 85%;
    color: #000;
    height: 100%;
}

.fullWidth {
    width: 100%;
}

#footer {
    font-size: .8em;
    text-align: center;
}

#error {
    color: red;
    font-weight: bold;
}

.error {
    color: red;
    font-weight: bold;
}

#status {
    color: green;
    font-weight: bold;
}

.status {
    color: green;
    font-weight: bold;
}

#warning {
    color: #CC9900; /*   color: rgb( 222, 182, 18 );*/
    font-weight: bold;
}

#information {
    color: blue;
    font-weight: bold;
}

#output {
    font-weight: bold;
}

.readOnly {
    line-height: 1em;
    border-width: 0;
    background-color: rgb(245, 245, 245);
}

.required {
    font-weight: bold;
    color: black;
}

.accessKey {
    font-weight: bold;
    text-decoration: underline;
}

.requiredLabel {
    font-weight: bold;
    color: black;
}

.doubleClickable {
    background-color: #CCFFFF; /* #99FFFF -slightly darker*/
}

.toUpperCase {
    text-transform: uppercase;
}

.altColor {
    background-color: #ddddff;
}

.errorField {
    background-color: #FFEAD5;
}

.disabledField {
    background-color: #C0C0C0;
}

.tr0 {
    background-color: #EAEAEA;
}

.tr1 {
    background-color: #F5F5F5;
}

.tr3 {
    background-color: #FFEAD5;
}

#table_display {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    width: 100%;
}

#searchTable {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    width: 100%;
}

#searchTable Table {
    padding: 0 0 0 0;
    border: 1px solid #cccccc;
    width: 100%
}

#searchTable TD {
    width: 25%;
}

.pageTitleBar {
    font-size: 1.1em;
    font-weight: bold;
    color: #fff;
    background-color: #cdc9c9;
    padding-top: 4px;
    padding-left: 4px;
    padding-bottom: 4px;
}

.openPageSection {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 20px;
    background-color: #737373;
}

.openPageSection {
    float: left;
    height: 100%;
    width: 100%;
    padding-top: 0;
}

.closedPageSection {
    float: left;
    height: 100%;
    width: 100%;
    padding-top: 0;
}

.divPageSectionHeader {
    height: 15px;
    position: relative;
    padding: 3px 0;
    font-size: 1em;
    background: #CAE8CB;
    color: #175564;
    font-weight: bold;
    border-left: 1px solid #B0E1B4;
    border-right: 1px solid #000;
    border-bottom: 1px solid #B0E1B4;
    z-index: 1;
    width: 100%;
}

.divPageSection {
    height: 15px;
    position: relative;
    padding: 3px 0;
    text-indent: 18px; /* allow room for +/- image */
    font-size: 1em;
    background: #78D193 2px url("../../../images/minus.gif") no-repeat;
    color: #175564;
    font-weight: bold;
    border-left: 1px solid #B0E1B4;
    border-right: 1px solid #000;
    border-bottom: 1px solid #B0E1B4;
    z-index: 1;
    width: 100%;
}

a.divPageSectionLink,
a.divPageSectionLink:link,
a.divPageSectionLink:active,
a.divPageSectionLink:hover {
    color: #175564;
    text-decoration: none;
}

.main {
    background-color: rgb(245, 245, 245) !important;
}

.divPageSectionContent {
    position: relative;
    border: 1px solid #000000;
    width: 100%;
    overflow: auto;
}

#spanTable .divPageSectionContent {
    min-height: 45px;
    /*overflow-x: auto;*/
    /*overflow-y: visible;*/
    overflow: visible;
}

.divPageSectionContentAttention {
    position: relative;
    border: 1px solid #000000;
    width: 100%;
    background-color: #FFFF66 !important;
}

.divPageSubsectionContent {
    position: relative;
    border: 1px solid #000000;
    width: auto;
    overflow: hidden;
}

/* fixes for old versions of Internet Explorer */
html.ie5 .divPageSectionContent, html.ie6 .divPageSectionContent,
html.ie5 .divPageSubsectionContent, html.ie6.divPageSubsectionContent {
    overflow: visible;
}

.attention {
    background-color: #FFFF66 !important;
}

/* fix extra cell borders in IE on listTable in any divPageSectionContent */
.divPageSectionContent table.listTable, table.assignmentListTable, table.newTable, table.sortTable {
    border-left: none;
    border-right: none;
}

table.listTable th, table.assignmentListTable th, table.newTable th, table.sortTable th {
    overflow: hidden;
}

table.listTable td, table.assignmentListTable td, table.newTable td, table.sortTable td {
    overflow: hidden;
}

div.assessmentBuilder11 {
    width: 11em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.assessmentBuilder15 {
    width: 15em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

div.assessmentBuilder45 {
    width: 45em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#divTopLeft .divPageSectionContent td {
    font-size: .9em;
    padding: 2px;
    border: 0;
}

.statusToggleOpen {
    background-image: url("../../../images/plus.gif");
    background-repeat: no-repeat;
    background-color: #c0c0c0;
    border-color: #d2d2d2;
}

.statusToggleClose {
    background-image: url("../../../images/minus.gif");
    background-repeat: no-repeat;
}

.divPageSectionContentHide {
    display: none;
}

.hiddenReviewScore {
    display: none;
}

.divPageSectionContentIndented {
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
}

#intake {
    float: right;
    width: 81%;
    color: #000;
    clear: right;
}

#intakeBorder {
    border: 1px solid #000;
}

#duplicates {
    float: right;
    width: 81%;
    color: #000;
    clear: right;
}

#member {
    float: left;
    width: 19%;
}

#divTopLeft {
    float: left;
    width: 18%;
    background-color: #fff;
}

#divTopLeft .divPageSectionContent {
    overflow: auto;
}

/* reference for floating div on right*/
#divTopRightTab {
    float: right;
    width: 19%;
    color: #000;
}

/* reference for main screen on left*/
#intakeTab {
    float: left;
    width: 80%;
    color: #000;
    border: solid #D7D7D7 1px;
}

.clear {
    height: 0;
    font-size: 1px;
    margin: 0;
    padding: 0;
    line-height: 0;
    clear: both;
}

.vertical-line {
    display: inline;
    background-color: #D7D7D7;
    width: 2px;
    height: 100%;
    top: 15px;
    border: solid #fff 1px;
}

#footerDiv {
    clear: both;
    width: 100%;
}

table.listTable, table.summaryTable, table.assignmentListTable, table.newTable, table.sortTable {
    border: 1px solid #4d4d4d;;
}

table.listTable tr, table.summaryTable tr, table.assignmentListTable tr, table.sortTable tr {
    border: none;
}

table.newTable tr.tr1 td {
    border-top: 1px solid #4d4d4d;
}

table.newTable tr.tr0 td {
    border: none;
}

table.listTable th, table.summaryTable th, table.assignmentListTable th, table.newTable th, table.sortTable th {
    border: 1px solid #4d4d4d;
}

table.expandTable {
    border-top: 1px solid #4d4d4d;
    border-bottom: 1px solid #4d4d4d;
}

table.listTable td, table.summaryTable td, table.assignmentListTable td, table.sortTable td {
    border: none;
    border-right: 1px solid #4d4d4d;
    width: 0;
}

table.newTable td.tr0, table.newTable td.tr1 {
    border: none;
    width: 0;
}

table.listTable tr:hover, table.assignmentListTable tr:hover, table.sortTable tr:hover {
    background-color: #FFFFCC;
    border: 1px solid;
}

table.newTable tr.tr0:hover, table.newTable tr.tr1:hover {
    background-color: #FFFFCC;
}

table tr.hoverableRow:hover{
    background-color: #FFFFCC;
}

.hoverRow {
    background-color: #FFFFCC;
}

.selectedRow {
    background-color: #FFFF66 !important;
}

table.displayTable td {
    border: none;
}

.indent1 {
    text-indent: 40px;
    width: 85%;
}

.indent2 {
    text-indent: 60px;
    width: 80%;
}

.indent3 {
    text-indent: 80px;
    width: 75%;
}

.indent4 {
    text-indent: 100px;
    width: 70%;
}

.indent5 {
    text-indent: 140px;
    width: 60%;
}

.indentBlock1 {
    padding-left: 30pt;
    padding-right: 50pt;
}

#assignmentTable TABLE {
    padding: 3px 3px 3px 3px;
    border: 1px solid #cccccc;
    width: 100%;
}

#assignmentTable TH {
    padding: 3px 3px 3px 3px;
    border: 1px solid #cccccc;
}

#assignmentTable TR:hover {
    background-color: white;
}

#assignmentTable TD {
    border: 1px solid #cccccc;
    width: 0;
}

td.cpmSideBarLabel, td.hsrSideBarLabel, td.pcpRefSideBarLabel {
    font-weight: bold;
    vertical-align: top;
}

td.cpmSideBarValue, td.hsrSideBarValue, td.hsrSideBarValue {
    vertical-align: top;
    word-break: break-all;
}

div.historyDetailSection {
    margin-left: 50px;
}

table.historyDetailTable {
    border: none;
}

TR.historyDetailRow TD {
    border: none;
    align: left;
}

.historyDetailRow {
    border: none;
    align: left;
}

.historyDetailPaddedOffSet {
    padding-left: 50px;
}

TR.historyDetailRow TD.historyDetailLabelWidth {
    width: 200px;
}

TR.historyDetailRow TD.historyDetailResponseWidth {
    width: 250px;
}

.textHeader {
    font-weight: bold;
}

.sectionHeader {
    font-size: 1em;
    font-weight: bold;
    color: white;
    background-color: #0080C0;
    border: 1px #4D4D4D;
    border-style: solid none none;
    padding: 5px 8px 8px;
}

#sectionHeader {
    font-size: 1em;
    font-weight: bold;
    color: white;
    background-color: #0080C0;
    border: 1px #4D4D4D;
    border-style: solid none none;
    padding: 5px 8px 8px;
}

.sectionContent {
    border: 1px solid #4D4D4D;
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    margin: 0;
}

.subSectionHeader {
    font-size: 1em;
    font-weight: bold;
    background-color: #82C0FF;
    border: 1px #4D4D4D;
    border-style: solid solid none;
    padding: 5px 8px 8px;
    margin: 0 10px;
}

.subSectionHeaderNoBorderNoMargin {
    font-size: 1em;
    font-weight: bold;
    background-color: #82C0FF;
    padding: 5px 8px 8px;
}

.subSectionContent {
    border: 1px solid #CFCFCF;
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 3px;
    margin: 0 10px;
}

.scrollableDiv {
    height: 150px;
    margin-left: 60px;
    margin-right: 60px;
    overflow: auto;
}

.scrollableDivNoMargin {
    height: 230px;
    border-bottom: 1px solid black;
    overflow: auto;
}

.scrollableDivSearchResults {
    height: 300px;
    overflow: auto;
}

/*.scrollableNoteDiv {
    overflow:auto;
}*/
.scrollableDiv TABLE {
    margin-top: 5px;
    margin-left: 5px;
}

/********************************************************/
/* UnitedHealthcare CI/CR Stylesheet */

/*************** AJAX ***********************************/
.loading {
    height: 16px;
    width: 16px;
    display: none;
}

.loading-img {
    padding-left: 20px;
    margin: 5px;
    background-image: url('../../../images/loading.gif');
    background-repeat: no-repeat;
}

.ajaxValidation {
    color: red;
    font-weight: bold;
}

/* Because dependent Selects are often unpopualted initially, */
/* they may not be properly sized once they get filled.       */
/* The following give you some control over the initial width.*/
.ajaxSelect {
    width: 100px;
}

.ajaxSelect150 {
    width: 150px;
}

.ajaxSelect200 {
    width: 200px;
}

.ajaxSelect300 {
    width: 300px;
}

.ajaxSelect350 {
    width: 350px;
}

.ajaxSelect400 {
    width: 400px;
}

.ajaxSelect500 {
    width: 500px;
}

.ajaxSelect520 {
    width: 520px;
}

.ajaxSelect600 {
    width: 600px;
}

.ajaxSelect650 {
    width: 650px;
}

.ajaxSelect700 {
    width: 700px;
}

.ajaxSelect750 {
    width: 750px;
}

/********************************************************/
/* CTO added for buttons rounding */
a.button, span.button, del.button {
    /*display: -moz-inline-box;*/
    display: inline-block;
    cursor: pointer;
    border: none;
    font-size: 0;
    line-height: 0;
    /*
     for Safari, read this first
     http://creativebits.org/webdev/safari_background_repeat_bug_fix
     */
    background-position: 0 0;
    background-repeat: no-repeat;
    height: 30px;
    text-decoration: none;
    color: #2e523b;
    font-style: normal;
    margin: 0 6px 0 0;
    padding: 0 10px 0 0;
    vertical-align: middle;
    background-color: rgb(245, 245, 245);
    padding-top: -2px;
    _position: relative;
    _width: 10px;
    _overflow-y: hidden;
}

a.button, span.button, del.button,
a.button span, span.button button, span.button input, del.button span {
    background-image: url(../../../images/form_button.png);
    _background-image: url(../../../images/form_button.gif);
}

a.button span, span.button button, span.button input, del.button span {

    white-space: nowrap;
    cursor: pointer;
    color: #222; /* display: -moz-inline-box; */
    display: inline-block;
    line-height: 1;
    letter-spacing: 0 !important;
    font-family: Verdana, Arial, Helvetica, sans-serif !important;
    font-size: 1em !important;
    font-style: normal;
    background-color: transparent;
    background-position: 100% 0;
    background-repeat: no-repeat;
    height: 30px;
    padding: 8px 20px 0 10px;
    margin: 0 -16px 0 10px;
    border: none;
    vertical-align: text-top;
    zoom: 1;
    _position: relative;
    _padding-left: 0px;
    _padding-right: 12px;
    _margin-right: -10px;
    _display: block;
    _top: 0;
    _right: -5px;

}

span.button button {
    line-height: 2.5; /*Opera need this*/
}

html.safari a.button span,
html.safari del.button span {
    line-height: 1.3;
}

html.safari span.button button {
    line-height: 2.6;
}

html.safari a.button:focus,
html.safari span.button button:focus {
    outline: none;
}

del.button {
    /* cursor:not-allowed;	*/
    background-position: 0 -120px;

}

del.button span {
    cursor: default;
    color: #aaa !important;
    background-position: 100% -120px;
}

span.button button, span.button input {
    padding-top: 0;
    line-height: 2.5; /*Opera need this*/
}

/** optional **/
/*
a.button:visited{
	color:#aaa;
}
*/

/*Hover Style*/
a.button:hover,
span.button:hover,
a.button:focus,
a.dom-button-focus,
span.button-behavior-hover {
    background-position: 0 -60px;
    color: #222;
    text-decoration: none;
}

a.button:hover span,
span.button:hover button,
a.button:focus span,
span.button-behavior-hover button,
span.button-behavior-hover input {
    background-position: 100% -60px;
}

a.button:active, a.button:focus span {
    color: #444;
}

del.button-behavior-hover, del.button:hover {
    background-position: 0 -180px; /* cursor:not-allowed; */
}

del.button-behavior-hover span, del.button:hover span {
    background-position: 100% -180px; /* cursor:not-allowed; */
}

/********************************************************/

blockquote:before, blockquote:after, q:before, q:after {
    content: "";
}

blockquote, q {
    quotes: "" "";
}

a {
    cursor: pointer;
    text-decoration: none;
}

br.both {
    clear: both;
}

#backgroundPopup {
    display: none;
    position: fixed;
    _position: absolute; /* hack for internet explorer 6*/
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #000000;
    border: 1px solid #cecece;
    z-index: 1;
}

#popupContact {
    display: none;
    position: fixed;
    _position: absolute; /* hack for internet explorer 6*/
    height: 384px;
    width: 408px;
    background: #FFFFFF;
    border: 2px solid #cecece;
    z-index: 2;
    padding: 12px;
    font-size: 1.1em;
}

#popupContact h1 {
    text-align: left;
    color: #6FA5FD;
    font-size: 1.3em;
    font-weight: 700;
    border-bottom: 1px dotted #D3D3D3;
    padding-bottom: 2px;
    margin-bottom: 20px;
}

#popupContactClose {
    font-size: 1.1em;
    line-height: 14px;
    right: 6px;
    top: 4px;
    position: absolute;
    color: #6fa5fd;
    font-weight: 700;
    display: block;
}

/*************************************
CSS FOR CAL
*************************************/
/* Calendar: a Javascript class for Mootools that adds accessible and unobtrusive date pickers to your form elements <http://electricprism.com/aeron/calendar> */
/* Default CSS for Calendar (navigation: 1), Copyright (c) 2007 Aeron Glemann <http://electricprism.com/aeron> */

.hidden {
    opacity: 0;
    position: absolute;
}

.visible {
    opacity: 1;
}

input.calendar,
select.calendar {
    width: 99px;
}

button.calendar {
    background: url("../../../images/calendar-icon.gif");
    border: 0;
    cursor: pointer;
    float: left;
    height: 20px;
    margin-right: 6px;
    width: 20px;
}

button.calendar:hover,
button.calendar.active {
    background-position: 0 20px;
}

div.calendar {
    background: url("../../../images/calendar.png");
    height: 195px;
    padding: 0 6px;
    text-align: center;
    width: 147px;
}

div.calendar * {
    margin: 0;
    padding: 0;
}

div.calendar div {
    background: none !important;
    cursor: move;
    height: 185px;
    overflow: hidden;
    padding-top: 10px;
    position: relative;
    width: 147px;
}

div.calendar caption {
    color: #333;
    font: normal 12px / 16px Arial, Helvetica, sans-serif;
    padding-top: 6px;
    text-align: center;
    width: 100%;
}

div.calendar caption a {
    cursor: pointer;
    display: block;
    height: 12px;
    overflow: hidden;
    position: absolute;
    text-indent: -100px;
    top: 17px;
    width: 11px;
}

div.calendar caption a.prev {
    background-image: url("../../../images/calendar-prev.gif");
    left: 0;
}

div.calendar caption a.next {
    background-image: url("../../../images/calendar-next.gif");
    right: 0;
}

div.calendar caption a:hover {
    background-position: 0 12px;
}

div.calendar caption span {
    height: 25px;
    position: relative;
    text-align: center;
}

div.calendar caption span.month {
    padding-right: 8px;
}

div.calendar caption span.month:after {
    content: ',';
}

div.calendar table {
    background: #FFF;
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    cursor: default;
    margin: 0 auto;
    overflow: hidden;
    width: 147px;
}

div.calendar td,
div.calendar th {
    border: 0;
    color: #0597DB;
    font: normal 12px Arial, Helvetica, sans-serif;
    height: 21px;
    text-align: center;
    width: 21px;
}

div.calendar td {
    background: url("../../../images/calendar-td.gif");
    color: #FFF;
    font-size: 11px;
}

div.calendar td.invalid {
    color: #999;
}

div.calendar td.valid {
    background: url("../../../images/calendar-valid.gif");
    color: #0597DB;
    cursor: pointer;
}

div.calendar td.hilite {
    background: url("../../../images/calendar-hilite.gif");
}

div.calendar td.inactive {
    background: url("../../../images/calendar-td.gif") 0 100%;
    color: #FFF;
}

div.calendar td.active,
div.calendar td.hover {
    background: url("../../../images/calendar-valid.gif") 0 100%;
    color: #FFF;
    cursor: pointer;
}

/* Calendar: a Javascript class for Mootools that adds accessible and unobtrusive date pickers to your form elements <http://electricprism.com/aeron/calendar> */
/* Alternate CSS for Calendar (navigation: 2), Copyright (c) 2007 Aeron Glemann <http://electricprism.com/aeron> */

input.alternate,
select.alternate {
    width: 99px;
}

button.alternate {
    background: url(../../../images/calendar-icon.gif);
    border: 0;
    cursor: pointer;
    float: right;
    height: 20px;
    margin-right: 6px;
    width: 20px;
}

button.alternate:hover,
button.alternate.active {
    background-position: 0 20px;
}

div.alternate {
    background: url(../../../images/calendar.png);
    height: 195px;
    padding: 0 6px;
    text-align: center;
    width: 147px;
}

div.alternate * {
    margin: 0;
    padding: 0;
}

div.alternate div {
    background: none !important;
    cursor: move;
    height: 185px;
    overflow: hidden;
    padding-top: 10px;
    position: relative;
    width: 147px;
}

div.alternate caption {
    color: #333;
    font: normal 12px / 16px Arial, Helvetica, sans-serif;
    overflow: hidden;
    text-align: center;
    width: 100%;
}

div.alternate caption a {
    cursor: pointer;
    display: block;
    height: 12px;
    overflow: hidden;
    position: absolute;
    text-indent: -100px;
    top: 17px;
    width: 11px;
}

div.alternate caption a.prev {
    background-image: url(../../../images/calendar-prev.gif);
    left: 0;
}

div.alternate caption a.next {
    background-image: url(../../../images/calendar-next.gif);
    right: 0;
}

div.alternate caption a:hover {
    background-position: 0 12px;
}

div.alternate caption span {
    padding-top: 6px;
    position: relative;
    text-align: center;
}

div.alternate caption span.month {
    float: left;
    width: 84px;
}

div.alternate caption span.month:after {
    content: '';
}

div.alternate caption span a {
    top: 8px;
}

div.alternate caption span.year {
    float: right;
    width: 63px;
}

div.alternate table {
    background: #FFF;
    border: 0;
    border-collapse: collapse;
    border-spacing: 0;
    cursor: default;
    margin: 0 auto;
    overflow: hidden;
    width: 147px;
}

div.alternate td,
div.alternate th {
    border: 0;
    color: #0597DB;
    font: normal 12px Arial, Helvetica, sans-serif;
    height: 21px;
    text-align: center;
    width: 21px;
}

div.alternate td {
    background: url(../../../images/calendar-td.gif);
    color: #FFF;
    font-size: 11px;
}

div.alternate td.invalid {
    color: #999;
}

div.alternate td.valid {
    background: url(../../../images/calendar-valid.gif);
    color: #0597DB;
    cursor: pointer;
}

div.alternate td.hilite {
    background: url(../../../images/calendar-hilite.gif);
}

div.alternate td.inactive {
    background: url(../../../images/calendar-td.gif) 0 100%;
    color: #FFF;
}

div.alternate td.active,
div.alternate td.hover {
    background: url(../../../images/calendar-valid.gif) 0 100%;
    color: #FFF;
    cursor: pointer;
}

.example-info {
    width: 150px;
    border: 1px solid #c3daf9;
    border-top: 1px solid #DCEAFB;
    border-left: 1px solid #DCEAFB;
    background: #ecf5fe repeat-x;
    font-size: 10px;
    padding: 8px;
}

pre.code {
    background: #F8F8F8;
    border: 1px solid #e8e8e8;
    padding: 10px;
    margin: 10px;
    margin-left: 0px;
    border-left: 5px solid #e8e8e8;
    font-size: 12px !important;
    line-height: 14px !important;
}

.msg .x-box-mc {
    font-size: 14px;
}

#msg-div {
    position: absolute;
    left: 35%;
    top: 10px;
    width: 250px;
    z-index: 20000;
}

.x-grid3-row-body p {
    margin: 5px 5px 10px 5px !important;
}

/* CALENDAR */
.ux-cal {
    font-size: 11px;
}

.ux-cal .ux-cal-weekday {
    background: #DFECFB url(../../../images/glass-bg.gif) repeat-x scroll left top;
    font-weight: bold;
    height: 25px;
}

.ux-cal .ux-cal-header {
    background: transparent url(../../../images/hd-sprite.gif) repeat-x scroll 0 -83px;
    height: 25px;
}

.ux-cal .ux-cal-header .ux-cal-monthTitle {
    text-align: center;
    color: #ffffff;
    font-weight: bold;
}

.ux-cal td {
    text-align: center;
    vertical-align: middle;
    border: solid 1px white;
    cursor: pointer;
}

.ux-cal .ux-cal-row td:hover {
    background: #ddecfe;
}

.ux-cal .otherMonth {
    color: #AAAAAA;
}

.ux-cal-weekday td {
    cursor: default;
}

.ux-cal-highlight-approved, .ux-cal-highlight-approved a.ui-state-default {
    background: url(../../../images/ui-bg_highlight-green.png) 50% 50% repeat-x;
    font-weight: bold;
    color: white;
}

.ux-cal-highlight-approved-out, .ux-cal-highlight-approved-out a.ui-state-default {
    background: url(../../../images/ui-bg_highlight-green-dash.png) 50% 50% repeat-x;
    font-weight: bold;
    color: black;
}

.ux-cal-highlight-denied, .ux-cal-highlight-denied a.ui-state-default {
    background: url(../../../images/ui-bg_highlight-red.png) repeat-x scroll 50% 50%;
    font-weight: bold;
    color: white;
}

.ux-cal-highlight-denied-out, .ux-cal-highlight-denied-out a.ui-state-default {
    background: url(../../../images/ui-bg_highlight-red-dash.png) repeat-x scroll 50% 50%;
    font-weight: bold;
    color: black;
}

.ux-cal-highlight-pended, .ux-cal-highlight-pended a.ui-state-default {
    background: url("../../../images/ui-bg_highlight-yellow.png") repeat-x scroll 50% 50%;
    font-weight: bold;
    color: black;
}

.ux-cal-highlight-pended-out, .ux-cal-highlight-pended-out a.ui-state-default {
    background: url("../../../images/ui-bg_highlight-yellow-dash.png") repeat-x scroll 50% 50%;
    font-weight: bold;
    color: black;
}

.ux-cal-highlight-bold, .ux-cal-highlight-bold a.ui-state-default {
    font-weight: bold;
    color: black;
}

.ux-cal-highlight-selected {
    background: lightgray;
}

.ui-state-default {
    background: none;
}

.x-grid3-cell-inner, .x-grid3-hd-inner {
    white-space: normal; /* changed from nowrap */
}

.x-grid3-body, .x-grid3-scroller, .x-grid3-header, .x-grid3-header-inner, .x-grid3-header-offset, .x-grid3-hd-row, .x-grid3-hd, .x-grid3-col {
    padding: 0px 0px 0px 0px;
}

.prepopulate {
    background-color: yellow;
}

.spellCheck IFRAME {
    visibility: visible;
}

.x-window-body {
    font: 1.1em Verdana, Arial, Helvetica, sans-serif
}

/* make extjs grid style follow application standards */
.extTable .x-panel-header {
    font: bold 1em Verdana, Arial, Helvetica, sans-serif;
    color: #000000;
    text-align: center;
    background: #82C0FF;
    border: 1px solid #4d4d4d
}

.extTable .x-grid3-header {
    background: #82C0FF;
}

.extTable .x-grid3-cell, .extTable .x-grid3-row-body, .extTable .x-grid-empty {
    font: 1em Verdana, Arial, Helvetica, sans-serif !important
}

.extTable .x-grid-empty {
    font-weight: bold !important;
    text-align: center;
    color: #CC9900;
}

.extTable .x-grid3-row-expanded td {
    font: 1em Verdana, Arial, Helvetica, sans-serif
}

.extTable .x-grid3-hd {
    padding: 0;
    text-align: center;
    background: #82C0FF;
}

.extTable .x-grid3-hd div {
    font-weight: bold;
}

/* remove button-like background for column headers on hover and sort */
.extTable .sort-asc div, .extTable .sort-desc div, .extTable .x-grid3-hd-over div, .extTable .x-grid3-hd-menu-open div {
    background: none #82C0FF !important
}

.extTable .x-grid3-row-over {
    background: none #FFFFCC
}

.extTable .x-grid3-row-selected {
    background-color: #FFFF66 !important
}

/* removing background image for checkbox and epander columns */
.extTable .x-grid3-body .x-grid3-row .x-grid3-td-checker, .extTable .x-grid3-body .x-grid3-row .x-grid3-td-expander,
.extTable .x-grid3-body .x-grid3-row-selected .x-grid3-td-checker, .extTable .x-grid3-body .x-grid3-row-selected .x-grid3-td-expander,
.extTable .x-grid3-body .x-grid3-row-over .x-grid3-td-checker, .extTable .x-grid3-body .x-grid3-row-over .x-grid3-td-expander {
    background-image: none;
}

.extTable .ext-el-mask-msg {
    left: 400px !important;
}

/* removing dup check image, else it shows in background */
.extTable .x-grid3-hd-inner {
    background-image: none;
}

/* set width to hide check image */
.extTable .x-grid3-row-checker, .x-grid3-hd-checker {
    width: 15px;
}

.extTable .x-grid3-row-checker {
    margin-left: 11px;
}

.row_highlighted_red {
    background-color: #F5A9A9;
}

.table_data_bold_blue {
    font-weight: bold;
    color: #3300FF;
}

.textAreaControls-top {
    text-align: right;
}

.textAreaControls-right {
    display: inline;
    vertical-align: top;
}

/*
    This style actually behaves more like centering.
    However, it visually yields a more desirable right-justification effect in-line with the right border of its peer elements.
*/
.textAreaControls-bottom {
    margin-left:auto;
    width:20%;
}

.fullDescriptColl {
    background: 2px url("../../../images/plus.gif") no-repeat;
    padding: 3px 0;
    z-index: 1;
    text-indent: 18px;
    height: 15px;
}

.fullDescriptExp {
    background: 2px url("../../../images/minus.gif") no-repeat;
    padding: 3px 0;
    z-index: 2;
    text-indent: 18px;
    height: 15px;
}

.ui-datepicker-trigger {
    padding-left: 2px;
    padding-right: 4px;
    padding-top: 2px;
}

.ui-datepicker-current-day {
    /*background: #83C948;*/
}

.ui-datepicker {
    z-index: 5 !important;
}

/*JQuery Datatable plugin*/

.even {
    background-color: #EAEAEA;
}

.sorting_asc {
    background-color: #C3DAF9;
}

.sorting_desc {
    background-color: #C3DAF9;
}

.sorting #ascendimg {
    display: none;
}

.sorting #descendimg {
    display: none;
}

.sorting_asc #ascendimg {
    display: inline;
}

.sorting_asc #descendimg {
    display: none;
}

.sorting_desc #ascendimg {
    display: none;
}

.sorting_desc #descendimg {
    display: inline;
}

.dataTables_empty {
    text-align: center;
    color: #CC9900;
    font-weight: bold;
}

.ColVis {
    float: left;
    margin-bottom: 0.5em;
    margin-left: 0.5em;
}

.ColVis_Button {
    position: relative;
    float: left;
    margin-right: 3px;
    padding: 3px 5px;
    height: 30px;
    background-color: #fff;
    border: 1px solid #d0d0d0;
    cursor: pointer;
    *cursor: hand;
}

button.ColVis_Button::-moz-focus-inner {
    border: none !important;
    padding: 0;
}

.ColVis_text_hover {
    border: 1px solid #999;
    background-color: #f0f0f0;
}

div.ColVis_collectionBackground {
    background-color: black;
    z-index: 1100;
}

div.ColVis_collection {
    position: relative;
    width: 150px;
    background-color: #f3f3f3;
    padding: 3px;
    border: 1px solid #ccc;
    z-index: 1102;
}

div.ColVis_collection button.ColVis_Button {
    background-color: white;
    width: 100%;
    float: none;
    margin-bottom: 2px;
}

div.ColVis_catcher {
    position: absolute;
    z-index: 1101;
}

.disabled {
    color: #999;
}

button.ColVis_Button {
    text-align: left;
}

div.ColVis_collection button.ColVis_Button:hover {
    border: 1px solid #999;
    background-color: #f0f0f0;
}

span.ColVis_radio {
    display: inline-block;
    width: 20px;
}

/*THE EXTJS GRIDPANEL SCROLL FOR IE8 AND FF*/

.x-grid3-viewport {
    overflow: scroll !important;
}

.workQueue .x-grid3-viewport {
    height: 500px;
    overflow: auto !important;
}

.ext-ie7 .workQueue .x-grid3-viewport {
    height: 500px;
    overflow: auto !important;
}

.ext-ie7 .x-grid3 {
    z-index: 1000 !important;
    overflow: auto !important;
}

.ext-ie7 .x-grid3-cell-inner, .ext-ie7 .x-grid3-header-inner {
    overflow: visible !important;
}

.ext-ie7 .workQueue .x-grid3-header-inner {
    overflow: hidden !important;
}
.x-grid3-viewport {
    min-height: 300px !important;
}
/*  subTab prototype */
div#subBanner {
    width: 98%;
    position: relative;
    top: 95px;
    left: 8px;
    border-top: 1px solid black;
}

ul#subMenu {
    background: transparent;
    height: 20px;
    margin-top: 2px;
    border: 1px solid #cccccc;
    border-left: none;
}

ul#subMenu li {
    display: inline;
    float: left;
    padding: 3px 0;
}

ul#subMenu h1, ul#subMenu h2 {
    font-size: 12px; /* change the size of text with this property */
    font-weight: normal;
    display: inline;
}

ul#subMenu li.subTabSoda h2 a {
    color: black;
    padding: 3px 14px;
    border-left: 1px solid #cccccc;
}

ul#subMenu li h2 a.current {
    color: #175564;
    font-weight: bold;
    background: #f3f3f3;
}

/*  tab prototype */
div#banner {
    position: absolute;
    top: 34px;
    left: 8px;
    width: 98%;
    z-index: 4;
}

ul#menu {
    border: 1px solid #4d4d4d;
    background: #083772;
    height: 31px;
}

ul#menu li {
    display: inline;
    position: relative;
    float: left;
    border-left: 1px solid #4d4d4d;
    padding: 7px 0 6px;
    margin-left: -1px;
}

ul#menu h2, ul#menu h3 {
    font-size: 16px; /* change the size of text with this property */
    font-weight: bold;
    display: inline;
    padding: 0 1em;
    white-space: nowrap;
}

ul#menu li h2 a, ul#menu li.tabSoda div p a {
    text-decoration: none;
    color: white;
}

ul#menu li h2 {
    color: white;
}

ul#menu div p {
    color: #ABABAC;
}

ul#menu li.current {
    background: #9AC7F6;
}

ul#menu li.current h2 a {
    text-decoration: none;
    color: #083772;
}

ul#menu li div {
    display: none;
}

ul#menu li.hovering div {
    display: block;
}

ul#menu li.tabSoda div {
    border: 1px solid #666;
    width: 12em;
    position: absolute;
    top: 31px;
    left: 0;
    padding: 1.3em;
    margin-left: -1px;
    background: #083772;
    color: white;
}

ul#menu li.tabSoda div p a:hover {
    color: white;
    font-weight: bold;
    text-decoration: underline
}

ul#menu div p {
    margin-bottom: 0.8em;
}

li#memberHover div a {
    color: #99D3E1;
}

table.activityHistoryContactDetails, table.letterRequestDetails {
    border: 1px solid #000000;
}

table.activityHistoryContactDetails td, table.letterRequestDetails td {
    border: 0 none;
}

.activityHistoryContactFieldLabel, .letterRequestDetailsFieldLabel {
    font-weight: bold;
}

span.activityComposite {
    padding-left: 10px;
    padding-right: 15px
}

table.spaceUnder td {
    padding-bottom: 1em;
}

/*Used to style noteHistorySection table rows where every 2 rows are grouped by color */
#noteHistory0 {
    background-color: #EAEAEA;
}

#noteHistory1 {
    background-color: #F5F5F5;
}