 <div class="row" id="gift-voucher" style="display:none;">
        <div class="col-md-12">
            <div class="card-box">
                <div class="pull-right">
                    <button onclick="back('#gift-voucher', '#divmain'); removeNiceScroll();" class="btn btn-inverse btn-xs w-md m-b-5"><i class="glyphicon glyphicon-chevron-left"></i> Back</button>
                </div>
                <h4 class="header-title m-t-0 m-b-30">Generate Customer Gift Voucher - <label id="labelvouchercustomer"></label> </h4>
                <div class="row">
                    <div class="col-md-4 hidden">
                        <div class="form-group">
                            <label for="voucher-customer-name" class="control-label">Name</label>
                            <input readonly="readonly" type="text" class="form-control" id="voucher-customer-name" name="voucher-customer-name" placeholder="Name">
                            <input type="hidden" class="form-control" id="voucher-customer-id" name="voucher-customer-id">

                        </div>
                    </div>
                    <div class="col-md-4 hidden">
                        <div class="form-group">
                            <label for="voucher-customer-cell" class="control-label">Cell Number</label>
                            <input readonly="readyonly" type="text" class="form-control" id="voucher-customer-cell" name="voucher-customer-cell" placeholder="Cell Phone">
                        </div>
                    </div>
                    <div class="col-md-4 hidden">
                        <div class="form-group">
                            <label for="voucher-customer-email" class="control-label">Email</label>
                            <input readonly="readyonly" type="text" class="form-control" id="voucher-customer-email" name="voucher-customer-email" placeholder="Email">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label class="control-label" for="voucher-valid-until">Valid Until</label>
                            <input id="voucher-valid-until" name="voucher-valid-until" class="form-control" type="text" placeholder="Click here">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label class="control-label">Voucher Type</label>
                            <div style="border: 1px solid #ddd; border-radius: 4px; padding: 8px;">
                                <div class="radio radio-pink pull-left" style="margin: 0px;">
                                    <input class="form-control" name="voucher-type" value="amount" type="radio">
                                    <label>Amount</label>
                                </div>
                                <div class="radio radio-pink pull-right" style="margin: 0px;">
                                    <input class="form-control" name="voucher-type" value="service" type="radio">
                                    <label>Service</label>
                                </div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label class="control-label" for="voucher-number-optional">Voucher # <small>(optional)</small></label>
                            <input id="voucher-number-optional" name="voucher-number-optional" class="form-control numeric" type="text" placeholder="optional">
                        </div>
                    </div>
                    <div class="col-md-3">
                        <div class="form-group">
                            <label class="control-label">Payment: <span id="mode">Cash</span></label>
                            <div id="ccp" style="display:none;"><input placeholder="C-Card#" class="form-control numeric" id="ccno"  name="ccno"/></div>
                            <div id="checkp" style="display:none;"><input placeholder="Instrument#" class="form-control numeric" id="checkno"  name="checkno"/></div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12">
                        <div class="row" id="voucher-price-div" style="display: none;">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="control-label">Voucher Price</label>
                                    <input id="voucher-price" name="voucher-price" class="form-control numeric" type="text" placeholder="Amount">
                                </div>
                            </div>
                            <div class="col-md-8">
                                <div class="form-group">
                                    <label class="control-label">Printable Voucher Heading</label>
                                    <input id="voucher-heading" name="voucher-heading" class="form-control" type="text" placeholder="Use Package Name or other relevent printable info">
                                </div>
                            </div>
                        </div>
                        <div class="row" id="voucher-services-div" style="display: none;">
                            <div class="col-md-4">
                                <div class="form-group" style="border: 1px solid #eaeaea; padding: 10px;">
                                    <label class="control-label">Services Types</label>
                                    <div id="voucher-services-types" class="nicescroll_vtypes voucher-services-types" style="height: 180px; overflow: hidden; outline: none;">

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group" style="border: 1px solid #eaeaea; padding: 10px;">
                                    <label class="control-label">Services Categories</label>
                                    <div id="voucher-services-categories" class="nicescroll_4" style="height: 180px; overflow: hidden; outline: none;">

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group" style="border: 1px solid #eaeaea; padding: 10px;">
                                    <label for="voucher-services" class="control-label">Select Services</label><button onclick="selectallservices()" class="pull-right btn btn-xs btn-primary waves-effect waves-light">All</button>
                                    <div id="voucher-services" class="nicescroll_5" style="height: 180px; overflow: hidden; outline: none;">
                                        <div style="display: none;" id="fa-spinner" class="fa fa-spin fa-spinner"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12" style="text-align: right">
                        <span id="voucherNumber" style="visibility: hidden;"></span>
                        <a href="" target="_blank" style="display: none;" id="voucherBtnPreview" class="btn btn-default waves-effect waves-light">Print Preview</a>
                        <div class="btn-group m-r-10 dropup">
                            <button type="button" class="btn btn-custom dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-expanded="false">Payment mode <span class="m-l-5"><i class="fa fa-money"></i></span></button>
                            <ul class="dropdown-menu" role="menu">
                                <li><a href="javascript:void(0);" onclick="opencash();">Cash</a></li>
                                <li><a href="javascript:void(0);" onclick="opencc();">Credit Card</a></li>
                                <li><a href="javascript:void(0);" onclick="openbank('Check');">Check</a></li>
                                <!--<li><a href="javascript:void(0);" onclick="openbalance('Balance');">Balance</a></li>-->
                            </ul>
                        </div>
                        <button type="button" onclick="generateGiftVoucher();" id="voucherBtn" class="btn btn-info waves-effect waves-light">Save Changes</button>
                    </div>
                </div>
            </div>
        </div>
    </div>    