Untitled

<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title> BILL | Invoice Print</title>
{{--
    <link href="{{asset('css/bootstrap.min.css')}}" rel="stylesheet">
    <link href="{{asset('font-awesome/css/font-awesome.css')}}" rel="stylesheet">

    <link href="{{asset('css/animate.css')}}" rel="stylesheet">
    <link href="{{asset('css/style.css')}}" rel="stylesheet">--}}

</head>
<style type="text/css">

        .res {
            width: 50% !important;
            float: left;
        }


</style>


<style type="text/css">


     { margin: 0; padding: 0; }
    body { font: 14px/1.4 Georgia, serif; }
    #page-wrap { width: 800px; margin: 0 auto; }

    textarea { border: 0; font: 14px Georgia, Serif; overflow: hidden; resize: none; }
    table { border-collapse: collapse; }
    table td, table th { border: 1px solid black; padding: 5px; }

    #header { height: 15px; width: 100%; margin: 20px 0; background: #222; text-align: center; color: white; font: bold 15px Helvetica, Sans-Serif; text-decoration: uppercase; letter-spacing: 20px; padding: 8px 0px; }

    #address { width: 250px; height: 150px; float: left; }
    #customer { overflow: hidden; }

    #logo { text-align: right; float: right; position: relative; margin-top: 25px; border: 1px solid #fff; max-width: 540px; max-height: 100px; overflow: hidden; }
    #logo:hover, #logo.edit { border: 1px solid #000; margin-top: 0px; max-height: 125px; }
    #logoctr { display: none; }
    #logo:hover #logoctr, #logo.edit #logoctr { display: block; text-align: right; line-height: 25px; background: #eee; padding: 0 5px; }
    #logohelp { text-align: left; display: none; font-style: italic; padding: 10px 5px;}
    #logohelp input { margin-bottom: 5px; }
    .edit #logohelp { display: block; }
    .edit #save-logo, .edit #cancel-logo { display: inline; }
    .edit #image, #save-logo, #cancel-logo, .edit #change-logo, .edit #delete-logo { display: none; }
    #customer-title { font-size: 20px; font-weight: bold; float: left; }

    #meta { margin-top: 1px; width: 300px; float: right; }
    #meta td { text-align: right;  }
    #meta td.meta-head { text-align: left; background: #eee; }
    #meta td textarea { width: 100%; height: 20px; text-align: right; }

    #items { clear: both; width: 100%; margin: 30px 0 0 0; border: 1px solid black; }
    #item { clear: both; width: 100%; margin: 160px 0 20px 0; border: 0px solid black; mar}
    #items th { background: #eee; }
    #items textarea { width: 80px; height: 50px; }
    #items tr.item-row td { border: 1; vertical-align: top; }
    #items td.description { width: 300px; }
    #items td.item-name { width: 175px; }
    #items td.description textarea, #items td.item-name textarea { width: 100%; }
    #items td.total-line { border-right: 0; text-align: right; }
    #items td.total-value { border-left: 0; padding: 10px; }
    #items td.total-value textarea { height: 20px; background: none; }
    #items td.balance { background: #eee; }
    #items td.blank { border: 0; }

    #terms { text-align: center; margin: 20px 0 0 0; }
    #terms h5 { text-transform: uppercase; font: 13px Helvetica, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 0 0 8px 0; }
    #terms textarea { width: 100%; text-align: center;}

    textarea:hover, textarea:focus, #items td.total-value textarea:hover, #items td.total-value textarea:focus, .delete:hover { background-color:#EEFF88; }

    .delete-wpr { position: relative; }
    .delete { display: block; color: #000; text-decoration: none; position: absolute; background: #EEEEEE; font-weight: bold; padding: 0px 3px; border: 1px solid; top: -6px; left: -22px; font-family: Verdana; font-size: 12px; }

    #hiderow,
    .delete {
        display: none;
    }

</style>
<div id="page-wrap">

    <textarea id="header">INVOICE</textarea>

    <div id="identity">

            <textarea id="address">Chris Coyier
123 Appleseed Street
Appleville, WI 53719

Phone: (555) 555-5555</textarea>

        <div id="logo">

            <div id="logoctr">
                <a href="javascript:;" id="change-logo" title="Change logo">Change Logo</a>
                <a href="javascript:;" id="save-logo" title="Save changes">Save</a>
                |
                <a href="javascript:;" id="delete-logo" title="Delete logo">Delete Logo</a>
                <a href="javascript:;" id="cancel-logo" title="Cancel changes">Cancel</a>
            </div>

            <div id="logohelp">
                <input id="imageloc" type="text" size="50" value="" /><br />
                (max width: 540px, max height: 100px)
            </div>
            <img id="image" src="techcity.png" alt="logo" />
        </div>

    </div>

    <div style="clear:both"></div>

    <div id="customer">

            <textarea id="customer-title">Widget Corp.
c/o Steve Widget</textarea>

        <table id="meta">
            <tr>
                <td class="meta-head">Invoice #</td>
                <td>000123</td>
            </tr>
            <tr>

                <td class="meta-head">Date</td>
                <td id="date">December 15, 2009</td>
            </tr>
            <tr>
                <td class="meta-head">Amount Due</td>
                <td><div class="due">$875.00</div></td>
            </tr>

        </table>

    </div>

    <table id="items">

        <tr>
            <th>SL</th>
            <th>Description</th>
            <th>Head of Expenses</th>
            <th>Area(Sft)</th>
            <th>Rate (BDT/Sft) </th>
            <th>Amount (BDT) </th>
        </tr>

        <tr class="item-row">
            <td class="item-name"><div class="delete-wpr">Web Updates <a class="delete" href="javascript:;" title="Remove row">X</a></div></td>
            <td class="description">Monthly web updates for http://widgetcorp.com (Nov. 1 - Nov. 30, 2009)</td>
            <td class="cost">$650.00 </td>
            <td class="qty">1 </td>
            <td class="rate">1 0</td>
            <td><span class="price">$650.00</span></td>
        </tr>

        <tr class="item-row">
            <td class="item-name"><div class="delete-wpr"><textarea>SSL Renewals</textarea><a class="delete" href="javascript:;" title="Remove row">X</a></div></td>

            <td class="description">Yearly renewals of SSL certificates on main domain and several subdomains</td>
            <td class="cost">$650.00 </td>
            <td class="qty">1 </td>
            <td class="rate">1 0</td>
            <td><span class="price">$650.00</span></td>
        </tr>

        <tr id="hiderow">
            <td colspan="5"><a id="addrow" href="javascript:;" title="Add a row">Add a row</a></td>
        </tr>

        <tr>
            <td colspan="3" class="blank"> </td>
            <td colspan="2" class="total-line">Subtotal</td>
            <td class="total-value"><div id="subtotal">$875.00</div></td>
        </tr>
        <tr>

            <td colspan="3" class="blank"> </td>
            <td colspan="2" class="total-line">Total</td>
            <td class="total-value"><div id="total">$875.00</div></td>
        </tr>
        <tr>
            <td colspan="3" class="blank"> </td>
            <td colspan="2" class="total-line">Amount Paid</td>

            <td class="total-value"><textarea id="paid">$0.00</textarea></td>
        </tr>
        <tr>
            <td colspan="3" class="blank"> </td>
            <td colspan="2" class="total-line balance">Balance Due</td>
            <td class="total-value balance"><div class="due">$875.00</div></td>
        </tr>

    </table>

    <div id="terms">

        <p> <strong> Total Amount in word:  </strong> Tweleve thousnads five taka </p>
        <p> For Techcity Bangladesh Limited</p>

    </div>

</div>


<div id="terms" >
    <div class="row" style="margin:100px 20px 20px 20px">
        <div class="res">
            <p>Finance & Accounts </p>
        </div>
        <div class="res">
            <p> Authorized Signature</p>
        </div>
    </div>
</div>


<div id="terms">
    <p style="margin-top: 20px"><stroong> NOTE:</stroong></p>

        Pay the Bill On Account of Techchity Bangladesh LTD, A/C NO: 00433010972, Bank Asia Ltd, Gulshan Branch <br/>
       Payment Terms : 100% of this invoice is payable within 26th December 19 by account payee cheque/Pay order favouring Techcity Bangladesh Ltd. <br/>
        Bill Received by you shall be deemed correct and accepted by you unless techcity Bangladesh Ltd is notified to the contary within 02 days of receipt of this bill
       This bill included demand charge and system loss

</div>

<div id="terms" style="margin-top: 20px;">
    <p> <strong> Corporate office</strong> Techcity Bangladesh Limited ,242/A Tejgaon I/A , Gulshan Link Road , Dhaka -1208 , Bangladesh </p>

    <strong>Phone</strong> +88028879224-25 , <strong> FAX </strong> +88028870922 , <strong> Web</strong> www.techcitybd.net
    <br>
    Factory /Project Address: Sheikh Hasina software Technology Park, Jessore
</div>

</body>

</html>