﻿/* Generic stylesheet */
*
{
    margin: 0;
    padding: 0;
}
*{ -webkit-text-size-adjust:none; }
*  {  outline: none; /* Dont let IE outline everything */ }
.field-validation-valid, .validation-summary-valid
{
    display: none;
}
.validation-summary-errors
{
    display:inline;
    color: #f00;
}
body
{
    font-size: .85em;
}
.ajax_load
{
    display: block;
    height: 50px;
    width: 50px;
    background: url('../Images/ajax_loading.gif') 0 0 no-repeat;
}
.blue
{
    color: #00a;
    font-weight: bold;
}
.lite
{
    font-size: 9pt;
}

select.short
{
    width: 165px;
}
.extra
{
    display: block;
    width: 400px;
    float: left;
}
select.extra
{
    width: 405px;
}
.standard
{
    display: block;
    width: 200px;
    float: left;
}
.max-standard
{
    display: block;
    max-width: 350px;
    float: left;
}
select.standard
{
    width: 205px;
}
select.max-standard
{
    max-width: 355px;
}
h2
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14pt;
}
h4
{
    margin: 5px 0 5px 0;
}
p
{
    margin: 2px 0 2px 0;
}
.ten
{
    font-size: 10pt;
}
.eleven
{
    font-size: 11pt;
}

body
{
    font-family: Arial, Helvetica, sans-serif;
}
.single
{
    margin-bottom: 0px;
}

.double
{
    margin-bottom: 15px;
}
.color_text
{
    color: #000;
}
.red
{
    color: #F00;
}

