/*!
Project Name: MPS
URL: 
Author: Imenso Software
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Fonts
# Variables
# Common
# Header
/*--------------------------------------------------------------
# Fonts
--------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Work+Sans:400,500,600,700,800");
@import url('https://fonts.googleapis.com/css?family=Poppins:400,600,700,800');
@import url('https://fonts.googleapis.com/css2?family=Sen:wght@400;700;800&display=swap');
/*--------------------------------------------------------------
# Variables
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Common
--------------------------------------------------------------*/
@font-face {
    font-family: 'AvenirLTStd';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/AvenirLTStd-Book.otf);
}

@font-face {
    font-family: 'AvenirLTStd';
    font-style: normal;
    font-weight: 500;
    src: url(../fonts/AvenirLTStd-Medium.otf);
}

@font-face {
    font-family: 'futura';
    font-style: bold;
    font-weight: 600;
    src: url(../fonts/futura-heavy-font.ttf);
}

body {
    font-size: 16px;
    /*font-family: 'Sen', sans-serif;*/
    font-family: "AvenirLTStd", sans-serif;
}

a {
    font: normal normal bold 12px/12px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #01A4E3;
}

    a:hover, a:focus {
        text-decoration: none;
        outline: none;
    }

.navbar-dark .navbar-nav .nav-link {
    font-family: 'Poppins', sans-serif;
}

strong, h1, h2, h3, h4, h5 {
    font-weight: 700;
}

.light-bg {
    background-color: #FFFFFF;
}

form label {
    font: normal normal bold 13px/13px Roboto;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}
    
.form-control {
    padding: 0.575rem 0.85rem;
    border: 1px solid #CCC;
    border-radius: 4px;
}

    .form-control:focus {
        box-shadow: none;
        background-color: #F5F5F5;
        border-color: #DDD;
    }

.btn-primary {
    background: #1EA8AA;
    border-color: #1EA8AA;    
    padding: 0.6em 3em;    
    transition: 0.3s all;    
}

.white-text {
    color: #FFF;
}

.btn-primary:hover {
    background: #000;
    border-color: #000;
}

.link {
    color: #0A68AC;
}

.btn-secondary {
    background: transparent;
    border-color: #333;
    padding: 0.475rem 1.85rem;
    /*border-radius: 4px;*/ border-radius: 30px font-weight: 600;
    transition: 0.3s all;
    color: #333;
}

.burger {
    padding: 100px 0;
}

.gutter {
    padding: 0 100px;
}

.gutter-sm {
    padding: 0 50px;
}

.navbar {
    position: absolute;
    width: 100%;
    z-index: 9;
}

.navbar-brand {
    width: 100px;
}

.nav-link.active {
    opacity: 1;
}

.dropdown-menu {
    background: #fff none repeat scroll 0 0;
    border: medium none;
    border-radius: 2px !important;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 50px;
    z-index: 501;
}

.bg-primary {
    background: #0A68AC !important;
}

.nav-link {
    color: #000;
    display: block;
    padding: 0.5rem 1rem;    
    font-size: 0.8em;
    letter-spacing: 1px;
}

