/* Bill Pay branding styles */

/* client specific frame sizes start */
body{font:12px verdana; color:#333333;}
body.client{margin:0; padding:0; text-align: center;min-width: 859px; background:URL(i/bg_body_gradient.gif) repeat-x;} /* set to center container */
table, td, div, span, form, input, select, TEXTAREA{border-collapse:collapse;}
.client #wrapper {margin:0 auto;width:859px;text-align: left; background:#fff;} /* set to center container */
/* client specific frame sizes end */

#clienthead{background:url(i/bg_ep_clienthead.gif) no-repeat; width:859px; height:164px; position:relative;}/* this is the div that contains the client specific header */
.clientlogo{position:absolute; top:31px; display:block; width:270px; height:56px;}/* this is the client logo anchor inside clienthead */

.trail{margin:0 10px; font:10px verdana; color:#333333; background:#ccebf5; padding:3px;} /* this is the crumb trail for the top of every page */
#signout{float:right; font:11px verdana;}
table.fitted{width:100%;}	
#mainpanel{padding:10px;font:11px verdana; color:#333333;} /* This is the main panel of the page */
#mainpanel div,#mainpanel span,#mainpanel table,#mainpanel td {} /* set base font and color if needed */
#mainpanel h1{margin:0; padding:3px; font:bold 16px arial; color:#333333;} /* main panel / page title */
#mainpanel h2{font:bold 12px verdana; margin:3px 0; padding:0;} /* main panel sub title */
#mainpanel ol, #mainpanel ul{margin-top:0; padding-top:3px;} /* main panel ordered list */

#mainpanel .conttop{}
#mainpanel .cont1{border:solid 1px #dddddd; margin-bottom:10px; width:837px;} /* container */
#mainpanel .cont1 h1{margin:0; border-bottom:none; padding:3px; font: bold 12px verdana; background:#ccebf5; color:#333333;} /* container title */
#mainpanel .cont1 h2{margin-bottom:0; margin-left:0;} /* container sub title */
#mainpanel .cont1 h2.padt10{padding-top:10px;} /* container sub title */
#mainpanel .contbottom{border:none; margin-bottom:10px;}


.paytotal{border-top:solid 1px #74a0ca; padding:3px; font:bold 14px verdana; background:#7eadda;}
.paytotal span{font:bold 14px verdana;}
.bordtop{}

#invoicelinks{margin:5px;} /* used to style the links for invoice viewing */
#invoicelinks a:link, #invoicelinks a:visited, #invoicelinks a:active{margin:3px 10px 3px 3px;}
a{color:#3a5dff;}
a:visited{color:#002783}


.myservices{} /* container wraper for my services */
.myservices h2{font:bold 12px verdana; margin:0 0 5px 0; padding:0;} /* sub heading for my services */
.myservices h3{font:bold 12px verdana; margin:10px 0 5px 0; padding:0;} /* sub heading for my services */
.servicepanel1{width:50%; vertical-align:top; padding:5px;} /* left panel */
.servicepanel2{width:50%; border-left:solid 1px #ebebeb; vertical-align:top; padding:5px;} /* right panel */

#accountstatus{} /* use to set styles for account stutus paymentcontainer */
autopay{} /* use to set styles for auto pay container */
#myaccountinfo{} /* use to set styles for my account info container */
#autopay{} /* use to set styles for my account info container */
#userinfo{} /* use to set styles for user information page */
#billinghistory {} /* use to set styles for billing history page */


.odd{background:#ebebeb;} /* bg color for grid rows */
.banner{margin:5px; border:solid 1px #cccccc; padding:3px; background:#f5f5f5;} /* banner container */
.banner h2{margin:0; padding:0;} /* banner title */

.loginleft{width:60%; vertical-align:top; padding:5px;} /* login page left cell */
.loginright{width:40%; vertical-align:top; border-left:solid 1px #cccccc; padding:3px; background:#FFF;} /* login page right cell */ 
.rtcont{padding:10px; border-top:solid 1px #cacaca;}
.highlight{background:#ffff00;}

.bhgrid {border:1px solid #808080; border-collapse:collapse; background:#FFF;}
.bhgrid  th{background:#ccebf5; padding:3px; border-bottom:solid 1px #808080;}
.bhgrid  td{border-bottom:solid 1px #bebebe; border-right:solid 1px #dfdfdf; padding:3px 5px;}
.bhgrid .2row th{background:url(/common/includes/images/grid_th_bg_2row.gif); background-repeat:repeat-x;}


#billhistory .payment{background:#e5f3fb } /* payment row bg for billing history grid */
#billhistory .invoice{background:#} /* invoice row bg for billing history grid */
#billhistory .latefee{background:#caa6a6} /* latefee row bg for billing history grid  */
#billhistory .pendingpayment{background:#ccebf5} /* payment row bg for billing history grid */

/* message containers */
.cmes_confirm{border:solid 1px #46ade2; background:#ccebf5 url(i/circheck_small.png) no-repeat 3px 5px; margin:10px; padding: 0px 5px 5px 25px; margin-left:auto; margin-right:auto; text-align: left; width:auto;}
.cmes_confirm h1, .cmes_mes h1, #mainpanel .cont1 .cmes_mes h1{font: bold 13px arial; color:#000d32; text-decoration:none; margin:0; padding:0; background:#ccebf5;}
.cmes_confirm ol, .cmes_confirm ul, .cmes_errorsm ol, .cmes_errorsm ul{margin-top:0; margin-bottom:0;}
.cmes_confirm li, .cmes_errorsm li{padding-top:5px;}
.cmes_mes{background:#ccebf5 url(i/circheck_green.gif) no-repeat 3px 3px; margin:10px; border:solid 1px #4eb1e4; padding: 5px 5px 5px 50px;} /* confirmation message panel */
.cmes_error{margin:5px 10px; border:solid 1px #660000; padding:5px 5px 10px 45px;background-color:#FFFFFF;background-image: url(i/icon_excl_lrg2.gif);background-position:5px 5px;background-repeat: no-repeat;}
.cmes_errorsm{background:#caa6a6 url(i/icon_excl_med.gif) no-repeat 3px 3px; margin:10px; border:solid 1px #660000; padding: 5px 5px 5px 25px; width:auto; margin-left:auto; margin-right:auto; text-align: left}
.error{color:#660000;}
.cmes_errorsm h2, .cmes_errorsm h2{font: bcaa6a6old 13px arial; color:#000; text-idecoration:none; margin:0; padding:0}

.cmes_alarm{border:solid 1px #660000; padding:5px; margin:10px;}
.cmes_alarm h1, #mainpanel .cont1 .cmes_alarm h1{background:#FFFFFF url(i/caution.png) no-repeat top left; margin:0 0 10px 5px; border:none; padding:5px 0 5px 32px; font:bold 14px verdana; color:#000000;}
.cmes_alarm p{margin:5px 0px; padding:0px;}



#paytable{border:solid 1p #b7b7b7; background:#ccebf5; width:400px; padding:5px;}
.button, input.button{}
input.buttonts{font: 10px verdana;}

body#mail{text-align: center;min-width: 600px;} /* set to center container */
#mail #wrapper {margin:0 auto;width:600px;text-align: left;} /* set to center container */

#mail #mainpanel{border:solid 1px #e1e1e1; padding:0; font:11px verdana; color:#333333;} /* This is the main panel of the page */
#mail #mainpanel div,#mainpanel span,#mainpanel table,#mainpanel td {} /* set base font and color if needed */
#mail #mainpanel h1{margin:0; padding:3px; font:bold 16px arial; color:#333333;} /* main panel / page title */
#mail #mainpanel h2{} /* main panel sub title */
#mail #mainpanel ol, #mainpanel ul{margin-top:0; padding-top:3px;} /* main panel ordered list */
#mail .button{border: solid 1px #003c74; background:#f4f4f0; color:#000000; padding:3px; text-align:center; text-decoration:none;}
#mail .buttonts{}


.pad3{padding:3px;}
.pad5{padding:5px;}
.padt10{padding-top:10px;}
.mart10{margin-top:10px;}
.fr{float:right;}
.b{font-weight:bold;}
.tar{text-align:right;}
.ts{font:11px verdana;}
.lbl{vertical-align:top; text-align:right; padding:2px;}
.lblt{text-align:right; padding:4px 2px 2px 2px; vertical-align:top;}
.fld{text-align:left; padding:2px;}
.fld img, .fld input, .fld select{vertical-align:middle;}
.fld input, select{font:8pt verdana;}
.req{font:bold 12px verdana; color:#660000;}
.langtog{float:right; margin-right:5px;}
th{background:#ccebf5;}
/* popup page styles */
#pop{color:#333333}
#pop h1{background:#ccebf5; margin:0 0 5px 0; border-bottom:solid 1px #46ade2; padding:3px; font:18px arial; color:#414141;} 
#popbod {padding:3px 10px;}
#popbod h2{font:bold 13px verdana; color:#333333; margin:10px 0 3px 0; padding:0;}

#signout{} /* sign out link at top of page */
.click{cursor:hand;}
p{padding:5px;}
p.first{padding:3px 5px 5px;}


.cont2{border:solid 1px #c1c2b4; background:#ebebeb; padding:5px;}
.cont2 h2.first{padding-top:0; margin-top:0;}

.oddselect{margin-top:10px; padding:3px; background-color:#f8a348;width:400px;}
.odd{margin-top:10px; padding:3px; background-color:#ebebeb;width:400px;}
.flderror{display:block; background: url(i/error_sm.png) no-repeat; padding-left:15px; font: bold 11px verdana; color:#660000;}

.helptip{border:solid 1px #c1c2b4; background:ccebf5; padding:3px;}

/* tabke grid styles */
.grid{border:solid 1px #dedede; border-collapse:collapse; background:#FFF; margin:0; padding:0; border-collapse:collapse;}
.grid th{background:#ccebf5; font-weight:normal;}
.grid th, .grid td{border:solid 1px #dedede; padding:5px;}


/* Invoice styles */
#invoice{border:solid 1px #cacaca; width:100%;}
#contactinfo{float:right; margin:10px; font:10px verdana;}
#logo{margin:5px;}
#billto{clear:right; float:left; margin:10px;}
#payment{float:left; margin:10px;}
#lineitems{clear:left; margin:10px;}
#lineitems th{font-weight:bold; background:#ccebf5; border:solid 1px #cacaca; padding:3px;}
#lineitems td{border:solid 1px #cacaca; padding:3px;}
#lineitems .total td{font:bold 14px verdana;}
#lineitems .total td.nb{border:none;}

/* pagination */
.pagination{float:right; padding-right:5px; font:10px verdana; text-align:right;}
.pagination a:link, .gridcontrols .pagination a:visited, .pagination a:hover{font:11px verdana; color:#03183c;}
.pagination a.current:link, .gridcontrols .pagination a.current:visited{font:bold 12px verdana; color:#333333; text-decoration:none;}

.tac{text-align:center;}
.nb{border:none;}