@media all and (max-width:1039px), all and (max-device-width:1039px) {

    .strength_meter div {
        border-radius: 13px;
        margin-left: 4px;
        height: 35px !important;
    }

    @font-face {
        font-family: Amble-LightCondensed;
        font-weight: normal;
        src: url('../fonts/amble/Amble-LightCondensed.ttf');
    }

    body.view-sml,
    body.view-sml #container,
    body.view-sml #aspnetForm {
        width: auto;
        height: 100%;
    }

        body.view-sml #aspnetForm {
            padding: 0px;
            background-image: none;
        }

        body.view-sml #container {
            padding: 0px;
        }

    /* using a bigger font for demo purposes */
    body.view-sml {
        font-family: Amble-LightCondensed;
        font-style: normal;
        font-variant: normal;
        font-size: 0.9em;
    }

        /* Hide the text for links and just show the icons */
        /*body.view-sml td a:not(.NavigationLink) { font-size:0px;text-indent:100%;white-space:nowrap;overflow:hidden;outline:none;content:none;}*/
        body.view-sml .Anchors {
            display: none;
        }

        /* Rounded input controls copied from http://www.electrictoolbox.com/css3-rounded-corner-input/ */
        body.view-sml input[type="checkbox"] {
            width: 1.4em;
            height: 1.4em;
            margin: 0px 5px 0px 2px;
        }

        body.view-sml input:not([type="radio"]):not([readonly]):not([type="checkbox"]),
        body.view-sml select {
            border: 1px solid #ccc;
            /* Safari 5, Chrome support border-radius without vendor prefix.
   * FF 3.0/3.5/3.6, Mobile Safari 4.0.4 require vendor prefix.
   * No support in Safari 3/4, IE 6/7/8, Opera 10.0.
   */
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            /* Chrome, FF 4.0 support box-shadow without vendor prefix.
   * Safari 3/4/5 and FF 3.5/3.6 require vendor prefix.
   * No support in FF 3.0, IE 6/7/8, Opera 10.0, iPhone 3.
   * change the offsets, blur and color to suit your design.
   */
            -moz-box-shadow: 2px 2px 3px #666;
            -webkit-box-shadow: 2px 2px 3px #666;
            box-shadow: 2px 2px 3px #666;
            /* with a big radius/font there needs to be padding left and right
   * otherwise the text is too close to the radius.
   * on a smaller radius/font it may not be necessary
   */
            padding: 4px 7px;
            /* only needed for webkit browsers which show a rectangular outline;
   * others do not do outline when radius used.
   * android browser still displays a big outline
   */
            outline: 0;
            /* this is needed for iOS devices otherwise a shadow/line appears at the
   * top of the input. depending on the ratio of radius to height it will
   * go all the way across the full width of the input and look really messy.
   * ensure the radius is no more than half the full height of the input,
   * and the following is set, and everything will render well in iOS.
   */
            -webkit-appearance: none;
            font-size: 1.1em;
            /* This margin is needed for the validation shadow */
            margin-left: 0.2em;
        }

            body.view-sml input:not([type="radio"]):not([readonly]):not([type="checkbox"]).invalid,
            body.view-sml .invalid input:not([type="radio"]):not([readonly]):not([type="checkbox"]),
            body.view-sml select.invalid {
                -moz-box-shadow: 0em 0em 0.5em 0.1em #FF0000;
                -webkit-box-shadow: 0em 0em 0.5em 0.1em #FF0000;
                box-shadow: 0em 0em 0.5em 0.1em #FF0000;
            }

        body.view-sml input[type="text"]:not([readonly]),
        body.view-sml input[type="password"]:not([readonly]),
        body.view-sml input[type="number"]:not([readonly]),
        body.view-sml input[type="email"]:not([readonly]),
        body.view-sml input[type="tel"]:not([readonly]) {
            min-height: 1.5em;
            width: 100%;
        }

        body.view-sml select {
            min-height: 1.5em;
        }

        body.view-sml input[type="radio"] {
            height: 1.4em;
            width: 1.4em;
            margin-right: 0.3em;
            vertical-align: bottom;
        }

        body.view-sml input[type="submit"],
        body.view-sml .button_secondary,
        body.view-sml .button_main {
            min-height: 2.5em;
            width: 98%;
        }

        body.view-sml .buttonPosition,
        body.view-sml .buttonPositionLeft,
        body.view-sml .buttonPositionCenter,
        body.view-sml .buttonPositionBottomCenter {
            width: 100%;
            margin: 0px auto;
        }

        body.view-sml input[type="text"][disabled],
        body.view-sml input[type="text"][readonly],
        body.view-sml input[type="email"][disabled],
        body.view-sml input[type="email"][readonly],
        body.view-sml input[type="tel"][disabled],
        body.view-sml input[type="tel"][readonly],
        body.view-sml input[type="number"][disabled],
        body.view-sml input[type="number"][readonly] {
            border: 1px solid #ccc;
            /* Safari 5, Chrome support border-radius without vendor prefix.
   * FF 3.0/3.5/3.6, Mobile Safari 4.0.4 require vendor prefix.
   * No support in Safari 3/4, IE 6/7/8, Opera 10.0.
   */
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            /* Chrome, FF 4.0 support box-shadow without vendor prefix.
   * Safari 3/4/5 and FF 3.5/3.6 require vendor prefix.
   * No support in FF 3.0, IE 6/7/8, Opera 10.0, iPhone 3.
   * change the offsets, blur and color to suit your design.
   */
            -moz-box-shadow: 2px 2px 3px #666;
            -webkit-box-shadow: 2px 2px 3px #666;
            box-shadow: 2px 2px 3px #666;
            /* with a big radius/font there needs to be padding left and right
   * otherwise the text is too close to the radius.
   * on a smaller radius/font it may not be necessary
   */
            padding: 4px 7px;
            /* only needed for webkit browsers which show a rectangular outline;
   * others do not do outline when radius used.
   * android browser still displays a big outline
   */
            outline: 0;
            /* this is needed for iOS devices otherwise a shadow/line appears at the
   * top of the input. depending on the ratio of radius to height it will
   * go all the way across the full width of the input and look really messy.
   * ensure the radius is no more than half the full height of the input,
   * and the following is set, and everything will render well in iOS.
   */
            -webkit-appearance: none;
            font-size: 1.1em;
            /* This margin is needed for the validation shadow */
            margin-left: 0.2em;
        }

        body.view-sml .DateControl img {
            width: 35px;
            height: 35px;
        }

        body.view-sml .PrintControls {
            font-size: 1.1em;
            top: 100px;
        }

        body.view-sml .creditcards {
            height: 1.5em;
            width: auto;
        }

        body.view-sml .MakePaymentImage,
        body.view-sml .EditImage,
        body.view-sml .DeleteImage {
            height: 1.2em;
            width: auto;
        }

        body.view-sml .AutoPayImage,
        body.view-sml .ViewImage {
            height: 1em;
            width: auto;
            margin: 0px;
        }

        body.view-sml .tableForm {
            margin: 5px auto;
            padding: 5px 0px 2px 5px;
            width: 97%;
        }

        body.view-sml .tableWidth {
            width: 99%;
        }

        body.view-sml .divCell {
            display: inline-block;
            float: none;
        }

        body.view-sml div.divSection.option {
            width: 95%;
            color: red;
        }

            body.view-sml div.divSection.option .checkbox {
                vertical-align: top;
            }

        body.view-sml .labelColumn {
            width: 100%;
        }

        body.view-sml .valueColumn {
            width: 100%;
        }

            body.view-sml .valueColumn input:not([type="radio"]) {
                width: 90%;
                padding-right: 2px;
            }

            body.view-sml .valueColumn select {
                width: 95%;
                max-width: 95%;
            }

        body.view-sml .validatorColumn {
            display: none;
        }

        body.view-sml .commentsColumn {
            width: 100%;
        }

        body.view-sml .col-left,
        body.view-sml .col-right,
        body.view-sml .ScheduledDateRow .valueColumn .divSection .col-left,
        body.view-sml .ScheduledDateRow .valueColumn .divSection .col-right,
        body.view-sml .TermsAndConditionsControl .col-left,
        body.view-sml .TermsAndConditionsControl .col-right,
        body.view-sml .detailsColumn,
        body.view-sml .buttonsColumn {
            position: relative;
            width: 100%;
        }

            body.view-sml .buttonsColumn input {
                margin-top: 0px;
            }

        body.view-sml .col-right {
            float: left;
        }

        body.view-sml .col-left {
            width: auto;
            min-width: 2em;
        }

        body.view-sml .GridView tr .GridCell:not(.MakePaymentColumn):not(.APSColumn):not(.EditColumn):not(.DeleteColumn):not(.ViewColumn):not(.ActionColumn):not(:empty) {
            width: 98%;
            width: calc(100% - 1.2em);
            width: -webkit-calc(100% - 1.2em);
            padding: 5px;
            float: none;
        }

        body.view-sml .GridView tr th {
            display: none;
        }

        body.view-sml .GridView tr.rows_odd,
        body.view-sml .GridView tr.rows_even {
            border: none;
            background-color: transparent;
        }

        body.view-sml .GridView td {
            padding: 2px 0px;
        }

        body.view-sml .paging td {
            padding: 2px 3px 1px;
        }

        body.view-sml .GridView .GridRow {
            cursor: pointer;
            width: 90%;
            background-color: #E5E8F5;
            vertical-align: middle;
            padding: 10px;
            border-radius: 10px;
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            -moz-box-shadow: 2px 2px 3px #666;
            -webkit-box-shadow: 2px 2px 3px #666;
            box-shadow: 2px 2px 3px #666;
            background-image: url(../../../Images/options_icon.png);
            background-size: 1em;
            background-repeat: no-repeat;
            background-position: 95%;
        }

        /* Image adjustments to align the text vertically */
        body.view-sml .GridView .GridCell.ActionColumn .EditColumn img {
            margin-left: 0.5em;
            margin-right: 0.3em;
        }

        body.view-sml .GridView .GridCell.ActionColumn .APSColumn img {
            margin-right: 0.1em;
        }

        body.view-sml .GridView .GridCell.ActionColumn .MakePaymentColumn img {
            margin-right: 0px;
        }

        body.view-sml .GridView .GridCell.ActionColumn .ViewColumn img {
            margin-right: 0.1em;
        }

        body.view-sml .GridView .GridCell.ActionColumn a[disabled] {
            display: none;
        }

        body.view-sml .GridView .GridCell.ActionColumn .GridCell {
            text-align: left;
            width: 101%;
            float: none;
            padding: 0px;
            border-bottom: 1px solid #E8E8E8;
        }

            body.view-sml .GridView .GridCell.ActionColumn .GridCell:last-child {
                border-bottom-width: 0px;
            }

            body.view-sml .GridView .GridCell.ActionColumn .GridCell a:link {
                line-height: 1.8em;
                padding-left: 0.5em;
                width: 100%;
                display: block;
            }

        body.view-sml .GridView .GridCell.ActionColumn {
            visibility: hidden;
            position: absolute;
            top: 1em;
            right: -15em;
            z-index: -1;
            transition: 0.5s all;
            -webkit-transition: 0.5s all;
            background-color: #FFFFFF;
            border: 1px solid #ccc;
            vertical-align: middle;
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            -moz-box-shadow: 2px 2px 3px #666;
            -webkit-box-shadow: 2px 2px 3px #666;
            box-shadow: 2px 2px 3px #666;
        }

        body.view-sml .GridView .GridRow:hover .ActionColumn {
            visibility: visible;
            z-index: 2;
            width: 60%;
            z-index: 2;
            right: 10px;
            height: auto;
            cursor: default;
        }
        /*body.view-sml .GridView .GridRow:hover .ActionColumn > .GridCell {display:block;}*/


        /************* Message Areas *************/
        body.view-sml .message .icon,
        body.view-sml .confirmation .icon,
        body.view-sml .info .icon,
        body.view-sml .warning .icon {
            margin-left: 0em;
            padding-top: 0.5em;
            padding-right: 0em;
            height: 1.2em;
            width: auto;
        }

        body.view-sml .message ul,
        body.view-sml .confirmation ul,
        body.view-sml .info ul,
        body.view-sml .warning ul {
            width: 75%;
            margin: 0em;
            padding: 0.3em 0em;
        }

        body.view-sml .message ul {
            padding-left: 1.5em;
        }

        body.view-sml .confirmation ul,
        body.view-sml .info ul,
        body.view-sml .warning ul {
            padding-left: 0.5em;
        }

        body.view-sml .message,
        body.view-sml .confirmation,
        body.view-sml .info,
        body.view-sml .warning {
            padding: 0.3em;
            padding-bottom: 0.4em;
            padding-bottom: calc(0.3em + 2px);
            padding-bottom: -webkit-calc(0.3em + 2px);
        }

        /************* End Message Areas *************/
        /************* Master View *************/
        body.view-sml .header {
            height: 3em;
            text-align: center;
        }

        body.view-sml .navigationLeft .mainPage {
            width: 99%;
            float: none;
            overflow-x: hidden;
            overflow-y: scroll;
            position: absolute;
            -webkit-overflow-scrolling: touch;
            padding-right: 0.2em;
            height: 91%;
            height: calc(100% - 6em);
            height: -webkit-calc(100% - 6em);
        }

        body.view-sml .navigationLeft .footer {
            min-height: 1.5em;
            bottom: 0em;
            position: absolute;
            background-color: #484848;
            padding: 0em;
        }

            body.view-sml .navigationLeft .footer a {
                color: #FFFFFF;
            }

        body.view-sml .SecureDiv,
        body.view-sml .headerSubTitle,
        body.view-sml .headerLink {
            display: none;
        }

        body.view-sml .headerLogo {
            left: 0.2em;
            height: 90%;
            width: auto;
            max-width: 100%;
            position: absolute;
        }

        body.view-sml .headerTitle {
            left: auto;
            position: relative;
            display: initial;
        }

        body.view-sml .headerLogout,
        body.view-sml a.headerLogout {
            z-index: 1;
            position: relative;
            right: 0em;
            top: 0em;
            display: none;
        }

        body.view-sml .headerWelcome,
        body.view-sml .headerUserName {
            margin-left: 0px;
        }

        body.view-sml .CellSeparator.divCell {
            display: block;
        }

        body.view-sml .CellSeparator {
            border-width: 0px;
        }

        body.view-sml .footer .CellSeparator.divCell {
            display: inline;
        }

        body.view-sml .footer .CellSeparator {
            border-width: 2px;
            border-color: #383838;
        }

        body.view-sml .navigationLeft {
            height: 100%;
        }

        body.view-sml .navigationLeft {
            margin-left: auto;
            margin-right: auto;
        }

            body.view-sml .navigationLeft .navigation .name {
                padding: 0.5em 0.2em;
            }

        body.view-sml form.Authenticated .navigationLeft .navigation ul {
            margin: 0px;
            border-width: 0px;
        }

        body.view-sml .navigationLeft .navigation .menu {
            background-color: #484848;
            font-size: 1.2em;
        }

            body.view-sml .navigationLeft .navigation .menu li,
            body.view-sml .navigationLeft .navigation .headerLogout,
            body.view-sml .navigationLeft .navigation #bookMarkTag {
                background-repeat: no-repeat;
                background-position: 10px center;
                color: #808080;
                padding: 0.8em 0.8em 0.8em 2.5em;
            }

        body.view-sml .navigationLeft .navigation #bookMarkTag {
            float: none;
            margin-left: 0px;
            margin-top: 0px;
            border-width: 0px;
            background-size: 1.2em;
        }

        body.view-sml .navigationLeft .navigation #bookMarkTag,
        body.view-sml .navigationLeft .navigation .headerLogout {
            display: block;
            font-size: 1em;
        }

        body.view-sml .navigationLeft .navigation .headerLogout,
        body.view-sml .navigationLeft .navigation .menu li {
            border-color: #383838;
            border-style: solid;
            border-width: 1px 0px;
            background-size: 1.4em;
        }

        body.view-sml .navigationLeft .navigation a[disabled] li {
            color: #000000;
            font-weight: normal;
            background-color: #A8A8A8;
        }

        body.view-sml .navigationLeft .navigation #bookMarkTag:hover,
        body.view-sml .navigationLeft .navigation .headerLogout:hover,
        body.view-sml .navigationLeft .navigation .menu ul li:hover {
            color: #FFFFFF;
            background-color: #A8A8A8;
        }

        body.view-sml .navigationLeft .navigation #bookMarkTag {
            background-image: url(../../../Images/bookmark_icon.png);
        }

        body.view-sml .navigationLeft .navigation .headerLogout {
            background-image: url(../../../Images/logoff_icon.png);
        }

        body.view-sml .navigationLeft .navigation .menu ul a:nth-child(1) li {
            background-image: url(../../../Images/home_icon.png);
        }

        body.view-sml .navigationLeft .navigation .menu ul a:nth-child(2) li {
            background-image: url(../../../Images/useraccount_icon.png);
        }

        body.view-sml .navigationLeft .navigation .menu ul a:nth-child(3) li {
            background-image: url(../../../Images/password_icon.png);
        }

        body.view-sml .navigationLeft .navigation .menu ul a:nth-child(4) li {
            background-image: url(../../../Images/list_icon.png);
        }

        body.view-sml .navigationLeft .navigation .menu ul a:nth-child(5) li {
            background-image: url(../../../Images/list_icon.png);
        }

        /* NAVIGATION MENU */
        body.view-sml .Authenticated .navigationLeft .navigation {
            position: absolute;
            right: 0.3em;
            margin-top: -2.5em;
            width: 2.5em;
            height: 2.5em;
            background-image: url(../../../Images/menu_icon.png);
            background-position: center;
            background-repeat: no-repeat;
            background-size: contain;
            cursor: pointer;
            z-index: 1;
        }

        body.view-sml .navigationLeft .navigation div {
            display: none;
        }

        body.view-sml .navigationLeft .navigation:hover div {
            display: block;
        }

        body.view-sml .navigationLeft .navigation:hover {
            cursor: default;
            z-index: 10;
            background-color: #383838;
            color: #FFFFFF;
            width: 50%;
            min-height: 100%;
            padding: 0px;
            margin: 0px;
            top: 0px;
            right: 0px;
            margin-right: -5px;
            border-left: 3px solid #282828;
            background-image: none;
        }
        /************* End Master View *************/


        /************* Login View *************/
        body.view-sml .LoginView .navigationLeft .mainPage {
            padding-top: 0px;
        }

        body.view-sml .LoginView .OneTimePayment .button_main {
            margin-left: 0px;
        }

        body.view-sml .LoginView .UnAuthenticated p {
            padding-bottom: 0px;
        }

        body.view-sml .LoginView .OneTimePayment p {
            display: none;
        }

        body.view-sml .LoginView .OneTimePayment {
            border-width: 0px;
        }

        body.view-sml .LoginView .Authenticated {
            width: 98%;
            float: none;
            margin-top: 20px;
        }

            body.view-sml .LoginView .Authenticated .buttonPosition {
                position: absolute;
                left: 0px;
                width: 100%;
            }

        body.view-sml .LoginView .AspNet-Login .labelColumn {
            display: none;
        }

        body.view-sml .LoginView .AspNet-Login .ForgotLinks,
        body.view-sml .LoginView .AspNet-Login .buttonPositionLeft {
            margin: 0px;
            padding-left: 0px;
        }

        body.view-sml .LoginView .AspNet-Login .divSection:nth-child(1) .valueColumn input {
            background-image: url(../../../Images/username_icn.png);
        }

        body.view-sml .LoginView .AspNet-Login .divSection:nth-child(2) .valueColumn input {
            background-image: url(../../../Images/password_icn.png);
        }

        body.view-sml .LoginView .AspNet-Login .divSection .valueColumn input {
            padding-left: 2em;
            width: 85%;
            width: calc(100% - 3em);
            width: -webkit-calc(100% - 3em);
            background-position: 1em center;
            background-repeat: no-repeat;
            background-size: 0.7em;
        }

        body.view-sml .LoginView .Registration {
            width: 100%;
            margin-left: auto;
            margin-right: auto;
            position: relative;
            width: 98%;
        }

            body.view-sml .LoginView .Registration p:nth-of-type(2) {
                display: none;
            }

        body.view-sml .LoginView .mainPage h1,
        body.view-sml .LoginView .mainPage > div {
            width: 100%;
        }

        body.view-sml .LoginView .mainPage h1 {
            text-wrap: normal;
            white-space: pre-wrap;
            width: 100%;
            text-transform: uppercase;
            padding-top: 20px;
            padding-bottom: 20px;
        }


        /************* End Login View *************/

        body.view-sml .ProgressHeaderControl {
            height: 25px;
        }

            body.view-sml .ProgressHeaderControl li.progressOn {
                display: block;
                float: left;
                width: 98%;
            }

            body.view-sml .ProgressHeaderControl li.progressNext,
            body.view-sml .ProgressHeaderControl li.progressOff {
                display: none;
            }

        body.view-sml .ClientAccountControl.ReadOnly .labelColumn,
        body.view-sml #DisplayItems .labelColumn {
            width: 30%;
            vertical-align: top;
        }

        body.view-sml #DisplayItems .valueColumn {
            width: 65%;
        }

        body.view-sml #DisplayItems .detailsColumn {
            width: auto;
        }

        body.view-sml .ClientAccountControl.ReadOnly .valueColumn {
            width: 65%;
        }

        body.view-sml .TermsAndConditionsControl .collapsePanelTermAndCondition.displayed {
            transition: 1s all;
            -webkit-transition: 1s all;
        }

        body.view-sml .TermsAndConditionsControl .collapsePanelHeader span {
            clear: both;
            float: none;
            display: block;
        }

        body.view-sml .TermsAndConditionsControl .link {
            text-align: left;
            text-decoration: underline;
            margin-top: 10px;
        }

        body.view-sml .DateControl input[type="text"] {
            width: 85%;
        }

        body.view-sml .FrequencyDateControlArea .col-left {
            width: auto;
        }

        body.view-sml .FrequencyDateControlArea .col-right {
            width: 70%;
        }

        body.view-sml .PaymentAccountControl .CardExpiration .valueColumn select:nth-child(1) {
            width: 58%;
        }

        body.view-sml .PaymentAccountControl .CardExpiration .valueColumn select:nth-child(2) {
            width: 38%;
        }

        body.view-sml .PaymentAccountControl .PaymentMethodsTable .col-left {
            width: auto;
            min-width: 7em;
        }

        body.view-sml .PaymentAccountControl .PaymentMethodsTable .col-right {
            height: auto;
            width: auto;
            max-width: calc(100% - 7em);
            max-width: -webkit-calc(100% - 7em);
        }

        body.view-sml .PaymentAccountControl .PaymentMethodsTable .SavedSelection {
            padding-top: 5px;
            padding-bottom: 5px;
        }

            body.view-sml .PaymentAccountControl .PaymentMethodsTable .SavedSelection .col-left label {
                display: none;
            }

            body.view-sml .PaymentAccountControl .PaymentMethodsTable .SavedSelection .col-left {
                width: auto;
                min-width: 1em;
            }

            body.view-sml .PaymentAccountControl .PaymentMethodsTable .SavedSelection .col-right {
                width: 90%;
                padding-right: 5px;
            }

        body.view-sml .PrintControls {
            display: block;
        }

        body.view-sml .HomeView .APSGrid .PaymentAccountName,
        body.view-sml .HomeView .APSGrid .PaymentAccountNameValue {
            visibility: collapse;
        }

        body.view-sml .HomeView .tableForm > p {
            display: none;
        }

        body.view-sml .ClientAccountView .ClientAccountControl {
            width: 100%;
        }

        body.view-sml .ScheduledDateRow .valueColumn .divSection .col-left .DateControl input[type="text"] {
            width: 50%;
        }

        body.view-sml .PaymentAuthorizationResultsView #PaymentAuthorizationResultsViewThankYouDiv {
            padding-left: 0.5em;
        }

        body.view-sml .TransactionSummaryView .col-left {
            width: 100%;
        }

        body.view-sml .TransactionSummaryView .col-right {
            position: absolute;
            right: 10px;
            text-align: right;
        }

        body.view-sml .TransactionSummaryView .DetailsView .labelColumn {
            width: auto;
            min-width: 10em;
        }

        body.view-sml .TransactionSummaryView .DetailsView .valueColumn {
            width: auto;
            max-width: calc(100% - 12em);
            max-width: -webkit-calc(100% - 12em);
        }

        body.view-sml .TransactionSummaryView .mainPage .ReturnLink {
            padding-left: 1em;
        }

        body.view-sml .eBillingSummaryView .eBillingGrid .eBillingDateColumn {
            width: 18%;
        }

        body.view-sml .eBillingSummaryView .eBillingGrid .ClientAccountNameColumn {
            width: 25%;
        }

        body.view-sml .eBillingSummaryView .eBillingGrid .PaymentAmountColumn {
            width: 15%;
        }

        body.view-sml .eBillingSummaryView .eBillingGrid .eBillingTypeDisplayColumn {
            width: 12%;
        }

        body.view-sml .eBillingSummaryView .eBillingGrid .ActionColumn {
            width: 30%;
        }

            body.view-sml .eBillingSummaryView .eBillingGrid .ActionColumn .GridCell {
                width: 100%;
            }

        body.view-sml .UserMaintView .Anchors {
            display: block;
        }

        body.view-sml .ClientAccountView .Anchors {
            display: block;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .FrequencyOptions .valueColumn > div {
            padding-top: 5px;
            padding-bottom: 5px;
            vertical-align: middle;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .FrequencyOptions .valueColumn input[type="radio"] {
            vertical-align: middle;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .FrequencyOptions .valueColumn .DateControl input[type="text"] {
            width: 70%;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .FrequencyOptions .valueColumn .col-left {
            margin-top: 0.5em;
            margin-right: 0.2em;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .PaymentAccountControl .PaymentMethodsTable .SavedSelection .col-right {
            width: 100%;
            max-width: 100%;
        }

        body.view-sml .AutomaticPaymentScheduleSetupView .PaymentAccountControl .SavedPaymentAccountList {
            margin-left: 0.2em;
        }

        body.view-sml .AutomaticPaymentScheduleReviewView .labelColumn {
            width: 30%;
        }

        body.view-sml .AutomaticPaymentScheduleReviewView .valueColumn {
            width: 65%;
        }

        body.view-sml .AutomaticPaymentScheduleResultsView .labelColumn {
            width: 30%;
        }

        body.view-sml .AutomaticPaymentScheduleResultsView .valueColumn {
            width: 65%;
        }

        body.view-sml .AutomaticPaymentScheduleResultsView .mainPage a {
            padding-left: 1em;
        }

        body.view-sml .SelectInvoiceView .GridView .GridRow {
            background-image: none;
        }

        body.view-sml .SelectInvoiceView .GridView .GridCell .mobileLabel {
            display: inline-block;
        }

        body.view-sml .SelectInvoiceView .LookupResultsSection .ItemStyle .Column1 {
            text-align: right;
            position: absolute;
        }

        body.view-sml .SelectInvoiceView .searchBox input[type="text"]:not([readonly]) {
            width: 93%;
        }

        body.view-sml .SelectInvoiceView .ConfirmationSection .HeaderStyle .Column2, .ConfirmationSection .ItemStyle .Column2,
        body.view-sml .SelectInvoiceView .ConfirmationSection .HeaderStyle .Column4, .ConfirmationSection .ItemStyle .Column4 {
            text-align: left;
        }

        body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle hr {
            display: none;
        }

        body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle {
            background-color: #979696;
            color: #F7F7F7;
            font-weight: bold;
        }

            body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle .Column1, body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle .Column5 {
                display: none;
            }

            body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle .Column2, body.view-sml .SelectInvoiceView .ConfirmationSection .FooterStyle .Column4 {
                text-align: left;
            }
}

/* Tablets */
@media all and (max-device-width:1024px) {
    /* Adjustments for popup pages */
    #form1 {
        font-size: 2em;
    }

        #form1 input[type="submit"] {
            min-height: 2.5em;
            width: 98%;
            border: 1px solid #ccc;
            /* Safari 5, Chrome support border-radius without vendor prefix.
    * FF 3.0/3.5/3.6, Mobile Safari 4.0.4 require vendor prefix.
    * No support in Safari 3/4, IE 6/7/8, Opera 10.0.
    */
            -moz-border-radius: 10px;
            -webkit-border-radius: 10px;
            border-radius: 10px;
            /* Chrome, FF 4.0 support box-shadow without vendor prefix.
    * Safari 3/4/5 and FF 3.5/3.6 require vendor prefix.
    * No support in FF 3.0, IE 6/7/8, Opera 10.0, iPhone 3.
    * change the offsets, blur and color to suit your design.
    */
            -moz-box-shadow: 2px 2px 3px #666;
            -webkit-box-shadow: 2px 2px 3px #666;
            box-shadow: 2px 2px 3px #666;
            /* with a big radius/font there needs to be padding left and right
    * otherwise the text is too close to the radius.
    * on a smaller radius/font it may not be necessary
    */
            padding: 4px 7px;
            /* only needed for webkit browsers which show a rectangular outline;
    * others do not do outline when radius used.
    * android browser still displays a big outline
    */
            outline: 0;
            /* this is needed for iOS devices otherwise a shadow/line appears at the
    * top of the input. depending on the ratio of radius to height it will
    * go all the way across the full width of the input and look really messy.
    * ensure the radius is no more than half the full height of the input,
    * and the following is set, and everything will render well in iOS.
    */
            -webkit-appearance: none;
            font-size: 1.1em;
            /* This margin is needed for the validation shadow */
            margin-left: 0.2em;
        }
}

/* Smart Phones */

@media all and (max-device-width:480px) {
    /* using a bigger font for demo purposes */
    /*body.view-sml {font-size:2.5em;}*/
}