.banner {
    height: 100vh;
    position: relative;
}

    .banner::before {
        background-image: linear-gradient(-135deg, #504581, #69A1AC);
        bottom: 0;
        content: "";
        position: absolute;
        top: 0;
        background-size: cover;
        background-position: left;
        width: 30%;
    }

    .banner img {
        top: 26%;
        left: 16%;
        position: absolute;
    }

.banner-3 {
    background: rgba(0, 0, 0, 0) linear-gradient(to right, #0A68AC, #FF411A) repeat scroll 0 0;
    height: 100vh;
}

.scrollable {
    height: 500px;
    overflow-y: auto;
}

.btn-light {
    background: #FFF;
    border: 1px solid #333;
    font-size: 0.75em;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.new-card {
    background: #FFF;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}

.showcase-box {
    background: #FFF;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.2);
    margin-top: 150px;
    overflow: hidden;
}

.dark-bg {
    background: #EFF5F5;
}

.showcase-box h1 {
    font-size: 2em;
}

.showcase-box p {
    font-size: 0.9em;
}

.semi-bold {
    font-weight: 500;
}

.box-link {
    padding: 40px;
    box-shadow: 0 3px 9px rgba(0,0,0,0.2);
    border-radius: 4px;
    position: relative;
    transition: 0.3s all;
    min-height: 285px;
}

    .box-link a {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        text-indent: -9999px;
        z-index: 2;
    }

    .box-link:hover {
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    }

    .box-link h3 {
        font-size: 1.3em;
        margin-top: 20px;
    }

.heading-text {
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.5;
}

.blue-bg {
    background: rgba(10,104,172,1);
    color: #FFF;
}

.green-bg {
    background: rgba(150,190,58,1);
    color: #FFF;
}

.orange-bg {
    background: rgba(255,65,26,1);
    color: #FFF;
}


div.balanceNoteContainer{
    text-align:center;
    padding: .5em .5em .5em .5em;
}
span.balanceNote{
    font-size:.7em;
    text-align:center;
}
.balance .btn{
    font-size:18px;
}



/* -- Floating Action Buttons*/
.fab {
    bottom: 1em;
    position: fixed;
    margin: 1em;
    right: 1em;
}

.buttons {
    box-shadow: 0px 5px 11px -2px rgba(0, 0, 0, 0.18), 0px 4px 12px -7px rgba(0, 0, 0, 0.15);
    border-radius: 50%;
    display: block;
    width: 56px;
    height: 56px;
    margin: 20px auto 0;
    position: relative;
    -webkit-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}

    .buttons:active,
    .buttons:focus,
    .buttons:hover {
        box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28);
    }

    .buttons:not(:last-child) {
        margin: 20px auto 0;
        opacity: 0;
        -webkit-transform: translateY(50px);
        -ms-transform: translateY(50px);
        transform: translateY(50px);
    }

.fab:hover .buttons:not(:last-child) {
    opacity: 1;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    margin: 15px auto 0;
}

/* Unessential styling for sliding up buttons at differnt speeds */

.buttons:nth-last-child(1) {
    -webkit-transition-delay: 25ms;
    transition-delay: 25ms;
    background-image: url("../images/support.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #0A68AC;
}



.buttons:not(:last-child):nth-last-child(2) {
    -webkit-transition-delay: 75ms;
    transition-delay: 40ms;
    background-image: url("../images/question.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #ff411a;
}

.buttons:not(:last-child):nth-last-child(3) {
    -webkit-transition-delay: 100ms;
    transition-delay: 60ms;
    background-image: url("../images/envelope.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #96be3a;
}


[tooltip]:before {
    top: -70%;
    font-weight: 600;
    border-radius: 4px;
    background: #585858;
    color: #fff;
    content: attr(tooltip);
    font-size: 12px;
    visibility: hidden;
    opacity: 0;
    padding: 5px 7px;
    margin-right: 12px;
    position: absolute;
    right: -28%;
    white-space: nowrap;
    line-height: 20px;
}

[tooltip]:hover:before,
[tooltip]:hover:after {
    visibility: visible;
    opacity: 1;
}

.footer {
    padding: 50px 0;
}

.footer-links {
    padding: 0;
    margin: 0;
}

    .footer-links li {
        list-style: none;
        display: inline-block;
        margin-right: 10px;
    }

        .footer-links li a {
            color: #666;
            font-size: 0.8em;
        }

.copy {
    font-size: 0.8em;
    color: #777;
}

.footer a {
    color: rgb(59,134,189);
}

.or-text {
    text-align: center;
    position: relative;
    font-weight: 600;
    color: #000;
    opacity: 0.8;
}

    .or-text span {
        display: inline-block;
        height: 30px;
        width: 30px;
        border-radius: 100%;
        line-height: 30px;
        text-align: center;
        background-color: #E4EDED;
        font-size: 0.9em;
    }

        .or-text span:after {
            content: "";
            background: #E4EDED;
            height: 2px;
            width: 100%;
            position: absolute;
            top: 50%;
            left: 0;
            z-index: -1;
        }

.opac {
    opacity: 0.7;
    border: 8px solid #E4EDED;
}

/*
.bullets {
    margin-top: 30px;
    padding: 0;
}

    .bullets li {
        list-style: none;
        margin-bottom: 7px;
        font-size: 0.9em;
        color: #666;
    }

    .bullets i {
        color: #1EA5A9;
        margin-right: 7px;
    }
*/

#step1 .p-5 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

#step1 .btn {
    width: 70%;
}
/* --- FAB ends */
/*--------------------------------------------------------------
# Version 4
--------------------------------------------------------------*/
.banner-4 {
    background: transparent;
    min-height: 100vh;
}

    .banner-4 .scrollable {
        background: #FFF;
        border-radius: 8px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.2);
        height: 450px;
    }

.slogan {
    position: absolute;
    bottom: 100px;
    color: #FFF;
}

.banner-4 .btn-primary {
    background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
    padding: 0.875rem 1.85rem;
    border: none;
}

.ripped {
    height: 100vh;
    position: relative;
}

    .ripped::before {
        background-image: linear-gradient(-135deg, #504581, #69A1AC);
        background: url('../images/OSZB6Y0.jpg');
        bottom: 0;
        content: "";
        position: absolute;
        top: 0;
        background-size: cover;
        background-position: left;
        width: 30%;
    }

    .ripped h1 {
        font-size: 2.5em;
        color: #FFF;
    }

    .ripped h4 {
        color: #514882;
    }

    .ripped .form-control {
        border: 1px solid #DDD;
        border-radius: 4px;
    }

    .ripped .btn-primary {
        background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
        padding: 0.675rem 2.85rem;
        border: none;
        border-radius: 30px;
        font-weight: 500;
    }

.btn-flat {
    background-image: none;
    background: transparent;
    padding: 0.675rem 2.85rem;
    border: none;
    border-radius: 30px;
    font-weight: 500;
    text-decoration: underline;
    color: #777;
}

.btn-primary.focus, .btn-primary:focus {
    box-shadow: none;
}

.btn-flat.focus, .btn-flat:focus {
    box-shadow: none;
}

.banner5 .modal-dialog {
    max-width: 100%;
}

.banner5 .form-control {
    border: 1px solid #DDD;
    border-radius: 4px;
}

.banner5 .modal-body {
    /*padding: 50px 0;*/
    min-height: 653px;
}

.btn-primary {
    background-color: linear-gradient(-135deg, #1EA8AA, #1C689A);
    border-radius: 30px;
    font-weight: bold;
    padding: 0.675rem 2.85rem;
    text-transform: uppercase;
    font-size: 1.2em;
    color: #FFF;   
}
.btn-login {
    background-color: #1EA8AA;
    background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
    /*padding: 0.575rem 2.85rem;*/
    border: none;
    border-radius: 30px;
    font-weight: 500;
    color: #FFF !important;
}

    .btn-login:hover {
        color: #FFF;
    }

.btn-secondary {
    background: transparent;
    border-color: #000;
    padding: 0.475rem 1.85rem;
    border-radius: 30px;
    font-weight: 500;
    transition: 0.3s all;
    border-width: 2px;
    text-transform: uppercase;
    font-size: 0.85em;
    color: #000
}

    .btn-secondary i {
        display: inline-block;
        margin-right: 5px;
    }

.btn-white {
    background: #FFF;
    border-color: #FFF;
    padding: 0.475rem 1.85rem;
    border-radius: 30px;
    font-weight: 500;
    transition: 0.3s all;
    color: #333;
    font-size: 0.9em;
}

.banner5 h4 {
    color: #1C689A;
}

.banner5 .modal-footer {
    display: block;
}

.banner5 .modal-footer {
    justify-content: flex-start;
}

.banner5 a {
    /*color: #1C6B9B;*/
}

.banner5 {
    min-height: 100vh;
    /*background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);*/
    background: transparent linear-gradient(180deg, #01A4E3 0%, #015272 100%) 0% 0% no-repeat padding-box;
    position: relative;
}

.banner6 {
    position: relative;
    background: #FFF;
}



    .banner6::before {
        background-image: linear-gradient(-135deg, #504581, #69A1AC);
        background: url('../images/bgg2.jpg');
        bottom: 0;
        content: "";
        position: absolute;
        top: 0;
        background-size: cover;
        background-position: left;
        width: 33.33%;
    }

    .banner6 .modal-content {
        border: none;
    }

    .banner6 .modal-body {
        padding: 0 0 50px;
    }

    .banner6 #form-2 {
        height: 250px;
        overflow-y: auto;
    }

.banner7 {
    position: relative;
    background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
    color: #FFF;
}

    .banner7:before {
        background-image: linear-gradient(-135deg, #504581, #69A1AC);
        background: url('../images/bgg2.jpg');
        bottom: 0;
        content: "";
        position: absolute;
        top: 0;
        background-size: cover;
        background-position: left;
        width: 33.33%;
    }

    .banner7 .modal-content {
        border: none;
        background: transparent;
    }

    .banner7 .modal-body {
        padding: 0 0 50px;
    }

    .banner7 #form-2 {
        height: 250px;
        overflow-y: auto;
    }

    .banner7 h4 {
        color: #FFF;
    }

    .banner7 .bullets li {
        color: #FFF;
    }

        .banner7 .bullets li i {
            color: #FFF;
        }

    .banner7 .btn-secondary {
        border-color: #FFF;
        color: #FFF;
        text-decoration: none;
    }

    .banner7 a {
        color: #FFF;
        text-decoration: underline;
    }

    .banner7 .btn-flat {
        color: #FFF;
    }

    .banner7 .btn-login {
        background-image: linear-gradient(-135deg, #ff7f04, #f60e81);
    }

.slogan-2 h1 {
    /*font-size: 29px;*/
}

@supports (mix-blend-mode: lighten) {
    section.light .gradient1 {
        display: inline-block;
        position: relative;
        color: #000;
        background: #fff;
        mix-blend-mode: multiply;
    }

        section.light .gradient1::before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: linear-gradient(to right,#FD691C, #1B6799);
            pointer-events: none;
        }

        section.light .gradient1::before {
            mix-blend-mode: screen;
        }
}

/*
.light p {
    color: #666;
}

.light h1 {
    color: #1C689A;
}
*/

@supports (mix-blend-mode: lighten) {
    section.light .gradient2 {
        display: inline-block;
        position: relative;
        color: #000;
        background: #fff;
        mix-blend-mode: multiply;
    }

        section.light .gradient2::before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: radial-gradient(circle, #23966c, #faaa54, #e23b4a, #db0768, #360670);
            pointer-events: none;
        }

        section.light .gradient2::before {
            mix-blend-mode: screen;
        }
}

section.dark {
    background: #222;
}

    section.dark .gradient1 {
        color: #fff;
    }

@supports (mix-blend-mode: lighten) {
    section.dark .gradient1 {
        display: inline-block;
        position: relative;
        color: #fff;
        background: #000;
        mix-blend-mode: lighten;
    }

        section.dark .gradient1::before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: linear-gradient(to right,#23966c, #faaa54, #e23b4a, #db0768, #360670);
            pointer-events: none;
        }

        section.dark .gradient1::before {
            mix-blend-mode: multiply;
        }
}

section.dark .gradient2 {
    color: #fff;
}

@supports (mix-blend-mode: lighten) {
    section.dark .gradient2 {
        display: inline-block;
        position: relative;
        color: #fff;
        background: #000;
        mix-blend-mode: lighten;
    }

        section.dark .gradient2::before {
            content: '';
            display: block;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            background: radial-gradient(circle, #23966c, #faaa54, #e23b4a, #db0768, #360670);
            pointer-events: none;
        }

        section.dark .gradient2::before {
            mix-blend-mode: multiply;
        }
}

.header-icon li {
    height: 58px;
    width: 58px;
    border-radius: 100%;
    color: #FFF;
    line-height: 50px;
    text-align: center;
    display: inline-block;
    /*margin: 2px 5px;*/
    margin-left: 10px;
    position: relative;
}

 .header-icon li:last-child {
        margin-right: 0;
    }

.top-icon {
    padding: 0;
}

    .top-icon li {
        display: inline-block;
        margin-right: 10px;
        position: relative;
        border-radius: 100%;
    }

        .top-icon li a {
            height: 50px;
            width: 50px;
            color: #FFF;
            line-height: 50px;
            text-align: center;
            display: block;
        }

        .top-icon li:last-child {
            margin-right: 0;
        }

    .top-icon img {
        max-width: 20px;
    }

.modal-footer h4 {
    color: #000;
    font-size: 1em;
    margin-left: 10px;
}

.shadowed {
    border: 1px solid #DDD;
    padding: 10px;
}

.modal-footer ul, .modal-footer p {
    margin-bottom: 0;
}
/*--------------------------------------------------------------
# Dashboard
--------------------------------------------------------------*/
.left_panel {
    background: #FFF;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 300px;
    box-shadow: 0 2px 4px #ddd;
    border-right: 2px solid #DDD;
}

.scrollable .nav-link {
    padding-left: 50px;
}

.right_panel {
    position: relative;
    margin-left: 300px;
}
/*.right {
  margin-top: 20px;
  margin-bottom: 50px;
}*/
.right h1 {
    font-size: 1.3em;
    font-weight: bold;
}

.white-bg {
    background: #FFF;
}

/*Not require this class
.right table td {
    font-size: 0.9em;
    border-top: none;
    border-bottom: 1px solid #F0F4F7;
}*/

.statement td {
    border-bottom: 5px solid #F0F4F7 !important;
}

.table-responsive tbody {
    background: #FFF;
}

.table-responsive thead th {
    border-bottom: medium none;
    border-top: medium none;
    color: #777;
    font-size: 9px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.opaq {
    opacity: 0.6;
}

.lined-form .form-control {
    border: none;
    border-bottom: 1px solid #333;
    background: transparent;
    padding-left: 0;
}

    .lined-form .form-control:focus {
        border-color: #0A68AC;
    }

.card-hz {
    background: #FFF;
    padding: 20px;
    box-shadow: 0 2px 8px #DDD;
    border-radius: 4px;
    margin-bottom: 30px;
    position: relative;
}

    .card-hz h3 {
        font-size: 1.1em;
    }

    .card-hz h2 {
        font-size: 1.2em;
    }

    .card-hz p {
        margin-bottom: 0;
        opacity: 0.6;
    }

    .card-hz a {
        color: #333;
    }

.right-most {
    /*padding: 50px;*/ padding: 3rem !important
}

.nav-link {
    transition: 0.3s all;
}

    .nav-link.active {
        border-right: 6px solid rgba(30,155,167,1);
        color: #1C689A;
        font-weight: bold;
        background-color: #F0F4F7;
    }

.big-text {
    font-size: 1.3em;
}

.card {
    border: none;
    /*box-shadow: 0 15px 32px rgba(0, 0, 0, 0.2);*/ box-shadow: 0 15px 25px rgba(0, 0, 0, 0.05);
    margin-bottom: 5px;
}

.card-header {
    font-weight: bold;
    background: transparent;
}

.b-r-4 {
    border-radius: 4px;
    overflow: hidden;
}

.theme-bg {
    background: linear-gradient(-135deg, #34a090, #1b74a0);
    color: #FFF;
}

.green-bg-g {
    background: linear-gradient(-135deg, #94BC39, #487B36) !important;
    color: #FFF;
}

.gray-bg-g {
    background: linear-gradient(-135deg, #828081, #585657);
    color: #FFF;
}

.card-link {
    font-weight: 500;
    font-size: 0.7em;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #0A68AC;
}

.card-footer {
    background: transparent;
}

.sml-text {
    font-size: 0.9em;
}

.card-header h4 {
    font-size: 1em;
    margin-bottom: 0;
}

#progressbar {
    counter-reset: step;
    margin-bottom: 30px;
    overflow: hidden;
    margin-left: 0;
    padding-left: 0
}

    #progressbar li::before {
        background: #fff none repeat scroll 0 0;
        border-radius: 25px;
        color: #0A68AC;
        content: counter(step, decimal);
        counter-increment: step;
        display: block;
        font-size: 14px;
        line-height: 40px;
        margin: 0 auto 5px;
        position: relative;
        width: 40px;
        height: 40px;
        border: 2px solid #0A68AC;
        z-index: 1;
    }

    #progressbar li:first-child::after {
        content: none;
    }

    #progressbar li::after {
        background: #0A68AC none repeat scroll 0 0;
        content: "";
        height: 2px;
        left: -50%;
        position: absolute;
        top: 18px;
        width: 100%;
        z-index: 0;
    }

    #progressbar li {
        float: left;
        list-style-type: none;
        position: relative;
        text-align: center;
        width: 33.33%;
    }

        #progressbar li.active:before {
            background: #0A68AC;
            color: #FFF;
            border: 2px solid #f0f4f7;
            cursor: pointer;
        }

            #progressbar li.active:before a {
                color: #FFF;
            }

    #progressbar a {
        color: #000;
    }

.form-wrapper {
    background: #FFF;
    box-shadow: 0 15px 32px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

    .form-wrapper label {
        margin-bottom: 0;
    }

.page-header {
    margin-bottom: 20px;
}

.bold {
    font-weight: bold;
}

.page-header i {
    background: rgba(0, 0, 0, 0) linear-gradient(-135deg, #34a090, #1b74a0) repeat scroll 0 0;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    font-size: 18px;
    height: 40px;
    line-height: 38px;
    margin-right: 20px;
    text-align: center;
    width: 40px;
    color: #FFF;
}

.page-header h1 {
    margin-bottom: 20px;
    font-size: 1.2em;
}

    .page-header h1 small {
        display: block;
        opacity: 0.5;
    }

.user-account {
    position: relative;
    padding: 13px 50px;
    border-top: 1px solid #EEE;
    border-bottom: 1px solid #EEE;
}

.user-img {
    height: 60px;
    width: 60px;
    background: rgba(30,155,167,0.8);
    color: #FFF;
    border-radius: 100%;
    text-align: center;
    line-height: 60px;
    font-weight: bold;
    margin-right: 20px;
    text-transform: uppercase;
}

.semi-bold {
    font-weight: 500;
}

.nav-item.dropdown a {
    color: #333;
}

.left-icons {
    margin: 0;
    padding: 0;
}

    .left-icons li {
        list-style: none;
        margin-bottom: 10px;
        display: inline-block;
        width: 25%;
    }

    .left-icons span {
        display: none;
    }

    .left-icons img {
        max-width: 20px;
        margin-bottom: 5px;
    }

    .left-icons a {
        color: #666;
        font-size: 0.9em;
    }

.v-sml-btn {
    border: 1px solid #ddd;
    border-radius: 50px;
    color: #666;
    display: inline-block;
    font-size: 11px;
    letter-spacing: 0.5px;
    line-height: 15px;
    margin-top: 5px;
    padding: 5px 15px;
    text-transform: uppercase;
}

    .v-sml-btn:hover {
        background: #EFF3F6;
        color: #333;
    }

.fi-po {
    position: fixed;
    bottom: 0;
    width: 300px;
}

.gray-bg {
    background: #6D6B6C;
}

.table {
    margin-bottom: 0;
}

    .table tr:last-child > td {
        border-bottom: none;
    }

.same-h {
    min-height: 272px;
}

#accordion .card, .accordion .card {
    box-shadow: none;
    margin-bottom: 0;
    border-top: 1px solid #DDD;
}

#accordion .card-body, .accordion .card-body {
    padding: 1.25rem 1.95em;
}

#accordion p, .accordion p {
    color: #666;
}

    #accordion p strong, .accordion p strong {
        color: #000;
    }

.right-links {
    padding: 0;
    list-style: none;
}

    .right-links li {
        color: #333;
        padding: 5px;
        margin-bottom: 10px;
        padding-left: 10px;
    }

        .right-links li a {
            color: #333;
            font-size: 0.9em;
        }

        .right-links li.active {
            background: #FFF;
            border-left: 4px solid #90b839;
            box-shadow: 0 3px 6px rgba(0,0,0,0.2);
        }

.white-link a {
    color: #FFF;
}

.trash-link {
   
    color: black;
    vertical-align: middle !important;
    text-align: right !important;
    position: absolute;
    top: 0px;
    opacity: 1;
}

/*.infobox:hover  .trash-link {
    opacity: 1;
}*/

.white-box {
    background: #fff none repeat scroll 0 0;
    border-radius: 4px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    margin-bottom: 30px;
}

.dt-3 {
    padding: 30px;
    width: 25%;
}

.white-box h2 {
    font-size: 1.2em;
}

.d-table-cell {
    vertical-align: middle;
}
/*--------------------------------------------------------------
# Login
--------------------------------------------------------------*/

/*Vishal Code*/
.form-wrapper label {
    color: #4bafb9;
    font-size: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.lined-form .form-control {
    border-bottom: 1px solid #ddd !important;
    border-radius: 0;
}

    .lined-form .form-control:focus {
        border-color: #0A68AC !important;
    }

.form-group {
    margin-bottom: 1rem;
}

.receipt { /*background: #0A68AC; */
    color: #fff;
}

    .receipt label {
        color: rgba(255,255,255,.5)
    }

    .receipt h5 {
        font-size: 1.1em;
    }

    .receipt .form-control {
        color: #fff;
    }

.lined-form .receipt .form-control.bold {
    border: none !important;
    color: #FFF;
    text-align: center;
    padding-left: 10px;
    font-weight: 700;
    font-size: 44px;
    line-height: 32px;
    padding-left: 10px;
}

    .lined-form .receipt .form-control.bold.table-borderless {
        border: none !important;
        text-align: left !important;
        padding-left: 0
    }

.lined-form .receipt .form-control:focus {
    border-color: #fff !important;
}

.receipt ::-webkit-input-placeholder {
    color: #fff !important;
    opacity: .8
}

.receipt ::-moz-placeholder {
    color: #fff !important;
    opacity: .8
}

.receipt :-ms-input-placeholder {
    color: #fff !important;
    opacity: .8
}

.receipt :-moz-placeholder {
    color: #fff !important opacity: .8;
}

.receipt .btn-secondary {
    border-color: #fff;
    color: #fff
}

    .receipt .btn-secondary:hover {
        background: rgba(255,255,255,.2)
    }

.receipt .container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
}

    .receipt .container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

.checkmark {
    position: absolute;
    top: -5px;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: rgba(255,255,255,.5);
}

.container input:checked ~ .checkmark {
    background-color: #0968ac;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.container input:checked ~ .checkmark:after {
    display: block;
}

.container .checkmark:after {
    left: 9px;
    top: 7px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.or {
    position: relative;
    background-color: #0A68AC;
    color: #fff;
    border: 2px solid #fff;
    display: block;
    font-size: 12px;
    height: 32px;
    width: 32px;
    text-align: center;
    line-height: 30px;
    border-radius: 100%;
    margin: -.5rem 0 .5rem;
    z-index: 1
}
/*.or:after, .or:before{ content: ''; position: absolute; top: 14px;  width: 15px; height: 2px; background: #fff; z-index: 0}
.or:after{left: -20px;}
.or:before{ right: -20px; }*/
.faq .card {
    font-size: 16px
}

.faq .accordion .card {
    margin-top: -1px
}

.faq .card-header {
    padding: 0;
}

    .faq .card-header a {
        display: block;
        padding: 1.5rem 1.9rem 1.5rem 1.5rem;
        color: #333;
        font-weight: 700
    }

.faq .card-body {
    color: #999
}

    .faq .card-body p {
    }

.faq .btn-link {
    font-weight: 700
}

    .faq .btn-link, .faq .btn-link:hover {
        color: #333;
        text-decoration: none;
    }

.faq .nav-tabs {
    border-bottom: none
}

.faq .nav-item {
}

.faq li.nav-item:first-child a {
    border-radius: 25px 0 0 25px
}

.faq li.nav-item:last-child a {
    border-radius: 0 25px 25px 0
}

.faq .nav-item a {
    display: block;
    border: 1px solid #ddd;
    background: #fff;
    padding: 1rem 1.85rem;
    position: relative;
	height: 50px;
}

.faq #inner_accordion .card-header a {
    background: rgba(0,0,0,.02);
    padding: .8rem 1.5rem;
}

.faq .card-header a:before {
    font-family: FontAwesome;
    content: "\f067";
    color: #000;
    font-size: 14px;
    position: absolute;
    right: 10px;
    top: 20px;
    text-shadow: none;
    background: #fff;
    padding: 5px
}

.faq #inner_accordion .card-header a:before {
    right: auto;
    right: 5px;
    top: 14px;
    background: #fafafa;
}

.faq .card-header a[aria-expanded="true"]:before {
    content: '\f068';
}

.faq .nav-item img {
    display: block;
    margin: 10px auto;
}

.faq .nav-link:hover {
    color: #333 !important
}

.faq .nav-link.active {
    box-shadow: none;
    background: linear-gradient(-135deg, #94BC39, #487B36);
    color: #fff !important;
    padding: 1rem 1.85rem;
}

.profie_edit {
}

    .profie_edit .card-body input {
        display: none;
    }

.card-header a h4 {
    color: #333
}
/*Vishal Code*/


.switchToggle input[type=checkbox] {
    height: 0;
    width: 0;
    visibility: hidden;
    position: absolute;
}

.switchToggle label {
    cursor: pointer;
    text-indent: -9999px;
    width: 80px;
    max-width: 80px;
    height: 30px;
    background: #d1d1d1;
    display: block;
    border-radius: 100px;
    position: relative;
}

    .switchToggle label:after {
        content: '';
        position: absolute;
        top: 2px;
        left: 2px;
        width: 26px;
        height: 26px;
        background: #fff;
        border-radius: 90px;
        transition: 0.3s;
    }

.switchToggle input:checked + label, .switchToggle input:checked + input + label {
    background: #3e98d3;
}

.switchToggle input + label:before, .switchToggle input + input + label:before {
    content: 'No';
    position: absolute;
    top: 5px;
    left: 35px;
    width: 26px;
    height: 26px;
    border-radius: 90px;
    transition: 0.3s;
    text-indent: 0;
    color: #fff;
}

.switchToggle input:checked + label:before, .switchToggle input:checked + input + label:before {
    content: 'Yes';
    position: absolute;
    top: 5px;
    left: 10px;
    width: 26px;
    height: 26px;
    border-radius: 90px;
    transition: 0.3s;
    text-indent: 0;
    color: #fff;
}

.switchToggle input:checked + label:after, .switchToggle input:checked + input + label:after {
    left: calc(100% - 2px);
    transform: translateX(-100%);
}

.switchToggle label:active:after {
    width: 60px;
}

.toggle-switchArea {
    margin: 10px 0 10px 0;
}

.btn-default {
    background: rgba(75,175,185,0.1);
    font-size: 0.9em;
}

.dropdown-menu {
    font-size: 0.9em;
}

.custom-search input {
    background-color: rgb(223,237,241);
    background-image: url('../images/search_icon.png');
    background-position: 15px center;
    background-repeat: no-repeat;
    padding-left: 40px !important;
    border: none;
    padding: 8px 12px;
}

#includedContent {
    position: relative;
    z-index: 2
}

.hide_show {
    position: absolute;
    right: 0;
    top: 17px;
    z-index: 2;
    width: 40px;
    padding: 5px;
    display: none;
}

    .hide_show .icon-bar + .icon-bar {
        margin-top: 4px;
    }

    .hide_show .icon-bar {
        background-color: rgba(30,155,167,0.8);
        height: 3px;
        transition: all ease .3s;
        float: right;
    }

span.icon-bar.top {
    width: 56%;
}

span.icon-bar.mid {
    width: 84%;
}

span.icon-bar.btm {
    width: 32%;
}

.hide_show:hover .icon-bar {
    width: 100% !important;
}

.hide_show:hover {
    cursor: pointer;
}

.hide_show img {
    width: 16px
}

.hide_show.left_shift .mid {
    opacity: 0
}

.hide_show.left_shift .top, .hide_show.left_shift .btm {
    width: 100%;
    background-color: #fff
}

.hide_show.left_shift .top {
    transform: rotate(45deg) translateX(34%);
}

.hide_show.left_shift .btm {
    transform: rotate(-45deg) translateX(33%);
}

.animate {
    transition: .3s ease all;
    -webkit-transition: .3s ease all;
    -moz-transition: .3s ease all;
    -o-transition: .3s ease all;
    -ms-transition: .3s ease all;
}

.right-most1 {
    padding: 0 2.5rem !important;
}

.d-pay-bill span, .login-first span {
    /*margin-right: 10px !important;
    margin-bottom: 10px;
    display: inline-block;*/
}

.d-pay-bill a {
    margin-left: 0 !important
}

.or-text {
    color: #000;
    font-weight: 600;
    opacity: 0.8;
    position: relative;
    text-align: center;
}

    .or-text span::after {
        background: #e4eded none repeat scroll 0 0;
        content: "";
        height: 2px;
        left: 0;
        position: absolute;
        top: 50%;
        width: 100%;
        z-index: -1;
    }

    .or-text span {
        background-color: #e4eded;
        border-radius: 100%;
        display: inline-block;
        font-size: 0.9em;
        height: 30px;
        line-height: 30px;
        text-align: center;
        width: 30px;
    }

.form-group .card_pay {
    background-image: url("../images/cards.png") !important;
    background-size: 48px auto !important;
    padding-left: 55px !important;
    background-repeat: no-repeat !important;
}

    .form-group .card_pay.default, .form-group .card_pay.uatp {
        background-position: 0 6px;
    }

    .form-group .card_pay.visa {
        background-position: 0 -53px !important;
    }

    .form-group .card_pay.visa_electron {
        background-position: 0 -113px !important;
    }

    .form-group .card_pay.mastercard {
        background-position: 0 -173px !important;
    }

    .form-group .card_pay.maestro {
        background-position: 0 -232px !important;
    }

    .form-group .card_pay.discover {
        background-position: 0 -293px !important;
    }

    .form-group .card_pay.amex {
        background-position: 0 -349px !important;
    }

.edit_amount {
    display: inline-block;
    vertical-align: 6px;
    color: #7ca837;
    background-color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 100%;
    line-height: 30px;
}

span.form-control.bold {
    display: inline-block !important;
    width: auto !important;
}

.form-group {
    position: relative;
}

.check .rounded-circle {
    background: #fff;
}

.transaction_code {
    border-bottom: 1px dotted rgba(255,255,255,.5);
    font-size: 18px;
    opacity: .6;
}

.mute {
    color: #999
}

.receipt1, .lined-form .receipt1 .form-control.bold {
    color: #333
}

    .receipt1 h5 {
        font-size: .9em;
        opacity: .6;
        letter-spacing: 1px;
    }

.form-group .chosen-container-single .chosen-single {
    padding: 0.575rem 0.85rem;
    min-height: 45px;
    border: 1px solid #CCC;
    background: #fff !important
}

.radio_container {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-right: 20px
}
    /* Hide the browser's default radio button */
    .radio_container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

    .radio_container span {
        vertical-align: -4px;
        color: #333;
        font-weight: 400;
        text-transform: capitalize !important;
        font-size: 13px;
    }
    /* Create a custom radio button */
    .radio_container .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        background-color: #eee;
        border-radius: 50%;
    }
    /* On mouse-over, add a grey background color */
    .radio_container:hover input ~ .checkmark {
        background-color: #ccc;
    }
    /* When the radio button is checked, add a blue background */
    .radio_container input:checked ~ .checkmark {
        background-color: #0968ac;
    }
    /* Create the indicator (the dot/circle - hidden when not checked) */
    .radio_container .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }
    /* Show the indicator (dot/circle) when checked */
    .radio_container input:checked ~ .checkmark:after {
        display: block;
    }
    /* Style the indicator (dot/circle) */
    .radio_container .checkmark:after {
        top: 5px;
        left: 5px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: white;
    }

