<!DOCTYPE HTML>
<html style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-family: sans-serif;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;font-size: 10px;-webkit-tap-highlight-color: rgba(0,0,0,0);">

<head style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;"></script>


    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;"></script>
</head>
<style style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">
    .form-horizontal .textalign {
        text-align: left !important;
    }

    .textalign .form-group {
        border-bottom: 1px solid #efeded;
        margin-left: 0px;
        margin-right: 0px;
    }
</style>

<body style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin: 0;font-family: &quot;Helvetica Neue&quot;,Helvetica,Arial,sans-serif;font-size: 14px;line-height: 1.42857143;color: #333;background-color: #fff;">
    <div class="container" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;">


        <div style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">
            <div class="modal-dialog" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;width: auto;margin: 10px;">
                <div class="modal-content" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;background-color: #fff;-webkit-background-clip: padding-box;background-clip: padding-box;border: 1px solid rgba(0,0,0,.2);border-radius: 6px;outline: 0;-webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);box-shadow: 0 5px 15px rgba(0,0,0,.5);">
                    <div class="modal-header" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 15px;border-bottom: 1px solid #e5e5e5;">
                        <h4 class="modal-title" style="text-align: center;font-size: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-family: inherit;font-weight: 500;line-height: 1.42857143;color: inherit;margin-top: 10px;margin-bottom: 10px;margin: 0;">Socioboard Paymnet Invoice</h4>
                    </div>
                    <div class="modal-body col-md-offset-3" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-left: 25%;position: relative;padding: 15px;">
                        <div class="container" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding-right: 15px;padding-left: 15px;margin-right: auto;margin-left: auto;">
                            <div class="row" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-right: -15px;margin-left: -15px;">
                                <div class="col-xs-12 col-sm-12 col-md-4 col-md-offset-1" style="padding-bottom: 20px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;float: left;width: 33.33333333%;margin-left: 8.33333333%;">
                                    <img src="https://i.imgur.com/qAdpCjL.png" alt="" class="img-rounded img-responsive col-offset-md-1 col-offset-sm-1" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;border: 0;vertical-align: middle;page-break-inside: avoid;display: block;max-width: 100%!important;height: auto;border-radius: 6px;">
                                </div>
                            </div>
                            <div class="row" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-right: -15px;margin-left: -15px;">
                                <div class="col-xs-12 col-sm-6 col-md-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;float: left;width: 50%;">
                                    <div class="well well-sm" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;min-height: 20px;padding: 9px;margin-bottom: 20px;background-color: #f5f5f5;border: 1px solid #e3e3e3;border-radius: 3px;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);box-shadow: inset 0 1px 1px rgba(0,0,0,.05);">
                                        <div class="row" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-right: -15px;margin-left: -15px;">

                                            <div class="col-sm-6 col-md-8 col-md-offset-2" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 66.66666667%;margin-left: 16.66666667%;">
                                                <form class="form-horizontal textalign" role="form" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">
                                                    <fieldset style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 0;margin: 0;border: 0;min-width: 0;">

                                                        <div class="form-group " style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Name</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[Payername]</label>
                                                            </div>
                                                        </div>


                                                        <div class="form-group " style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Email</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[payer_email]</label>
                                                            </div>
                                                        </div>


                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Package</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[item_name] Socioboard</label>
                                                            </div>
                                                        </div>


                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Created Date</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[subscr_date]</label>
                                                            </div>

                                                        </div>

                                                    </fieldset>
                                                </form>
                                            </div>
                                        </div>
                                        <hr style="-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box;height: 0;margin-top: 20px;margin-bottom: 20px;border: 0;border-top: 1px solid #eee;">
                                        <div class="row" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-right: -15px;margin-left: -15px;">

                                            <div class="col-sm-12 col-md-8 col-md-offset-2" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 66.66666667%;margin-left: 16.66666667%;">
                                                <form class="form-horizontal textalign" role="form" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;">
                                                    <fieldset style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 0;margin: 0;border: 0;min-width: 0;">

                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Transaction ID</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[paymentId]</label>
                                                            </div>

                                                        </div>


                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Transaction Amount</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[amount]</label>
                                                            </div>

                                                        </div>


                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Transaction Status</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[payment_status]</label>
                                                            </div>

                                                        </div>


                                                        <div class="form-group" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom: 15px;margin-right: 0px;margin-left: 0px;border-bottom: 1px solid #efeded;">
                                                            <label class="col-sm-6 control-label textalign" for="textinput" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;text-align: left !important;">Media Device</label>
                                                            <div class="col-sm-6" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;position: relative;min-height: 1px;padding-right: 15px;padding-left: 15px;width: 50%;">
                                                                <label type="text" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;">[media]</label>
                                                            </div>

                                                        </div>

                                                    </fieldset>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer" style="-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 15px;text-align: right;border-top: 1px solid #e5e5e5;">

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


</body>

</html>