.fine, 
.fine p
{
    font-size: 9pt;
}
.font_normal
{
    font-size: 11pt;
    font-weight: normal;
}
.fine_alert { color: #F00; font-size: 8pt;}
/******** Header ********/
#main, #top
{
    width: 1000px;
    margin: 0 auto;
}
#logo, 
#header
{
    height: 100px;
    float: left;
}
#logo
{
    width: 300px;
    background: url('../Images/Genericlogo.png') 0 0 no-repeat;
}
#header
{
    width: 694px;
}

/******** Navigation ********/
#nav
{
    background-color: #555;
    height: 25px;
}
#nav
{
    clear: both;
    height: 50px;
}
#nav ul
{
    list-style: none;
    margin: 0px;
    padding: 0px;
}
#nav ul li
{
    float: left;
}
#nav ul li a
{
    display: block;
    text-decoration: none;
    color: #FFF;
    padding: 10px;
}
.top_sub_menu
{
    overflow: auto;
    padding: 3px;
}
.top_sub_menu ul
{
    list-style: none;
}
.top_sub_menu ul li
{
    float: left;
}
.top_sub_menu ul li a
{
    color: #fff;
    text-align: center;
    font-size: 9pt;
    font-weight: bold;
    text-decoration: none;
    background: #aaa;
    padding: 5px 0 5px 0;
    margin: 2px;
    width: 135px;
    display: block;
}
.top_sub_menu ul li a:hover
{
    background: #eee;
    color: #333;
}

/******** center content ********/
#loginErrorMessage
{
    position: relative;
    top: 10px;    
}

/******** ACCOUNT OVERVIEW GRID ****/
.red_past_due
{
    color: #f00;
}
.red_past_due img
{
    float:left;
    margin-top: -2px;
}
.black_past_due
{
    color: #000;
}
.black_past_due img
{
    float:left;
    margin-top: -2px;
}
.removeAccountColumn
{
    height: 20px;
    width: 20px;
}
.RedX, .RedXDisabled
{
    height: 12px;
    width: 12px;
    display:block;
    background: url('../Images/RedX.png') 0 0 no-repeat;
    margin: 0 auto;
    cursor: hand;
    cursor: pointer;
}
.RedX:hover
{
    background: url('../Images/RedX.png') 0 -12px no-repeat;
}
.RedXDisabled
{
      background: url('../Images/RedXDisabled.png') 0 0 no-repeat;
     cursor: hand;
    cursor: pointer;
}
.ExclamationPoint
{
    height: 19px;
    width: 18px;
    display: inline;
    background: url('../Images/ExclamationPoint.png') 0 -2px no-repeat;
    margin: 0 auto;
    cursor:default;
    float: right;
}
/******* BUTTONS *********/
.excel_button
{
    display: block;
    background: url('../Images/excel.png') top right no-repeat;
    height: 20px;
    width: 100px;
    text-decoration: none;
    overflow: hidden;
    color: #000;
    padding-right: 25px;
    padding-top: 2px;
    margin-bottom: 2px;
}
.excel_button:hover
{
    text-decoration: underline;
}
.pdf_icon
{
    display: block;
    height: 32px;
    width: 30px;
    background: url('../Images/pdf_icon.png') top right no-repeat;
    margin: 0 auto;
    margin-top: 0px;
    border: 1px solid #FFF;
}
.pdf_icon:hover
{
    border: 1px solid #08F;
}
.ut_button_wrapper
{
    overflow: hidden;
    width: 100%;
}
.ut_button_sibling
{
    float: left;
    margin-right: 5px;
    margin-top: 3px;
}
.ut_button:active, .green_button:active, .bold_button:active, .ut_button_mid:active, .ut_button_large:active
{
    background-position: 0 -26px;
}
.ut_button, .green_button, .bold_button, .ut_button_mid, .ut_button_large
{
    font-size: 12px;
    line-height:100%;
    white-space: nowrap;
    color: #333;
    display:block;
    text-decoration:none;
    padding: 7px 0 7px 0;
    text-align:center;
}
.ut_button, .green_button, .bold_button
{
    width: 90px;
    background: url('../Images/button_small.png') 0 0 no-repeat;
}
 .ut_button_large, .green_button_large, .bold_button_large
 {
     width: 180px;
     background: url('../Images/button_large.png') 0 0 no-repeat;
 }
.ut_button_mid, .green_button_mid, .bold_button_mid
{
    width: 130px;
    background: url('../Images/button_mid.png') 0 0 no-repeat;
}
.green_button
{
    color: #003300;
}

.disabled
{
    /* background: url('../Images/GreyButtonRightDisabled.png') top right no-repeat;*/
    cursor: default;
    color: #888;
    opacity:0.7;
    filter:alpha(opacity=70); /* For IE8 and earlier */
}

/*
.disabled span
{
    
     background: url('../Images/GreyButtonLeftDisabled.png') top left no-repeat;
} 
*/
.disabled:active
{
    background-position: top right;
}
.disabled:active span
{
    background-position: top left;
    color: #999;
}

/*************** Statement History ***************/
#suppression
{
    overflow: visible;
    width: 555px;
    color: #006400; 
    margin: 10px 0;
    height: 60px;
    background: url('../Images/recycle.png') 0 0 no-repeat;
    padding-left: 75px;
    font-style: italic;
    font-weight:bold;
}
#suppression div
{
    float:left;
    margin-top: 13px;
}
#suppression a
{
    clear:none;
    float:right;
    color: #006400; 
}
#suppression span
{
    font-size: 1.25em;
    font-weight:bold;
}
.account_detail_right 
{
    text-align:center;
}
#statementHistoryEnroll     
{
    position:relative;
    top: 10px;
}

/*************** Unordered Lists ***************/
.enroll_steps .selected_step
{
    background: #ccc;
}
.enroll_steps
{
    margin: 5px 0 15px 0;
}
.enroll_steps ul
{
    list-style: none;
}
.enroll_steps li
{
    float: left;
    margin-left: 15px;
    font-size: 8pt;
}
.enroll_steps li div
{
    text-align: center;
    font-weight: bold;
    font-size: 8pt;
    padding: 0px 5px 0px 5px;
}

ul.no_bullet
{
    list-style: none;
    margin-left: 25px;
}
ul.no_bullet li
{
    margin-top: 15px;
}
.dash-list
{
    font-size: 10pt;
    margin: 10px 0px 10px 5px;
    list-style: none;
}
.dash-list li
{
    margin-top: 5px;
}
/* ACCOUNT DETAIL TAB */
.CheckMark
{
    height:30px;
    width: 30px;
    float:left;
    clear:both;
}

.CheckGreen
{
    background: url('../Images/CheckGreen.png') top left no-repeat;
}
.CheckBlack
{
    background: url('../Images/CheckBlack.png') top left no-repeat;
}
.panel_container
{
    display: none;
    padding: 10px;
    font-size: 10pt;
    overflow:auto;
}
.account_detail ul
{
    list-style: none;
}
.account_detail ul li
{
    display: inline;
}
.account_detail ul li a
{

}
div.selected_tab
{
    text-align: left;
    clear: both;
    border: 1px solid #aaa;
    display: block;
    padding: 10px;
    background: #fff;
}
div.selected_tab p
, .visible
{
    margin-top: 10px;
    overflow: auto;
}

div.no_selected_tab
{
    display:none;
}
a.selected_tab, 
a.no_selected_tab
{
    display: block;
    float: left;
    height: 26px;
    margin-right: 0px;
    padding-right: 42px;
    text-decoration: none;
    color: #000;
    text-align: center;
}
a.selected_tab span, 
a.no_selected_tab span
{
    display: block;
    padding: 6px 0 6px 15px;
    line-height: 14px;
    font-size: 9pt;
    font-weight: bold;
}
a.selected_tab
{
    background: url('../Images/selectedTabRight.png') top right no-repeat;
}
a.selected_tab span
{
    background: url('../Images/selectedTabLeft.png') top left no-repeat;
}
a.no_selected_tab
{
    background: url('../Images/noSelectedTabRight.png') top right no-repeat;
}

a.no_selected_tab span
{
    background: url('../Images/noSelectedTabLeft.png') top left no-repeat;
}

.plus, 
.minus
{
    float: left;
    display: block;
    width: 15px;
    height: 15px;
}
.plus
{
    background: url('../Images/plus.png') top right no-repeat;
}
.minus
{
    background: url('../Images/minus.png') top right no-repeat;
}

.toggle_minus, 
.toggle_plus
{
    display: block;
    height: 20px;
    width: 20px;
    float: left;
    position:relative;
    margin-right: 4px;
    top: -2px;
}
.toggle_minus
{
    background: url('../Images/toggle_minus.png') top right no-repeat;
}
.toggle_plus
{
    background: url('../Images/toggle_plus.png') top right no-repeat;
}
.visible_box
{
    text-align: left;
    clear: both;
    border: 1px solid #aaa;
    display: block;
    padding: 10px;
    background: #fff;
}
.visible_box p, 
.visible
{
    margin-top: 10px;
    overflow: auto;
}
.invisible_box, 
.invisible
{
    display: none;
}
.dynamic_content p
{
    margin: 20px 0px 20px 0px;
}

/******** TABLES ********/
/*
.accountColumn
{
    white-space:nowrap;
}*/
.account_detail_right { width: 300px; text-align: center;}
table.fields
{
    border-spacing: 0px;
}
table.fields tr td
{
    padding: 3px 5px 3px 0;
}
table tr
{
    margin: 0px;
    padding: 0px;
}
table tr td
{
    padding: 0px 3px 0px 0;
}

table tfoot tr td
{
    text-align:left !important;
}

div.data
{
    font-size: 10pt;
    margin: 0px 0px 10px 0px;
}
.data th
{
    font-size: 8pt;
    height: 30px;
}
div.data table
{
    width: 100%;
    margin: 0;
}
div.data table th a
{
    text-decoration:none;
    color: #000;
    margin-right: 3px;
}
div.data table tr td
{
    font-size: 9pt;
    height: 25px;
}
div.data table, 
div.data table th, 
div.data table td
{
    border-collapse: collapse;
    border: 1px solid #aaa;
 /*   padding: 3px 5px 3px 5px;*/
 padding: 3px;
    text-align: center;
}
table.inline_table, 
table.inline_table tr, 
table.inline_table td
{
    border: 0px;
    padding: 0;
    margin: 0;
}
/** Boxes **/
.outline_box
{
    margin: 0px;
    padding: 0px;
    border: none;
}

.div_balanced
{
    text-align: left;
    width: 500px;
}
.outline_box table td
{
    /*padding-right: 15px;*/
}
.solid_box
{
    padding: 5px;
    border: 1px solid #000;
    background: #eee;
    overflow: auto;
}
.solid_box table
{
    width: 100%;
}
.solid_box table td
{
    padding: 5px;
}
.solid_box table td.right
{
    text-align: right;
    float: right;
}

/** Page level containers **/
.no_wrap
{
    white-space:nowrap;
}
.no_wrap h4, .no_wrap p
{
    display:inline;
}
.content_padding
{
    padding: 15px;
}
.div_left_nomar, 
.div_right_nomar, 
.div_center_nomar, 
.div_left, 
.div_right, 
.div_center, 
.div_clear, 
.div_module, 
.gray_underline
{
    display: block;
    overflow: auto;
}

.div_left, 
.div_right, 
.div_center, 
.div_clear, 
.div_module
{
    margin: 10px 0 10px 0;
}

.div_left, 
.div_left_nomar
{
    float: left;
}

.div_right, 
.div_right_nomar
{
    float: right;
    text-align: right;
}

.div_left_nomar, 
.div_right_nomar
{
    margin: 0px;
}

.div_center, 
.div_center_nomar
{
    text-align: center;
    margin: 0 auto;
    margin-top: 10px;
    margin-bottom: 10px;
}

.div_clear, 
.div_center
{
    clear: both;
}
.gray_underline
{
    margin: 25px 0 0 0;
}
.div_module
{
    border-bottom: 2px solid #999;
    padding: 5px 0 5px 0;
}
.gray_underline
{
    border-bottom: 1px solid #aaa;
    padding-top: 5px;
}
.half
{
    width: 400px;
}

.vert_nomar
{
    margin: 0px;
}
.horz_margin
{
    margin-left: 5px;
    margin-right: 5px;
}
.horz_margin_large
{
    margin-left: 15px;
    margin-right: 15px;
}
.vert_margin
{
    margin: 5px 0 5px 0;
}
.vert_margin_med
{
    margin: 10px 0 10px 0;
}
.vert_margin_large
{
    margin: 20px 0 20px 0;
}
.top_margin
{
    margin-top: 25px;
}
.top_margin_large
{
    margin-top: 50px;
}

.div_balanced
{
    margin: 0 auto;
}
.div_empty
{
    min-height: 300px;
}
.centered
{
    text-align: center;
    margin: 0 auto;
}
#email_criteria
{
    float: left;
    position: relative;
    left: 20px;
    top: 12px;
    width: 340px;
}
#email_criteria li
{
    margin-bottom: 6px;
}
.left, 
.right
{
    margin: 0px;
    padding: 0px;
    display: block;
}
.left
{
    float: left;
}
.right
{
    float: right;
    margin-left: 15px;
}
.text p
{
    margin: 10px;
    font-size: 11pt;
}
.information_panel
{
    margin-left: 5px;
}
/******** LOGIN *********/
#newUser
{
    position: relative;
    top: 20px;
}

#newUser
{
    position: relative;
    float:left;
    top: -90px;
    left: -100px;
    width: 150px;
    text-align:left;
    color: #000066;
    padding-left: 10px;
}
#newUser a
{
    margin-top: 5px;
    left: 20px;
}
#submit_link
{
    position: relative;
    top: 20px;
    left: 30px;
}

/******** Footer ********/
#footer
{
    height: 75px;
    width: 1000px;
}
.clear, #footer
{
    clear: both;
    display: block;
}
#divTerms
{
    /*max-height: 50px;*/
    
}
.terms ,.terms_pad
{
    text-align: center;
    font-weight: bold;
    font-size: 11pt;
}
.terms_pad
{
    padding: 10px;
}

/******** MVC Specific styles********/
.field-validation-error
{
    color: #F00;
    font-size: 9pt;
}

/******** Account Summary *********/

#account_balance table
{
    float: left;
    margin-right: 20px;
}


/******** Enrollment     *********/

#divAccountBox
{
    padding: 15px 0px 10px 0px;
}

#get_adobe
{
    display:block;
    height: 30px;
    width: 160px;
    line-height: 27px;
    text-decoration:none;
    background: url("../Images/Adobe.png") top right no-repeat;
    font-weight: bold;
    font-size: 10pt;
    margin: 0 0 15px 0;
    
}
#get_adobe:visited
{
    color: #00f;
}

#accountDetailButtons table, 
#accountDetailButtons table tr,
#accountDetailButtons table tr td
{
    border: 0px;
}
#accountDetailButtons table tr td
{
    padding: 8px 0 8px 0;
}
#gridSubText
{
    font-size: 8pt;
    width: 500px;
    float: right;
    text-align:left;
    margin-top: 0px;
    margin-bottom: 10px;
}
.not_visible
{
    display:none;
}

/****** Outline boxes******/
.ssBox, .ssBoxColor
{
    margin:0 auto;
    max-width:1000px;
    padding: 20px;
}


.OutlineBox
{
    text-align: center;
}
/************************************ END Round corner dialog ****************************/
.green_lead
{
    font-family: Lucida Calligraphy;
    color: #006400;   
    font-size: 16px;
}

.sortUp
{
    background: url("../Images/sortUp.png") 95% center no-repeat;

}
.sortDown
{
    background: url("../Images/sortDown.png") 95% center no-repeat;
}

.green,
.green span
{
    color: #006400;
}

/* Account Grid Columns */
#thAccountNumber
{
    width: 85px;
}
/*
#thServiceAddress
{
    width: 115px;
}*/
#thAccountBalanceAmount
{
    width: 65px;
}
#thDueDate
{
    width: 67px;
}
#thCurrentBill
{
    width: 47px;
}
#thPayMyBill
{
    width: 90px;
}
#thEnrolled
{
    width: 90px;
}
#thAutoPay
{
    width: 90px;
}
#thRemoveAccount
{
    width: 50px;
}

/************** STATEMENT HISTORY GRID *************/
.statementHistoryHeader ,.statementHistoryHeader a
{
    font-size: 12px !important;
    height: 30px;
}
.paperlessColumn, .lastPaperBillColumn {font-weight: bold;}
.paperlessColumn {color: #005b2c;}
.lastPaperBillColumn {color: #FF0000;}        


/******** Table formatting for Unconfirmed.aspx *********/
#unconfirmed, #unconfirmed_header
{
    margin-left: 100px;
}
#unconfirmed
{
     width: 500px;
}
#unconfirmed tr td ,#unconfirmed_header tr td
{
    padding: 5px;
    white-space: nowrap;
}
#unconfirmed tr td.indent
{
    padding-left: 50px;
}
#unconfirmed tr td.right
{
    text-align:right;
}
#unconfirmed tr td.validation_cell
{
    width: 200px;   
}

.CancelService
{
    display:none;
}
.CancelService ul li {margin: 5px 0;}
.PlainTextLink, .CancelService .label
{
    display:block;
    font-weight:bold;
}
.PlainTextLink
{
    margin: 25px 0 5px 0;
    text-decoration:none;
    color: #000;
    font-style: italic;
}
.PlainTextLink:hover
{
    color: #F00;
}
.CancelService .label
{
    color: #000;
}
.CancelService ul
{
    list-style:none;
    margin: 5px 75px;
}
#txtOtherReason
{
    margin: 5px 75px;
    width: 600px;
    height: 75px;
    resize:none;
    float:left;
    clear:both;
}
#btnCloseAccount
{
    clear:both;
    position:relative;
    left: 550px;
}
#panel3
{
   /* height:auto;
    overflow: auto;*/
}
#liveLookbutton
{
    background: url("../Images/ShareScreenLOGO.png") 0 0 no-repeat;
    width: 100px;
    height: 50px;
    display:none;
}
#average-bill
{
    display: none;
    clear: both;
    margin: 10px 0px;
    float: left;
}

.quick-bill
{
    border: 1px solid #aaa;
    width: 965px;
    border: 1px solid #aaa;
    overflow:auto;
    padding: 5px;
}
.quick-bill > div
{
    width: 470px;
    float: left;
    margin-left: 5px;
    color: #333;
    font-size: 14px;
}
.quick-bill > div.right
{
    float:right;
}
.quick-bill a
{
    margin-top: 5px;
    clear: both;
    font-size: 12px;
    font-weight:normal;
    color: #000;
    width: 90px;
    border: none;
    text-align:center;
    padding: 7px 0 7px 0;
    margin: 0 auto;
}
.quick-bill a:active
{
    background-position: 0 -26px;
}
.quick-bill-paperless
{
    width: 100%;
    height: 75px;
    text-align: center;
    
}
.quick-bill-paperless > div 
{
    display: inline-block;
    background: url('../Images/recycle.png') 0 5px no-repeat;
    margin: 0 auto;
    padding: 20px 0 20px 70px;
    height: 40px;
    margin-top: 5px;
}
#qb-contents div
{
    display: inline;
}
.quick-bill-paperless .ut_button
{
    display: inline-block;
    position:relative;
    top: -2px !important;
    left: 5px !important;
    color: #006400  !important;
    font-style: italic;
    font-weight: bold !important;
}
#dialog-form
{
    background: #FFF;
}
.invoice-area table tr th, .invoice-area table tr td
{
    padding-left: 15px;
    padding-right: 15px;
}