.checkbox_container {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 22px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
    /* Hide the browser's default checkbox */
    .checkbox_container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    .checkbox_container span {
        vertical-align: -4px;
        color: #333;
        font-weight: 400;
        text-transform: none !important;
        font-size: 13px;
    }
    /* Create a custom checkbox */
    .checkbox_container .checkmark {
        position: absolute;
        top: 0;
        left: 0;
        height: 20px;
        width: 20px;
        background-color: #eee;
    }
    /* On mouse-over, add a grey background color */
    .checkbox_container:hover input ~ .checkmark {
        background-color: #ccc;
    }
    /* When the checkbox is checked, add a blue background */
    .checkbox_container input:checked ~ .checkmark {
        background-color: #0968ac;
    }
    /* Create the checkmark/indicator (hidden when not checked) */
    .checkbox_container .checkmark:after {
        content: "";
        position: absolute;
        display: none;
    }
    /* Show the checkmark when checked */
    .checkbox_container input:checked ~ .checkmark:after {
        display: block;
    }
    /* Style the checkmark/indicator */
    .checkbox_container .checkmark:after {
        left: 8px;
        top: 4px;
        width: 5px;
        height: 10px;
        border: solid white;
        border-width: 0 3px 3px 0;
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        transform: rotate(45deg);
    }

.where_find {
    background-color: #f1f1f1;
    width: 15px;
    height: 15px;
    display: inline-block;
    text-align: center;
    line-height: 18px;
    position: relative;
    z-index: 1
}

    .where_find img {
        position: absolute;
        width: 190px;
        height: auto;
        border: 1px solid #eee;
        display: none;
    }

    .where_find:hover img {
        display: block;
    }

.vertical_divider {
    min-height: 400px;
    background-color: #ddd;
    width: 1px;
    position: relative;
}

    .vertical_divider span {
        position: absolute;
        top: 50%;
        left: 50%;
        margin: -15px 0 0 -15px;
        width: 30px;
        height: 30px;
        line-height: 30px;
        display: inline-block;
        text-align: center;
        background: #f1f1f1;
        color: #333;
        border: 1px solid #ddd;
        font-size: 13px
    }

.online_payment_option .pay-method {
    border: 1px solid #DDD;
    padding: 20px;
    border-radius: 4px;
}

.neg-mar {
    margin: -50px -50px 0;
    border-bottom: 1px solid #DDD;
}

.w-40 {
    width: 40%;
}

.w-60 {
    width: 60%;
}

#v-pills-tab .nav-link {
    border-bottom: 1px solid #DDD;
    padding: 20px 15px;
    text-transform: none;
    border-radius: 0;
    font-size: 0.8em;
}

    #v-pills-tab .nav-link.active {
        background: linear-gradient(-135deg, #1ea8aa, #1c689a);
        /*color: #000;*/ color: #FFF;
        border-left-color: #1D799E;
        position: relative;
    }

        #v-pills-tab .nav-link.active span.m-hide {
            font-size: 15px;
        }

