/* body {font-family:Arial; font-size:0.75em;} This would be the way to make fonts react to browser font size */
body {font-family:Arial; font-size:12px;}
a {color:#000099;}
h2, legend {font-size:17px; color:#FF6600; font-weight:normal;}
fieldset, hr {border:0px; border-top:1px solid #77B4B7;}
hr {margin:0px;}
fieldset.collapsible legend {cursor:pointer; padding-left:16px; background:url(../Images/minus.gif) no-repeat; background-position:left center;}
legend.collapsed {background:url(../Images/plus.gif) no-repeat !important;}
label {margin:0px 4px;}

#mainLogo {margin:10px 20px;}
#nav {float:right;}
#nav .content {background:#E1E9FD; border-bottom:1px solid #D3D8E2;}
#nav .content a {font-size:14px; text-decoration:none; color:#000000; margin:0px 5px; opacity:0.4; filter:alpha(opacity=40);zoom:1;}
#nav .content a.selected {font-weight:bold; opacity:1; filter:alpha(opacity=100);zoom:0;}
#nav .x-btn-text {font-size:14px;}

#userNav {margin:10px; float:right; white-space:nowrap;}
.viewport {background:#FFFFFF;}
.icon {vertical-align:middle; margin-right:2px;}

.leftSide .x-panel-header-text {font-size:20px; font-family:Arial; color:#000000; font-weight:normal;}
.leftSide .x-panel-header {border:0px;}
.leftSide .x-panel-body {background:#EEF1F7;}
.leftSide .x-panel-tl {border-bottom:0px; background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat scroll 0 0;}
.leftSide .x-panel-tr {background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat right 0;}
.leftSide .x-panel-tc {background:transparent url(../Images/leftside_top-bottom.gif) repeat-x 0 0;}
.leftSide .x-panel-ml {padding-left:2px; background:#fff url(../Images/leftside_left-right.gif) repeat-y 0 0;}
.leftSide .x-panel-mc {padding-top:0px; background:transparent url(../Images/leftside_left-right.gif) repeat-y right 0;}
.leftSide .x-panel-mr {padding-right:1px; background:transparent url(../Images/leftside_left-right.gif) repeat-y right 0;}
.leftSide .x-panel-bl{background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat 0 bottom;}
.leftSide .x-panel-br{background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat right bottom;}
.leftSide .x-panel-bc{background:transparent url(../Images/leftside_top-bottom.gif) repeat-x 0 bottom;}
.x-layout-collapsed {border-right:0px;}

.portal-body {border:0px; border-top:1px solid #838DAC;}
.x-portal {border-top:1px solid #838DAC; overflow:auto;}
.x-portal .x-panel-collapsed {border-bottom:1px solid #838DAC;}

.portlet {margin-bottom:5px;}
.portlet .x-panel-header {border:0px;}
.portlet .x-panel-header-text {font-size:12px; font-family:Arial; color:#000000; font-weight:normal;}
.portlet .x-panel-body {background:#EEF1F7; padding:1px; text-align:center;}
.portlet .x-panel-tl {border-bottom:0px; background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat scroll 0 0;}
.portlet .x-panel-tr {background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat right 0;}
.portlet .x-panel-tc {background:transparent url(../Images/leftside_top-bottom.gif) repeat-x 0 0;}
.portlet .x-panel-ml {padding-left:1px; background:#fff url(../Images/leftside_left-right.gif) repeat-y 0 0;}
.portlet .x-panel-mc {padding-top:0px; background:transparent url(../Images/leftside_left-right.gif) repeat-y right 0;}
.portlet .x-panel-mr {padding-right:1px; background:transparent url(../Images/leftside_left-right.gif) repeat-y right 0;}
.portlet .x-panel-bl{background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat 0 bottom;}
.portlet .x-panel-br{background:transparent url(../Images/leftside_corners-sprite.gif) no-repeat right bottom;}
.portlet .x-panel-bc{background:transparent url(../Images/leftside_top-bottom.gif) repeat-x 0 bottom;}

.section .x-panel-header-text {font-size:12px; font-family:Arial; color:#000000; font-weight:bold;}
.section .x-panel-header {border:0px; border-top:1px solid #848EAC;}
.section .x-panel-body {padding:5px;}
.unpadded-section .x-panel-header-text {font-size:12px; font-family:Arial; color:#000000; font-weight:bold;}
.unpadded-section .x-panel-header {border:0px; border-top:1px solid #848EAC;}

.section2 .x-panel-header-text {font-size:12px; font-family:Arial; color:#000000; font-weight:bold;}
.section2 .x-panel-header {border:0px;}
.light-panel-background .x-panel-body {background:#EEF1F7;}
.medium-panel-background .x-panel-body {background:#DFE8F6;}
.transparent-panel-background .x-panel-body {background:transparent;}

div.form > div {margin:4px;}
.label {text-align:right; white-space:nowrap;}
.scrollPanel {overflow:auto; background:#FFFFFF; border:1px solid #ABADB3; padding:5px;}
.dPanel {padding:15px; border-right:1px solid #7E89A8;}

.ReducePanelRightPadding .x-panel-mr { padding-right:1px; }

/* ICONS */
.iconSearch {background-image:url(../Images/search.png) !important;}
.iconAccept {background-image:url(../Images/icons/accept.png) !important;}
.iconPrinter {background-image:url(../Images/icons/printer.png) !important;}
.iconPortlets {background-image:url(../Images/portlets.png) !important;}
.iconEdit {background-image:url(../Images/icons/edit.png) !important;}
.iconSigma {background-image:url(../Images/icons/Sigma.gif) !important;}
.iconGrid {background-image:url(../Images/Grid.gif) !important;}

/*TREEGRID*/
.tgDefault {width:100%;}
.tgDefault img {border: 0px; padding: 0px; margin: 0px; display: inline-block;}
.tgDefault .header td {background:#D9DFED; border-bottom:1px solid #535E7B; font-weight:bold;}
.tgDefault td {padding:5px; border-bottom:1px solid #C9E1E2;}

/**/
.asmSelect {width:100%;}
.asmListItem {background:#FFFFFF !important;}
.asmHighlight {display:block; margin:5px 0px !important;}
.asmListItemRemove {background:#FFFFFF !important;}

.footer
{
	clear: both; 
	margin: 0;
	padding: 10px 0 0 0;
	border: none;
	
	font-size: 0.9em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	
	text-align: center;
	color:#999; 
	background: #FFF; 
}

.footer a
{
	margin: 0;
	color: #70B500;
}

.contactus
{
    float:left;
    width: 640px;
    margin-left: 10px;
    background:#FAFCF3;
}

/* TreeView for RecPay */
.nodeLevel1
{
    background: transparent url(../Images/blend_header.gif) repeat left bottom;
    width: 100%;
    padding: 3px;
    font-size: small;
    border-bottom: solid 2px white;
}
.nodeLevel2
{
    width: 100%;
    /*border-bottom: solid 2px black;*/
    padding: 5px 5px 5px 20px;
    font-weight: bold;
    background-color: White;
    font-size: x-small;
}
.nodeLevel3
{ 
    border-bottom: solid 2px white;
    padding: 5px 5px 5px 20px; 
    Font-Size: x-small;
}
.nodeLevel4
{
    width: 100%;
    background-color: White;
    padding: 5px 5px 5px 20px;
    font-size: x-small;
}
.nodeLevel5
{
    width:100%;
    background-color:White;
    padding: 5px 5px 5px 20px;
    Font-Size: x-small;
}
.nodeLevel6
{
    width:100%;
    background-color:White;
    padding: 5px 5px 5px 20px;
    Font-Size: x-small;
}

/*********************************/
/* #globalNav */
/* "welcome ..." sign off | my settings | about us | contact | help */
#globalNav
{
    position: absolute;
    right: 0;
    top: 0;
    /*width: 570px;*/
    padding-right: 20px;
    padding-bottom: 2px;
    white-space: nowrap;

	text-align: right; 
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #3B3B3B;
	background: #FFF;

    z-index: 500;	
}

#globalNav .global-nav-link
{
    padding: 0 4px;
	vertical-align: bottom;
	
	font-size: 100%;
	font-weight: bolder;
	text-transform: uppercase;
	text-decoration: none;
	
	color: #3B3B3B;
}

#globalNav .global-nav-button:hover
{
	color: #929639;
}

#globalNav .global-nav-link-disabled
{
    padding: 0 4px;
	vertical-align: bottom;
	
	font-size: 100%;
	font-weight:normal;
	text-transform: uppercase;
	text-decoration: none;
	
	color: #3B3B3B;
}

/*********************************/
button.logobtn
{
	background:transparent url(../Images/logo.png) no-repeat;
	background-position: center;
	border: solid 0px transparent;
	height: 90px;
	width: 150px;
	padding: 0px 90px 0px 90px;
}
button.logobtn:hover
{
	cursor: pointer;
	border: solid 1px #7F89A8;
}

/********************************/
.errorMsgs .x-window-body
{
	font-size: 16px;
	font-weight: bolder;
	color: Red;
	padding: 10px 10px 10px 10px;
}

/********************************* NO LONGER WORKS for ImageButton somehow ???
.dashboard_btn {border: solid 1px #7F89A8; display: inline; padding: 0px 0px 0px 0px; margin-right: 4px;}
.dashboard_btn:hover {
	cursor: pointer; border: solid 4px Blue; font-size: 16px; font-weight: bolder;
	color: Navy; padding: 0px 0px 0px 0px;
}*/
/* remove the default left,center and right images from the button border 
.dashboard_btn .x-btn-left, .dashboard_btn .x-btn-right, .dashboard_btn .x-btn-center{
    background: 0; padding: 0px 0px 0px 0px;
}*/

/*************** These are needed by the admin pages. ********************/
.leftcol
{
    float: left; 
    width: 330px; 
    background: #FAFCF3; 
}

.rightcol
{
    float:right;
    width: 640px;
    margin-left: 10px;
    background:#FAFCF3;
}

.sectionHdr
{
    position: relative;
	margin:0;
	padding: 4px 0 9px 5px;
    line-height: 1.1em;

	font-size: 1.1em;
	font-weight: bold;
    text-transform: uppercase;

	color: #222; 
	background-color: #E3ECFA;
}

.sectionSubHdr
{
    position: relative;
	padding: 5px;
    color: #222;
	background-color: #DFE8F6;
}

.sectionSubHdr label
{
    margin-right: 2em;
}

.sectionHdr-rounded-corner-left,
.sectionHdr-rounded-corner-right,
.sectionSubHdr-rounded-corner-left,
.sectionSubHdr-rounded-corner-right 
{
    position: absolute;
}

.sectionHdr-rounded-corner-left, 
.sectionHdr-rounded-corner-right 
{
    top: 0;
    background: transparent url(../Images/SectionHdr-rounded-corners.png) no-repeat;
}

.sectionHdr-rounded-corner-left
{
    left: 0;
    background-position: left top;
}
.sectionHdr-rounded-corner-right 
{
    right: 0;
    background-position: right top;
}


.sectionSubHdr-rounded-corner-left, 
.sectionSubHdr-rounded-corner-right 
{
    bottom: 0;
    background: transparent url(../Images/SectionSubHdr-rounded-corners.png) no-repeat;
}

.sectionSubHdr-rounded-corner-left 
{
    left: 0;
    background-position: left bottom;
}
.sectionSubHdr-rounded-corner-right 
{
    right: 0;
    background-position: right bottom;
}
/*************** End admin pages ********************/
/*********************************/
.popup .x-window-body {padding: 10px 10px 10px 10px; color: Green;}
.popup-info {background:transparent url(../Images/icons/information.png) no-repeat top left;}

button.websiteATT {background:white url(../Images/att_logo.jpg) no-repeat; background-position: center;
                   padding: 0px 90px 0px 90px; height: 90px; width: 200px; border: solid 1px #7F89A8;}
button.websiteVerizon {background:white url(../Images/Verizon-logo.gif) no-repeat; background-position: center;
                   padding: 0px 90px 0px 90px; height: 90px; width: 200px; border: solid 1px #7F89A8;}
/*********************************/
.disputeTree .x-panel-body {background:#EEF1F7; padding:1px; text-align:left;}

.BillsTreeAmountColumn-hd   { text-align:right; }
.BillsTreeAmountColumn      { text-align:right; }
.BillsTreeException         { color:Red; }
.BillsTree .x-tree-node .x-tree-node-el { border-bottom:1px solid #DCE1FF; border-right:1px solid #DCE1FF; }

.ReportFilterTree .x-tree-node .x-tree-node-el { border-bottom:1px solid #DCE1FF; border-right:1px solid #DCE1FF; background-color:White; }
.NoTreeIcons .x-tree-node-icon { display:none; }
.NoTreeExpandButton .x-tree-ec-icon { display:none; }

.ReportFilterTree .x-tree-node-icon   { background-image:url('../Images/row-check-sprite-3state.gif'); }
.ReportFilterTree .TreeNodeUnchecked  { background-position:  2px 2px; }
.ReportFilterTree .TreeNodeChecked    { background-position:-23px 2px; }
.ReportFilterTree .TreeNodeBlue       { background-position:-48px 2px; }
.ReportFilterTree .TreeNodeNoIcon     { background-image:none; }

.TriStateUnchecked { background:url('../Images/row-check-sprite-3state.gif') no-repeat   0px 4px; height:18px; margin:0px; }
.TriStateChecked   { background:url('../Images/row-check-sprite-3state.gif') no-repeat -25px 4px; height:18px; margin:0px; }
.TriStateBlue      { background:url('../Images/row-check-sprite-3state.gif') no-repeat -50px 4px; height:18px; margin:0px; }

.x-grid3-row-checker, .x-grid3-hd-checker { background-image:url('../Images/row-check-sprite-3state.gif'); }
.checkbox3rdstate .x-grid3-row-checker { background-position:-48px 2px;}
.checkbox3rdstate .x-grid3-hd-checker  { background-position:-48px 1px;}

.RadioGroupFix .x-panel-body { padding:0px; }                      /* To Reduce spacing. */
.RadioGroupFix .x-form-item { margin-bottom:0px; font-size:11px; } /* To Reduce spacing and to match other fonts in panel. */

.x-grid3-hd-row .ux-filtered-column .cfg-funnel-header { background:url('../Images/funnel.gif') center no-repeat; padding-left:14px; margin-right:-6px; }

/* Override .portlet center alignment for tree column headers */
.x-tree-headers {text-align:left;}

.ci-selCol { border: solid 1px Red;}

.ci-layout {visibility:hidden;}

/* Required by Ext.ux.grid.GridSummary plugin */
.x-grid3-gridsummary-row-inner					{overflow:hidden;width:100%;}   /* IE6 requires width:100% for hori. scroll to work */
.x-grid3-gridsummary-row-offset					{width:10000px;}
.x-grid-hide-gridsummary .x-grid3-gridsummary-row-inner		{display:none;}

/* Make GridSummary row stand out a little bit. */
.x-grid3-gridsummary-row-inner      { background-color:#E8EBF7; border-top:1px solid #CCE9FF; }

.ReportHelpCardSectionHeading { font-family:Arial; font-size:12px; font-weight:bold; display:block; height:20px; }