﻿@media only screen and (max-width: 700px) {
    input,
    textarea,
    button,
    select,
    a {
        -webkit-tap-highlight-color: rgba(0,0,0,0);
    }

    .two-column-left,
    .two-column-right {
        float: none;
        width: 100%;
    }

    .center {
        width: 100%;
        margin: 0 auto;
        padding-top: 0px !important;
    }

    .horiBar:not(.admin) {
        display: none;
    }

    /*.GeneralColorTable, .GeneralColorTD, .GeneralColorTR {
        background-color: #0165C5;
        color: White;
    }*/


    .SiteHeader {
        max-width: 100%;
    }

    .main {
        width: 100%;
    }

    #wrap {
        width: 100%;
    }

    .horiBar.top:not(.admin) {
        display: none;
        width: 100%;
        height: 28px;
    background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.4));
    background-color: #003c80;
    }

    .SiteFooter {
        float: left;
        width: 100%;
        position: absolute;
        bottom: 0;
    }

    .LoginHeader {
        text-align: center;
        color: Black;
        display: none;
    }

    .LoginText .TextBox {
        width: 90%;
        height: 32px;
        font-size: 20pt;
    }

    .LoginBox {
        margin: 0 0 0 0;
    }

        .LoginBox .GeneralColorTD {
            padding-top: 50px !important;
        }

    #LoginColorBox {
        width: 100%;
        display: block;
    }

    .LoginLabel {
        width: 100px;
        padding-top: 3px;
        padding-bottom: 3px;
        font-size: 10pt;
    }

    .LoginPasswordCaseLabel {
        font-size: 10pt;
        font-weight: normal;
    }

    .LoginPasswordCaseLabelInner {
        padding-top: 1px;
        float: left;
    }

    .LoginButton {
        width: 150px;
        height: 40px;
        font-size: 14pt;
    }

    .LoginButtonOuter {
        float: left;
        padding-bottom: 15px;
    }

    .LoginHelpLabel {
        font-size: 11px;
        color: black;
        font-weight: normal;
    }

    .LogOutButton {
        color: white;
        font-weight: bold;
    }

    #Master_ContentWrapper {
        background-color: White;
        position:relative;
        margin: 0 0 0 0;
        z-index: -1; 
    }

    #Master_Right {
        min-height: 412px;
    }

    .CustomerSelectionButton {
        float: right;
        width: 130px;
        height: 40px;
        display: inline-block;
        border: 2px solid #a6a6a6;
        cursor: pointer;
        text-decoration: none;
        font-size: 12px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        /*text-shadow: 1px 1px 3px #444444;
        -moz-box-shadow: 0px 0px 0px 0px #444444;
        -webkit-box-shadow: 0px 0px 0px 0px #444444;
        box-shadow: 0px 0px 0px 0px #444444;*/
        color: #444444;
        background: #e9e9e9;
        margin-top: 5px;
        margin-bottom: 5px;
        margin-right: 8px;
        background-image: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(#d9d9d9));
        background-image: -moz-linear-gradient(top, #e9e9e9, #d9d9d9);
        background-image: -ms-linear-gradient(top, #e9e9e9, #d9d9d9);
        background-image: -o-linear-gradient(top, #e9e9e9, #d9d9d9);
        background-image: linear-gradient(top, #e9e9e9, #d9d9d9);
        filter: progid:DXImaGETransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#d9d9d9');
    }

        .CustomerSelectionButton > option {
            color: #444444;
        }

    .WelcomeLabel {
        float: left;
        padding-left: 20px;
        margin-top: 5px;
        margin-bottom: 5px;
        height: 40px;
        line-height: 40px;
        font-weight: bold;
    }

    .MenuButton {
        float: left;
        font-size: 32px;
        height: 40px;
        width: 20px;
        line-height: 40px;
        margin-top: 5px;
        margin-bottom: 5px;
        margin-right: 8px;
        color: #a6a6a6;
        padding-left: 10px;
        background-color: none;
        background-image: none;
        background: none;
        border: none;
    }


    .SelectCustomerView {
        background-color: #F1F1F1;
        width: 100%;
        float: right;
        border-top: 1px solid #a6a6a6;
        border-bottom: 1px solid #D4D4D4;
    }

    .CustomerSelectionMenu {
        background-color: #F1F1F1;
        width: 100%;
        height: 60px;
        margin-top: -9px;
    }

    /*Dashboard*/
    .DashboardOptionsTable {
        width: 100%;
        /*margin-left:auto;
        margin-right:auto;*/
        height: 30px;
        line-height: 30px;
        margin-top: 30px;
    }

    .DashboardOptionsTable2 {
        width: 100%;
        /*margin-left:auto;
        margin-right:auto;*/
        height: 50px;
        line-height: 25px;
        margin-top: 20px;
    }


    .snapshot_transactiondate {
        width: 70px;
        /*font-size: 8pt;*/
    }

    .snapshot_transactionid {
        width: 160px;
        /*font-size: 8pt;*/
    }

    .snapshot_transactionvalue {
        width: 50px;
        /*font-size: 8pt;*/
    }



    #menubar {
        width: 100%;
        background-color: #444;
        color: #fff;
    }

    .MobileMenu, #Master_ContentWrapper {
        display: inline;
    }

    /*
    #Master_ContentWrapper 
        {
        width:500px;
        background-color: #fff;
        z-index: 5;
        position: fixed;
        left: 0px;
        height: 100%;
    }*/

    .MobileMenu {
        float: left;
        /*width: 200px;*/
        height: 100%;
        position: fixed;
        z-index: 99;
        left: -250px;
        background-color: #808080;
        border-right: 2px solid #404040;
        top: 0;
    }

    .MenuItem {
        border-bottom: 1px solid White;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: white;
        font-size: 20px;
        text-shadow: 0px 2px 2px #404040;
        padding: 0px 11px;
        margin-top: -3px;
        white-space: nowrap;
    }

    .SelectedMenuItem {
        border-bottom: 1px solid White;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: white;
        font-size: 20px;
        text-shadow: 0px 2px 2px #404040;
        padding-left: 20px;
        background-color: #C0C0C0;
        margin-top: -3px;
    }


    .MenuItem a:link {
        color: White;
    }
    /* unvisited link */
    .MenuItem a:visited {
        color: White;
    }
    /* visited link */
    .MenuItem a:active {
        color: #404040;
    }
    /* selected link */

    .SelectedMenuItem a:link {
        color: White;
    }
    /* unvisited link */
    .SelectedMenuItem a:visited {
        color: White;
    }
    /* visited link */
    .SelectedMenuItem a:active {
        color: #404040;
    }
    /* selected link */

    #MenuList {
        width: 90%;
        float: left;
        list-style-type: none;
        padding: 0px;
        top: 0;
    }


    /* ProcessPayment.aspx */
    .paymentProcess_MainContainer {
        width: 100%;
        margin: 0 auto;
    }

    .paymentProcess_Submenu {
        width: 100%;
        margin: 0 auto;
        text-align: left;
        float: left;
    }

    .paymentProcess_TopTable {
        width: 100%;
        margin: 0 auto;
    }

    .paymentProcess_EntryForm {
        width: 100%;
        display: block;
    }

    .paymentProcess_BlueDiv {
        width: 100%;
        margin: 0 auto;
    }

    .processPayment_Input {
        width: 75%;
    }

    .acceptedCheck {
        text-align: center;
        background-image: url('images/checkSprite.png');
        background-repeat: no-repeat;
        margin-bottom: 30px;
        margin-left: -8px;
        width: 100%;
        height: 72px;
    }

    .acceptedASBCheck {
        float: left;
        background-image: url('images/asb-account-number.png');
        background-repeat: no-repeat;
        margin-left: 30px;
        margin-bottom: -8px;
        width: 100%;
        height: 42px;
    }

    .processPayment_FormColumn1 {
        width: 200px;
        padding-left: 1em;
    }



    /*Update Payment Info*/
    .updatePayment_Container {
        width: 100%;
        margin: 0 auto;
    }


    /*View Invoices (Billing History)*/
    .invoiceContainer {
        width: 100%;
        margin: 10px auto;
    }


    /*Service Request*/
    .serviceRequestContainer {
        width: 100%;
        margin: 0 auto;
    }

    /*Order Items*/
    .orderItemsContainer {
        width: 100%;
        margin: 0 auto;
    }

    /*Shopping Cart*/
    .cartContainer {
        width: 100%;
    }

    .ViewOrderSummaryTD {
        padding-left: 05px;
        padding-right: 05px;
        font-size: 10pt;
    }

    /*Manage Account*/
    .manageAccountContainer {
        width: 100%;
        margin: 0 auto;
        text-align: left;
        float: right;
        clear: both;
    }

    .manageAccountContainer2 {
        width: 100%;
        margin: 0 auto;
        clear: both;
    }

    .manageAccountContainer3 {
        width: 100%;
        margin: 0 auto;
    }

    .sectionHeader {
        padding-left: 10px;
        padding-right: 10px;
        height: 45px;
        margin-bottom: 10px;
    }


    /*Add Account*/
    .AddAccountContainer {
        width: 100%;
        margin: 0 auto;
    }

    .AddAccountBox {
        width: 90%;
        margin: 0 auto;
    }

    .ddlSvcCompany {
        width: 250px;
    }


    /*Update Customer Information*/
    .CustomerInfoTextboxs {
        width: 100%;
        margin: 0 auto;
    }

    .EditCustInfoText {
        color: #0063CB;
    }


    /*Profile_PaperlessBilling.aspx*/
    .inputDiv {
        float: left;
        width: 100%;
    }



    /*register new user*/
    .RegisterContainer {
        width: 205px;
        align-content: center;
        vertical-align: middle;
        margin: 0 auto;
    }

    /*Forgot Password*/
    .ForgotPassContainer {
        min-height: 415px;
        width: 100%;
    }

    .ForgotPassBox {
        margin: 0 auto;
        width: 90%;
    }



    /*Sign In help*/
    .SignInContainer {
        width: 100%;
        min-height: 415px;
    }

    .SignInBox {
        width: 90%;
        margin: 0 auto;
    }

    .SignInBoxHeaders {
        width: 100%;
        margin: 0 auto;
    }



    /*ViewServiceHistory_Mobile*/
    .snapshot_serviceHistoryDate {
        text-align: center;
        width: 65px;
        margin: 0 5px 0 5px;
        text-align: left;
    }

    .snapshot_serviceHistoryDesc {
        margin: 0 5px 0 5px;
        width: 350px;
    }

    .snapshot_serviceHistoryStatus {
        margin: 0 5px 0 5px;
        width: 150px;
    }

    .snapshot_serviceHistoryLoadMore {
        margin: 0 5px 0 5px;
        width: 75px;
    }
}


















@media only screen and (min-width: 700px) {
    /*.GeneralColorTable, .GeneralColorTD, .GeneralColorTR
    {	
        background-color:  #0165C5; color: White;	
    }*/

    .SiteHeader {
        width: 100%;
    }


    .SiteFooter {
        float: left;
        width: 100%;
    }

    .LoginText .TextBox {
        width: 200px;
    }

    .LoginBox {
        margin: 0 25px 0 25px;
    }

    #LoginColorBox {
        width: 435px;
        display: block;
    }

    .LoginLabel {
        width: 100px;
        float: left;
        padding-top: 3px;
    }

    .LoginPasswordCaseLabel {
        font-size: x-small;
        font-weight: normal;
        padding-top: 1px;
    }

    .LoginPasswordCaseLabelInner {
        width: 100px;
        float: left;
    }


    .LoginButtonOuter {
        float: right;
    }

    .LoginHelpLabel {
        font-size: small;
        font-weight: lighter;
    }


    #Master_ContentWrapper {
        width: 800px;
        margin: 0 auto;
        /*border: solid 1px black;*/
    }


    #Master_Right {
        min-height: 415px;
    }


    .SelectCustomerView {
        float: left;
    }

    .CustomerSelectionButton {
        width: 700px;
    }

    /*Dashboard*/
    .DashboardOptionsTable {
        width: 750px;
        margin: 0 auto;
    }

    .snapshot_transactiondate {
        width: 80px;
    }

    .snapshot_transactionid {
        width: 190px;
    }

    .snapshot_transactionvalue {
        width: 80px;
    }

    /* ProcessPayment.aspx */
    .paymentProcess_MainContainer {
        width: 775px;
        margin: 0 auto;
    }

    .paymentProcess_Submenu {
        width: 100%;
        margin: 0 auto;
        text-align: left;
    }

    .paymentProcess_TopTable {
        width: 750px;
        margin: 0 auto;
    }

    .paymentProcess_EntryForm {
        width: 750px;
        display: block;
    }

    .paymentProcess_BlueDiv {
        width: 750px;
        margin: 0 auto;
    }

    .processPayment_Input {
        width: 90%;
    }

    .acceptedCheck {
        clear: both;
        margin: 0 auto;
        background-image: url('images/checkSprite.png');
        background-repeat: no-repeat;
        width: 350px;
        height: 72px;
    }

    .acceptedASBCheck {
        float: left;
        background-image: url('images/asb-account-number.png');
        background-repeat: no-repeat;
        margin-left: 30px;
        margin-bottom: 30px;
        width: 350px;
        height: 42px;
    }


    .processPayment_FormColumn1 {
        width: 170px;
        padding-left: 1em;
    }

    /*View Invoices (Billing History)*/
    .invoiceContainer {
        width: 750px;
        margin: 0px auto;
    }

    /*Service Request*/
    .serviceRequestContainer {
        width: 750px;
        margin: 0 auto;
    }

    /*Order Items*/
    .orderItemsContainer {
        width: 750px;
        margin: 0 auto;
    }

    .ViewOrderSummaryTD {
        padding-left: 15px;
        padding-right: 15px;
        font-size: 10pt;
    }

    .sectionHeader {
        padding-left: 10px;
        padding-right: 10px;
        height: 20px;
        margin-bottom: 10px;
    }


    /*Add Account*/
    .AddAccountContainer {
        width: 700px;
        margin: 0 auto;
    }

    .AddAccountBox {
        width: 680px;
        margin: 0 auto;
    }

    .ddlSvcCompany {
        width: 100%;
    }


    /*Update Customer Information*/
    .CustomerInfoTextboxs {
        width: 450px;
        margin: 0 auto;
    }

    .EditCustInfoText {
        color: White;
    }



    /*register new user*/
    .RegisterContainer {
        width: 600px;
        margin: 0 auto;
    }


    /*forgot password*/
    .ForgotPassContainer {
        min-height: 415px;
        width: 800px;
    }

    .ForgotPassBox {
        margin: 0 auto;
        width: 450px;
    }


    /*Sign In help*/
    .SignInContainer {
        width: 800px;
        min-height: 415px;
    }

    .SignInBox {
        width: 550px;
        margin: 0 auto;
    }


    .SignInBoxHeaders {
        width: 450px;
        margin: 0 auto;
    }

    /*Profile_PaperlessBilling.aspx*/
    .inputDiv {
        float: left;
        width: 400px;
    }


    /*Profile_UpdateAutomaticPaymentInformation.aspx*/
    .lblMethod {
        margin-left: 20px;
        margin-right: 20px;
    }

    .ddlMethod {
        margin-right: 20px;
        width: 225px;
    }

    .txtMaxCharge {
        width: 75px;
        margin-left: 20px;
    }
}