.arrow-left {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid blue;
}

#v-pills-tab .nav-link.active::before {
    content: "";
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 18px solid #1EA2A9;
    margin-top: -15px;
    position: absolute;
    right: -15px;
    top: 50%;
    color: #1EA2A9;
}

.grey-bg {
    background: #F0F4F7;
}

.neg-mar-2 {
    margin-left: -35px;
    margin-bottom: -50px;
}

.form-height {
    min-height: 410px;
}

.merchant-note {
    position: absolute;
    top: 25%;
    padding: 50px 0; width:70%;
    left:50%; margin-left:-35%;
}

.very-sml {
    font-size: 0.7em;
    color: #777;
    letter-spacing: 1px;
}

li[data_txt="isDisabled"], li[data_txt="isDisabled"] a {
    cursor: not-allowed;
    text-decoration: none;
}

.active.cursor_default, .active.cursor_default a, #progressbar li.active.cursor_default:before {
    cursor: context-menu !important;
}

.right table.table-borderless td {
    border: none;
}

.lined-form .form-control.borderless {
    border: none !important;
}



.dropdown.open .dropdown-menu {
    display: block;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: white;
}

.right table td:first-child, .right table th:first-child {
    white-space: normal;
}

.btn-default {
    color: black;
}

.widthauto {
    width: auto;
}

