@import url(variables.css);

        body {
            background-color: #FFF;
            font-family: arial, sans-serif;
            color: #666;
            font-size: 12px;
        }



        .btn-submit,
        .form-section input,
        .form-section button,
        .form-section select {
            font-size: 12px;
            color: #666;
        }

        .form-section input,
        .form-section select {
            font-size: 12px;
            color: #666;
            background-color: #f8f9fb;
        }

        h3,
        h4 {
            font-weight: 700;
        }

        h3 {
            margin-bottom: 18px;
            font-size: 18px;
        }

        h4 {
            font-size: 14px;
            display: inline-block;
            background: #FFF;
            z-index: 1;
            position: relative;
            padding: 0px 5px;
            color: #6e93b0;
        }

        .btn-primary {
            background-color: #3ba0ff;
            border: none;
        }

        .btn-primary:hover {
            background-color: #2f7fcc;
        }

        .table thead tr th {
            background-color: var(--color-2);
            color: #fff;
            border-color: var(--color-2);
        }

        .btn-var-2 i {
            background-color: #FFF;
            color: #6e93b0;
            font-size: 14px;
        }

        .card {
            border-radius: 12px;
            border: none;
        }

        .sub-billing-select,
        .sub-billing-input {
            transition: 0.3s ease;
        }

        input[type='number'].form-control,
        th.fees {
            max-width: 100%;
            width: 100%;
        }

        select.form-select.billing-select.mb-1,
        input.form-control.sub-billing-input {
            width: 100% !important;
        }

        .cstm-bg {
            background-color: #eff0f1 !important;
            margin: 0 !important;
            width: 100% !important;
            max-width: 100% !important;
        }

        .display-flex div {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-end;
        }

        .row-number {
            display: block !important;
            width: 100%;
            text-align: left;
            color: #666;
        }

        .form-label {
            margin-bottom: 0;
            text-align: left;
            display: inline-block;
            width: 100%;
            color: #666;
        }

        .color-6e93b0 {
            color: #6e93b0 !important;
        }

        @media (max-width: 760.98px) {
            h4 {
                margin-bottom: 4px;
                font-size: 18px;
                background-color: #FFF;
            }

            .container {
                margin: 0 !important;
            }

            input[type='number'].form-control,
            th.fees {
                max-width: 100%;
            }

            .deletebutton {
                position: absolute;
                top: 0;
                right: 25px;
                z-index: 1;
            }

        }