.field-validation-error {
    color: red;
    font-size: 13px;
    margin-bottom: 0px;
}

.error-success {
    color: forestgreen;
}

.modal-backdrop1 {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    background-color: #000000;
    opacity: 0.3;
    filter: alpha(opacity=30);
}

.modal1 {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1050;
    overflow: auto;
    margin: -125px 0 0 -125px;
    border: 1px solid #fff;
    background: #fff !important;
    padding: 20px;
    /*border: 1px solid #ccc;*/
    width: 260px;
    border-radius: 342px;
}

.dataTables_filter label {
    text-indent: -9999px;
}

.dataTables_filter input {
    display: block;
    position: absolute;
    top: -43px;
    background-color: rgb(223,237,241);
    background-image: url('../images/search_icon.png');
    background-position: 15px center;
    background-repeat: no-repeat;
    padding-left: 40px !important;
    border: none;
    padding: 0.575rem 0.85rem;
    right: 18px;
    border-radius: 4px;
}

.dataTables_length {
    display: none;
}

.dropdown .btn-default {
    font-size: 0.8em;
}

.UserLogin {
    font-size: 0.8em;
    text-transform: uppercase;
}

.varification {
    position: absolute;
    z-index: 9;
    width: 831px;
    top: -60px;
}

.varificaiton__overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
}

.varificaiton__content {
    position: relative;
    z-index: 999;
    background: #FFF;
    padding: 50px;
    margin: 0 auto;
    width: 80%;
    border-radius: 4px;
}

.varification .forgot {
    width: 538px;
    margin-top: 100px;
}

.varification.forgot {
    width: 100%;
}

.varification {
    width: 100%;
    left: 0;
    top: 80px;
}

.link {
    font-size: 0.8em;
}

.payment-option123 label {
    color: #333;
    font-size: 18px;
    align-items: center;
}

.payment-option123 .btn {
    background: linear-gradient(-135deg, #1ea8aa, #1c689a) !important;
    color: #fff !important;
    border-radius: 0 25px 25px 0;
    padding: 6px 23px;
}

.lined-form .payment-option123 .form-control, .lined-form .payment-option123 .form-control:hover, .lined-form .payment-option123 .form-control:focus {
    border: 1px solid #DDD;
    background: #F5F5F5;
    padding: 6px 10px;
    border-radius: 25px 0 0 25px;
}

.payment-option123 .acc_del {
    position: absolute;
    right: 0;
    top: 12px
}

#v-pills-credit .v-sml-btn {
    border-color: #AAA;
    padding: 9px 21px;
}

#v-pills-bank .v-sml-btn {
    border-color: #AAA;
    padding: 9px 21px;
}

.br25 {
    border-radius: 25px !important;
}

.datepicker {
    padding: 0.575rem 0.85rem !important;
}

.pagination li.active a {
    background: #1C759D !important;
}

.filter_area .btn {
    padding: .575rem .75rem !important;
}

.filter_area .btn-info {
    background: #1C759D;
    color: #fff !important;
}


/*New Account detail */
.ac__card {
    background: #FFF;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    border-radius: 4px;
    padding: 50px 20px;
    text-align: center;
    position: relative;
    transition: 0.3s all;
    margin-bottom: 30px;
}

    .ac__card span {
        font-size: 0.7em;
        letter-spacing: 1px;
        opacity: 0.6;
        text-transform: uppercase;
    }

    .ac__card h4 {
        font-size: 1.2em;
    }

    .ac__card:hover {
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
        background: linear-gradient(-135deg, #1ea8aa, #1c689a);
        color: #FFF;
    }

    .ac__card .v-sml-btn {
        font-size: 9px;
        padding: 5px 8px;
        letter-spacing: 1px;
        background: #FFF;
        border: 1px solid #1D96A6;
        color: #1D96A6;
    }

.ac__card-2 .v-sml-btn {
    font-size: 9px;
    padding: 5px 8px;
    letter-spacing: 1px;
}

.ac__card-2 {
    background: #FFF;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    border-radius: 4px;
    padding: 50px 20px;
    text-align: center;
    position: relative;
    transition: 0.3s all;
    margin-bottom: 30px;
}

    .ac__card-2 span {
        font-size: 0.7em;
        letter-spacing: 1px;
        opacity: 0.6;
        text-transform: uppercase;
    }

    .ac__card-2 h4 {
        font-size: 1.2em;
    }

    .ac__card-2:hover {
        box-shadow: 0 8px 16px rgba(0,0,0,0.2);
    }

.ac__card1 {
    background: #FFF;
    border-radius: 4px;
    padding: 2rem !important;
    text-align: center;
    position: relative;
    transition: 0.3s all;
    margin-bottom: 5px;
    box-shadow: 0 15px 25px rgba(0, 0, 0, 0.05); /*box-shadow:0 0px 10px rgba(115, 136, 160, 0.1);*/
}
    /*.ac__card1:hover{box-shadow: 0 7px 7px rgba(115, 136, 160, 0.2);}*/
    .ac__card1 .btn-login {
        font-size: 0.8em;
    }

    .ac__card1 span {
        font-size: 0.9em
    }

    .ac__card1 .progress {
        min-width: 100px;
    }

    .ac__card1 .progress-bar {
        background: #1e9ba7;
    }

    .ac__card1 h4 {
        font-size: 1em;
        margin-bottom: 0
    }

.view_stmt, .view_acc {
    background-color: #1EA8AA;
    color: #fff;
    background-image: linear-gradient(-135deg, #1EA8AA, #1C689A);
    border: none;
}

    .view_acc:hover, .view_stmt:hover {
        border: 1px solid #ddd;
        color: #666;
    }

.ac__card1 .list-inline {
    margin-bottom: 0
}

.ac__card1 .list-inline-item {
    margin-right: 1rem;
    padding-right: 1rem;
    border-right: 1px solid #ddd
}

    .ac__card1 .list-inline-item:last-child {
        margin-right: 0;
        padding-right: 0;
        border-right: none
    }
/*--------------------*/
#diverror {
    display: none;
}

.alert {
    display: block !important;
}
/*
.payment-option123 .acc_del a{ color:#ccc}
    .payment-option123 .acc_del a:hover {
        color: #999
    }
*/


.filter_area form {
    width: 100%;
    display: flex;
    flex-direction: row;
    white-space: nowrap;
    align-items: center;
}

.filter_area .dropdown {
    display: inline-flex;
    width: auto;
    margin-left: 10px;
}

.acc_del a {
    color: #333
}

.paybill-top .big-text {
    display: inline-block;
    vertical-align: middle
}

.table td, .table th {
    vertical-align: middle
}

.recent_payment_histry {
    padding: 20px 30px;
}

.form-control:focus {
    background-color: none !important
}

.modal-open .modal {
    background: rgba(0,0,0,.5);
}

.modal.fade .v_middle {
    transform: translateY(50%) !important;
    -webkit-transform: translateY(50%) !important;
    -moz-transform: translateY(50%) !important;
    -o-transform: translateY(50%) !important;
    -ms-transform: translateY(50%) !important;
}

.mobilepaysuccess {
    position: fixed;
    right: 50px;
    bottom: 30px;
    background: #86c724;
    color: #FFF;
    padding: 20px;
    border-radius: 4px;
}

input[type=number]::-webkit-inner-spin-button,
input[type='number'] {
    -moz-appearance: textfield;
    -webkit-appearance: textfield;
}

.cardCodeNumber {
    -webkit-text-security: disc;
    -moz-text-security: disc;
}

.button-google-pay {
    min-width: 200px;
    min-height: 40px;
    padding: 11px 24px;
    margin: 10px auto;
    background-color: #000;
    background-image: url(data:image/svg+xml,%3Csvg%20width%3D%22103%22%20height%3D%2217%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M.148%202.976h3.766c.532%200%201.024.117%201.477.35.453.233.814.555%201.085.966.27.41.406.863.406%201.358%200%20.495-.124.924-.371%201.288s-.572.64-.973.826v.084c.504.177.912.471%201.225.882.313.41.469.891.469%201.442a2.6%202.6%200%200%201-.427%201.47c-.285.43-.667.763-1.148%201.001A3.5%203.5%200%200%201%204.082%2013H.148V2.976zm3.696%204.2c.448%200%20.81-.14%201.085-.42.275-.28.413-.602.413-.966s-.133-.684-.399-.959c-.266-.275-.614-.413-1.043-.413H1.716v2.758h2.128zm.238%204.368c.476%200%20.856-.15%201.141-.448.285-.299.427-.644.427-1.036%200-.401-.147-.749-.441-1.043-.294-.294-.688-.441-1.183-.441h-2.31v2.968h2.366zm5.379.903c-.453-.518-.679-1.239-.679-2.163V5.86h1.54v4.214c0%20.579.138%201.013.413%201.302.275.29.637.434%201.085.434.364%200%20.686-.096.966-.287.28-.191.495-.446.644-.763a2.37%202.37%200%200%200%20.224-1.022V5.86h1.54V13h-1.456v-.924h-.084c-.196.336-.5.611-.91.826-.41.215-.845.322-1.302.322-.868%200-1.528-.259-1.981-.777zm9.859.161L16.352%205.86h1.722l2.016%204.858h.056l1.96-4.858H23.8l-4.41%2010.164h-1.624l1.554-3.416zm8.266-6.748h1.666l1.442%205.11h.056l1.61-5.11h1.582l1.596%205.11h.056l1.442-5.11h1.638L36.392%2013h-1.624L33.13%207.876h-.042L31.464%2013h-1.596l-2.282-7.14zm12.379-1.337a1%201%200%200%201-.301-.735%201%201%200%200%201%20.301-.735%201%201%200%200%201%20.735-.301%201%201%200%200%201%20.735.301%201%201%200%200%201%20.301.735%201%201%200%200%201-.301.735%201%201%200%200%201-.735.301%201%201%200%200%201-.735-.301zM39.93%205.86h1.54V13h-1.54V5.86zm5.568%207.098a1.967%201.967%200%200%201-.686-.406c-.401-.401-.602-.947-.602-1.638V7.218h-1.246V5.86h1.246V3.844h1.54V5.86h1.736v1.358H45.75v3.36c0%20.383.075.653.224.812.14.187.383.28.728.28.159%200%20.299-.021.42-.063.121-.042.252-.11.392-.203v1.498c-.308.14-.681.21-1.12.21-.317%200-.616-.051-.896-.154zm3.678-9.982h1.54v2.73l-.07%201.092h.07c.205-.336.511-.614.917-.833.406-.22.842-.329%201.309-.329.868%200%201.53.254%201.988.763.457.509.686%201.202.686%202.079V13h-1.54V8.688c0-.541-.142-.947-.427-1.218-.285-.27-.656-.406-1.113-.406-.345%200-.656.098-.931.294a2.042%202.042%200%200%200-.651.777%202.297%202.297%200%200%200-.238%201.029V13h-1.54V2.976zm32.35-.341v4.083h2.518c.6%200%201.096-.202%201.488-.605.403-.402.605-.882.605-1.437%200-.544-.202-1.018-.605-1.422-.392-.413-.888-.62-1.488-.62h-2.518zm0%205.52v4.736h-1.504V1.198h3.99c1.013%200%201.873.337%202.582%201.012.72.675%201.08%201.497%201.08%202.466%200%20.991-.36%201.819-1.08%202.482-.697.665-1.559.996-2.583.996h-2.485v.001zm7.668%202.287c0%20.392.166.718.499.98.332.26.722.391%201.168.391.633%200%201.196-.234%201.692-.701.497-.469.744-1.019.744-1.65-.469-.37-1.123-.555-1.962-.555-.61%200-1.12.148-1.528.442-.409.294-.613.657-.613%201.093m1.946-5.815c1.112%200%201.989.297%202.633.89.642.594.964%201.408.964%202.442v4.932h-1.439v-1.11h-.065c-.622.914-1.45%201.372-2.486%201.372-.882%200-1.621-.262-2.215-.784-.594-.523-.891-1.176-.891-1.96%200-.828.313-1.486.94-1.976s1.463-.735%202.51-.735c.892%200%201.629.163%202.206.49v-.344c0-.522-.207-.966-.621-1.33a2.132%202.132%200%200%200-1.455-.547c-.84%200-1.504.353-1.995%201.062l-1.324-.834c.73-1.045%201.81-1.568%203.238-1.568m11.853.262l-5.02%2011.53H96.42l1.864-4.034-3.302-7.496h1.635l2.387%205.749h.032l2.322-5.75z%22%20fill%3D%22%23FFF%22%2F%3E%3Cpath%20d%3D%22M75.448%207.134c0-.473-.04-.93-.116-1.366h-6.344v2.588h3.634a3.11%203.11%200%200%201-1.344%202.042v1.68h2.169c1.27-1.17%202.001-2.9%202.001-4.944%22%20fill%3D%22%234285F4%22%2F%3E%3Cpath%20d%3D%22M68.988%2013.7c1.816%200%203.344-.595%204.459-1.621l-2.169-1.681c-.603.406-1.38.643-2.29.643-1.754%200-3.244-1.182-3.776-2.774h-2.234v1.731a6.728%206.728%200%200%200%206.01%203.703%22%20fill%3D%22%2334A853%22%2F%3E%3Cpath%20d%3D%22M65.212%208.267a4.034%204.034%200%200%201%200-2.572V3.964h-2.234a6.678%206.678%200%200%200-.717%203.017c0%201.085.26%202.11.717%203.017l2.234-1.731z%22%20fill%3D%22%23FABB05%22%2F%3E%3Cpath%20d%3D%22M68.988%202.921c.992%200%201.88.34%202.58%201.008v.001l1.92-1.918c-1.165-1.084-2.685-1.75-4.5-1.75a6.728%206.728%200%200%200-6.01%203.702l2.234%201.731c.532-1.592%202.022-2.774%203.776-2.774%22%20fill%3D%22%23E94235%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E);
    background-origin: content-box;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.30), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
    outline: 0;
    cursor: pointer;
    display: block;
}
.merchant-note #paypal-button-container {
    z-index: 1 !important;
    position: relative;
}

#applePayButton {
    min-width: 200px;
    min-height: 40px;
    /*padding: 11px 24px;*/
    margin: 10px auto;
    background-color: #000;
    background-origin: content-box;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 1px 1px 0 rgba(60, 64, 67, 0.30), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
    outline: 0;
    cursor: pointer;
    display: block;
    background-image: url("~/Content/images/Apple-Pay-Logo.png")
}
.label-transparent,
.badge-transparent {
    background-color: transparent !important
}

.label-grey,
.badge-grey {
    background-color: #a0a0a0 !important
}

.label-info,
.badge-info {
    background-color: #3a87ad !important
}

.label-primary,
.badge-primary {
    background-color: #2283c5 !important
}

.label-success,
.badge-success {
    background-color: #82af6f !important
}

.label-important,
.badge-important {
    background-color: #d15b47 !important
}

.label-inverse,
.badge-inverse {
    background-color: #333 !important
}

.label-warning,
.badge-warning {
    background-color: #f89406 !important
}

.label-pink,
.badge-pink {
    background-color: #d6487e !important
}

.label-purple,
.badge-purple {
    background-color: #9585bf !important
}

.label-yellow,
.badge-yellow {
    background-color: #fee188 !important
}

.label-light,
.badge-light {
    background-color: #e7e7e7 !important
}

.badge-yellow,
.label-yellow {
    color: #963 !important;
    border-color: #fee188
}

.badge-light,
.label-light {
    color: #888 !important
}

.label.arrowed,
.label.arrowed-in {
    position: relative;
    margin-left: 9px
}

    .label.arrowed:before,
    .label.arrowed-in:before {
        display: inline-block;
        content: "";
        position: absolute;
        left: -14px;
        top: 0;
        border: 9px solid transparent;
        border-width: 9px 7px;
        border-right-color: #abbac3
    }

    .label.arrowed-in:before {
        border-color: #abbac3;
        border-left-color: transparent !important;
        left: -9px
    }

.label.arrowed-right,
.label.arrowed-in-right {
    position: relative;
    margin-right: 9px
}

    .label.arrowed-right:after,
    .label.arrowed-in-right:after {
        display: inline-block;
        content: "";
        position: absolute;
        right: -14px;
        top: 0;
        border: 9px solid transparent;
        border-width: 9px 7px;
        border-left-color: #abbac3
    }

    .label.arrowed-in-right:after {
        border-color: #abbac3;
        border-right-color: transparent !important;
        right: -9px
    }

.label-info.arrowed:before {
    border-right-color: #3a87ad
}

.label-info.arrowed-in:before {
    border-color: #3a87ad
}

.label-info.arrowed-right:after {
    border-left-color: #3a87ad
}

.label-info.arrowed-in-right:after {
    border-color: #3a87ad
}

.label-primary.arrowed:before {
    border-right-color: #2283c5
}

.label-primary.arrowed-in:before {
    border-color: #2283c5
}

.label-primary.arrowed-right:after {
    border-left-color: #2283c5
}

.label-primary.arrowed-in-right:after {
    border-color: #2283c5
}

.label-success.arrowed:before {
    border-right-color: #82af6f
}

.label-success.arrowed-in:before {
    border-color: #82af6f
}

.label-success.arrowed-right:after {
    border-left-color: #82af6f
}

.label-success.arrowed-in-right:after {
    border-color: #82af6f
}

.label-warning.arrowed:before {
    border-right-color: #f89406
}

.label-warning.arrowed-in:before {
    border-color: #f89406
}

.label-warning.arrowed-right:after {
    border-left-color: #f89406
}

.label-warning.arrowed-in-right:after {
    border-color: #f89406
}

.label-important.arrowed:before {
    border-right-color: #d15b47
}

.label-important.arrowed-in:before {
    border-color: #d15b47
}

.label-important.arrowed-right:after {
    border-left-color: #d15b47
}

.label-important.arrowed-in-right:after {
    border-color: #d15b47
}

.label-inverse.arrowed:before {
    border-right-color: #333
}

.label-inverse.arrowed-in:before {
    border-color: #333
}

.label-inverse.arrowed-right:after {
    border-left-color: #333
}

.label-inverse.arrowed-in-right:after {
    border-color: #333
}

.label-pink.arrowed:before {
    border-right-color: #d6487e
}

.label-pink.arrowed-in:before {
    border-color: #d6487e
}

.label-pink.arrowed-right:after {
    border-left-color: #d6487e
}

.label-pink.arrowed-in-right:after {
    border-color: #d6487e
}

.label-purple.arrowed:before {
    border-right-color: #9585bf
}

.label-purple.arrowed-in:before {
    border-color: #9585bf
}

.label-purple.arrowed-right:after {
    border-left-color: #9585bf
}

.label-purple.arrowed-in-right:after {
    border-color: #9585bf
}

.label-yellow.arrowed:before {
    border-right-color: #fee188
}

.label-yellow.arrowed-in:before {
    border-color: #fee188
}

.label-yellow.arrowed-right:after {
    border-left-color: #fee188
}

.label-yellow.arrowed-in-right:after {
    border-color: #fee188
}

.label-light.arrowed:before {
    border-right-color: #e7e7e7
}

.label-light.arrowed-in:before {
    border-color: #e7e7e7
}

.label-light.arrowed-right:after {
    border-left-color: #e7e7e7
}

.label-light.arrowed-in-right:after {
    border-color: #e7e7e7
}

.label-grey.arrowed:before {
    border-right-color: #a0a0a0
}

.label-grey.arrowed-in:before {
    border-color: #a0a0a0
}

.label-grey.arrowed-right:after {
    border-left-color: #a0a0a0
}

.label-grey.arrowed-in-right:after {
    border-color: #a0a0a0
}

.label-large {
    font-size: 13px;
    padding: 3px 8px 4px
}

    .label-large.arrowed,
    .label-large.arrowed-in {
        margin-left: 12px
    }

        .label-large.arrowed:before,
        .label-large.arrowed-in:before {
            left: -16px;
            border-width: 11px 8px
        }

        .label-large.arrowed-in:before {
            left: -12px
        }

    .label-large.arrowed-right,
    .label-large.arrowed-in-right {
        margin-right: 11px
    }

        .label-large.arrowed-right:after,
        .label-large.arrowed-in-right:after {
            right: -16px;
            border-width: 11px 8px
        }

        .label-large.arrowed-in-right:after {
            right: -12px
        }

.more-details {
    position: absolute;
    transform: translate(-50%, -50%);
    left: 50%;
    bottom: -35px;
}

    .more-details a {
        background-color: #FFF;
        box-shadow: 0 2px 4px rgba(0,0,0,0.2);
        padding: 8px 26px;
        border-radius: 25px;
        display: inline-block;
        text-align: center;
        color: #000;
        border: 1px solid #DDD;
    }

.table-bill {
    width: 100%;
    background-color: #FFF;
}

    .table-bill th {
        background: #FFF;
        color: #000;
        border-color: #CCC;
        box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    }

    .table-bill .highlighted td {
        background-color: #F0F4F7;
    }

    .table-bill th:last-child, .table-bill td:last-child {
        text-align: right;
    }

.table-summary {
    border: none;
    text-align: right;
    font-size: 1.2em;
    margin-top: 10px;
}

    .table-summary td {
        border-top: none;
        border-bottom: 1px solid #DDD;
    }

.infobox h5 {
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 20px;
    font-size: 16px;
}

.viewbtn {
    display: inline-block;
    color: rgba(30,155,167,1);
    text-transform: uppercase;
    border-bottom: 2px solid;
    font-size: 0.8em;
    font-weight: 600;
    padding-bottom: 3px;
}

    .viewbtn i {
        margin-right: 5px;
    }

.fix_right {
    position: fixed;
    right: -7%;
    transform: rotate(90deg);
    background: black;
    color: #FFF;
    border-radius: 0;
    top: 50%;
}

#pills-tab {
    justify-content: center;
}

.tab-link {
    padding: 0.5em 1em;
    display: inline-block;
    text-align: center;
    border: 2px solid #DDD;
    min-width: 150px;
    color: #000;
}

    .tab-link:hover, .tab-link.active {
        background-color: #DDD;
        color: #000;
    }

    .tab-link:hover {
        opacity: 0.8;
    }

.info {
    height: 25px;
    width: 25px;
    background-color: rgba(30,155,167,0.5);
    color: #FFF;
    border-radius: 100%;
    display: inline-block;
    text-align: center;
    line-height: 25px !important;
    cursor: help;
}
.pr{
    position:relative;
}
.infobox ul li {
            margin-bottom: 5px;
        }
.label {
    border-radius: 0;
    text-shadow: none;
    font-size: 14px;
    font-weight: normal;
    padding: 1px 16px 1px;
    color: #FFF;
    background-color: #abbac3 !important
}
.infobox {
    background-color: #FFF;
    border-radius: 4px;
    padding: 25px;
    margin-top: 30px;
}

.subhead {
    color: #777;
    font-size: 16px;
    margin-top: 5px;
    display: block;
}
.infobox {
    position: relative;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
    .infobox h2 {
        font-size: 26px;
    }
    .infobox ul {
        margin: 0;
        padding: 0;
        list-style: none;
        margin-top: 30px;
    }
    .user-name span {
    color: #000;
    text-transform: uppercase;
    font-weight: bold;
}
.label[class*="span"][class*="arrow"] {
        min-height: 0
    }

.badge {
    text-shadow: none;
    font-size: 12px;
    padding: 1px 15px;
    font-weight: normal;
    color: #FFF;
    line-height: 15px;
    background-color: #ABBAC3 !important;
}
/*New Css*/

.more-details.more-details_top{ 
	position: relative !important; 
	transform: translate(0,0); 
	left: 0; 
	bottom: auto !important; 
	text-align: center !important; 
	margin-bottom: 20px
}
.showmore{ 
	position: relative; 
	z-index: 1 
}
.more-details.more-details_top:after{ 
	content: ''; 
	position: absolute; 
	left: 0; 
	top: 20px; 
	width: 100%; 
	height: 1px; 
	background:#DDD 
}
.btn-sm{ 
	padding: 0.375rem 1.5rem !important; 
	font-size: 1em;
}
.table-responsive{
	width: 100%; 
	overflow-x: auto; 
}
.table-responsive .table-bordered {
	border: 1px solid #dee2e6 !important; 
}
.more-details a{ 
	min-width: 180px 
}
h2{color:#0e8dc4;		
		font-weight: bold;
        font-size:1.5em;

	}
	h3{color:#0e8dc4;		
		font-weight: bold;
	}
    h5{color:black;    	
		font-weight: bold;
        font-size:0.83em;
    }
    p{	/*font-size:small;
    	font-weight: 500;    	
    	line-height: 18px;*/

    }
    table{table-layout:fixed; width:100%;}
    .main-content{
	margin-left:auto; 
	margin-right:auto; 
	width:1000px;	
}
.main-head{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.container {
    width: 988px;
    margin-right: auto;
    margin-left: auto;
    margin-top: auto;
    margin-bottom: auto;
    /*padding: 0 15px;*/
}
.action-cta{
	text-align: right;
}
.text-label{
	text-align: center;
}
.main-heading{
	text-align:center; 
	vertical-align:text-bottom;
	color: #0e8dc4;
}
.main-heading h1{
	margin-bottom: 10px;	
	font-weight: bold;
}
.error-msg{	
	font-weight: normal;
	font-size: 14px;
    text-align: left;
}
.count-col td{
    text-align:right; 
    width: 48px;
}
.count-col{
	display: none;
}
.form-btn{
	background: #6194c4;
    padding: 10px 40px;
    border: none;
    border-radius: 30px;
    color: #fff;
    cursor: pointer;
}
.form-btn:hover{
	background: #5b88b1;
}
.sdashboard{
    margin-left: auto;
    margin-right: auto;
    width: 1000px;
}
.header_area{
    margin-bottom: 30px;
}
.header_area h1{
    margin-top: 30px;
    font-size:2rem;
}
.submit-wrap a{
    text-decoration:none;
   display: inline;
    width: auto;

}
.submit-wrap td{
    text-align: right;
}
#fieldset_Survey {
    display: block;
    margin-inline-start: 2px;
    margin-inline-end: 2px;
    padding-block-start: 0.35em;
    padding-inline-start: 0.75em;
    padding-inline-end: 0.75em;
    padding-block-end: 0.625em;
    min-inline-size: min-content;
    border-width: 2px;
    border-style: groove;
    border-color: threedface;
    border-image: initial;
}
.header_area h1.table-custom-heading  {
        margin: 0;
        font-size:1.8rem;
    }
.message__content {
    position: relative;
    z-index: 999;
    background: #FFF;
    padding: 50px;
    margin: 0 auto;
    width: 40%;
    border-radius: 4px;
}
.m-rest{ display: none }

.table-cont {
    max-height: 300px;
    background: #FFFFFF;
    color: black;
    font-size: 0.75rem;
}
.table-cont>.table td, .table th {
    padding: .20rem
}
.table-cont>.table-bordered td {
    border: 0;
}
.table-cont>.table th {
   border-bottom: 1px solid black;
}
.table-cont thead th {
    color: black;
    font-size: 0.75rem;
    text-transform: capitalize;
}
.table-cont>.table-bill th {
    box-shadow: none;
}
.table-cont>.table-bordered {
    border: none !important;
}
.table-cont>.table-bordered td, .table-bordered th{
    border: none;
}

.linear-green-bg {
    background: linear-gradient(123.82deg, #577B40 20.08%, #9AB84F 76.96%);
}

.pb-left-panel {
    padding-left: 0 !important;
}
.left-panel-header-note {
    font-size: .90rem;
    text-align: center;
    color: white;
    padding-top: .8rem;
}


/*new css innovation*/
.redbox {
    border: 2px solid red;
}

.main-form {
    padding-top: 25px;
}

.logo-space-box {
    /*border: 1px solid #707070;*/
    opacity: 1;
    width: 309px;
    height: 68px;
    margin-left: 37px;
}

.logo-space-box-sm {
    /*border: 1px solid #707070;*/
    opacity: 1;
    height: 68px;
}

.logo-text {
    font: normal 900 24px 'Roboto', sans-serif;
    margin: auto;
}

.already-text {
    font: normal normal bold 14px/19px 'Roboto', sans-serif;
}

.already-text-sm {
    text-align: center;
    font: normal normal bold 14px/19px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}

.login-text {
    font: normal normal bold 14px/19px 'Roboto', sans-serif;
    color: #01A4E3;
    opacity: 1;
    text-decoration: underline;
    padding-left: 6px;
    padding-right: 4px;
}

.login-text-sm {
    text-decoration: underline;
    font: normal normal bold 14px/19px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #01A4E3;
    opacity: 1;
}

.to-make-payment-text {
    font-size: small;
    font-weight: 500;
    line-height: 18px;
}

.horizontal-line {
    border-top: 1px solid #707070;
    margin-left: 37px;
    margin-right: 25px;
}

.welcome-text {
    text-align: left;
    font: normal normal bold 28px/28px Tahoma;
    letter-spacing: 0px;
    color: #01A4E3;
    opacity: 1;
}

.welcome-text-sm {
    text-align: center;
    font: normal normal bold 28px/28px Tahoma;
    letter-spacing: 0px;
    color: #01A4E3;
    opacity: 1;
}

.slogan-design {
    margin-top: 24.5px;
    margin-left: 38px;
}

.simple-subtext {
    text-align: left;
    font: italic normal bold 14px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
    padding-top: 1.5rem;
}

.simple-and-fast-subtext {
    text-align: center;
    font: normal normal bold 14px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
    padding-top: 1.7rem;
}

.simple-subtext-sm {
    text-align: center;
    font: italic normal bold 12px/12px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
}

.why-register-text {
    text-align: left;
    font: normal normal bold 20px/16px Tahoma;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
    margin-bottom: 1.5rem;
    margin-top: 3rem;
} 

.why-register-text-sm {
    text-align: center;
    font: normal normal bold 20px/16px Tahoma;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
}

.bullets {
    margin-top: 0;
    padding: 0;
    margin-left: 21px;
    margin-bottom: 13px;
}
    
    .bullets sm {
        text-align: left;
        font: normal normal medium 14px/34px Roboto;
        letter-spacing: 0px;
        color: #5F5B5B;
        opacity: 1;
    }

    .bullets li {
        list-style: none;
        margin-bottom: 7px;
        text-align: left;
        font: normal normal bold 16px/24px 'Roboto', sans-serif;
        letter-spacing: 0px;
        color: #5F5B5B;
        opacity: 1;
    }

    .bullets i {
        color: #01A4E3;
        margin-right: 7px;
    }

    .bullets p {
        text-align: left;
        font: italic normal normal 12px/24px 'Roboto', sans-serif;
        letter-spacing: 0px;
        color: #5F5B5B;
        opacity: 1;
        margin-left: 29px;
        line-height: 12px;
    }

.btn-reg {
    background: #01A4E3 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    text-align: center;
    font: normal normal bold 18px/24px 'Roboto', sans-serif;
    letter-spacing: 1px;
    color: #FFFFFF;
    min-width: 140px !important;
    height: 39px;
}


.tab-box {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #01A4E3;
    opacity: 1;
    min-height: 383px !important;
}

.paybill-title-text {
    text-align: left;
    font: normal normal bold 16px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #5F5B5B;
    opacity: 1;
}

.paybill-subtitle-text {
    text-align: left;
    font: normal normal bold 12px/12px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #676767;
    opacity: 1;
    margin-top: 1rem;
}

.nav-tab-design {
    background: #FFFFFF 0% 0% no-repeat padding-box !important;
    border: 1px solid #01A4E3 !important;
    border-radius: 8px 8px 0px 0px !important;
    opacity: 1 !important;
    font: normal normal bolder 18px/18px 'Roboto', sans-serif !important;
    letter-spacing: 1px !important;
    color: #01A4E3 !important;
    text-align: center !important;
}

.tab-mr {
    margin-right: 20px;
}

.nav-link.active {
    background: #01A4E3 0% 0% no-repeat padding-box !important;
    border-radius: 8px 8px 0px 0px !important;
    opacity: 1 !important;
    font: normal normal bolder 18px/18px 'Roboto', sans-serif !important;
    letter-spacing: 1px !important;
    color: #FFFFFF !important;
}

.nav-tabs {
    border-bottom: none;
}

.tel-no-text {
    text-align: left;
    font: normal normal bold 11px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    margin-top: 12px;
}

.tel-no-text-sm {
    font: normal normal bold 12px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}

.tel-no {
    font: normal normal bold 11px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #01A4E3;
    opacity: 1;
    margin-left: 5px;
}

.tel-no-sm {
    font: normal normal bold 12px/16px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #01A4E3;
    opacity: 1;
}

.tel-no-subtext {
    text-align: right;
    font: normal normal normal 10px/15px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
}

.tel-no-subtext-sm {
    font: normal normal bold 9px/11px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
}

.pay-bill-mt {
    margin-top: 76.5px;
}

.phone-number-label {
    text-align: left;
    font: normal normal bold 13px/13px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}

.phone_number-field {
    border: 1px solid #E4E4E4;
    border-radius: 5px;
    opacity: 1;
    width: 100%;
}

.pay-bill-btn {
    background: #01A4E3 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    text-align: center;
    font: normal normal bold 18px/18px 'Roboto', sans-serif;
    letter-spacing: 1px;
    color: #FFFFFF;
    min-width: 110px !important;
    height: 39px;
}

.v-line {
    width: 1px !important;
    height: 90% !important;
}

.white-bg {
    background: #FFFFFF;
    border-radius: 0.3rem;
}

.field-label {
    font: normal normal bold 13px/13px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}

.field-label-link {
    font: normal normal bold 12px/12px 'Roboto', sans-serif;
    letter-spacing: 0px;
    color: #01A4E3;
}

.quick-pay-fields {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    border: 1px solid #E4E4E4;
    border-radius: 5px;
    opacity: 1;
    width: 282px;
}

.quick-pay-margins-sm {
    margin-left: 0;
}

.poweredby-img {
    height: 2rem;
    margin: 1rem;
}

.login-upper-header-menu {
    color: #FFFFFF;
    font-size: 10pt;
    font-weight: normal;
    font-style: normal;
    text-align: right;
    margin-bottom: 5px;
}

.login-upper-header-menu a {
    margin-left: 7px!important;
}
.login-upper-header-menu div{
    margin-bottom: 0;
    max-height: 16px;
}

.login-upper-header-menu div p{
    display:inline-block;
    margin-left: 40px;
}

.login-upper-header-menu div p a{
    color: #FFFFFF;
}

.modal-dialog {
    margin-top: 0;
}

.already-text-margins {
    margin-right: 1.5rem;
}

.register-text-left {
    margin-top: 95px;
    margin-right: 30px;
}

.img-size {
    height: 46px;
    width: 46px;
    vertical-align: top !important;
    margin-top: 6px;
}

.btn-bg {
    background: #01A4E3;
}

.p-3icons {
    color: #707070;
    font: normal normal bold 14px/16px 'Roboto', sans-serif;
    height: 20px;
    margin-top: 12px;
}