Untitled

<html>
<head>
    <meta charset="utf-8" />
<style type="text/css">

.wrapper {max-width: 990px }

.header > h1 {
    display: inline-block;
    margin: 0px;
    vertical-align: top;
    width: 55%;
    max-width: 60%;
    max-width: 60%;
}

.header > .header_box {
    display: inline-block;
    height: 120px;
    width: 45%;
    border: 4px double #000;
    text-align: right;
    padding: 4% 5px 1%;
    box-sizing: border-box;
    vertical-align: bottom;
    min-width: 350px;
}
.header {margin-bottom: 10px}
.mid > div {
    display: inline-block;
    height: 400px;
    vertical-align: top;
    border: 1px solid rgb(187, 187, 187);
    box-sizing: border-box;
    width: 32.6%;
    padding: 10px;
    min-width: 220px;
}
.mid .to {
  margin: 0 1%;
}
.mid {margin-bottom: 10px}

.footer table {
  width: 100%;
  border-collapse: collapse;
}
.footer table td {
  border: 1px solid;
}
.footer .total {
  margin-top: 30px;
}
</style>
</head>
<body>
<div class='wrapper'>
    <div class='header'>
        <h1>Заголовок размытый</h1><div class='header_box'>
            <div><b>Invoice</b> ${INVOICE_NUMBER}</div>
            <div><b>issued on</b> ${ISSUED_DATA}</div>
            <div><b>Must be paid to:</b> ${ISSUED_DEADLINE}</div>
        </div>
    </div>
    <div class='mid'>
        <div class='from'>
            <h2>From:</h2>
            <div>Размытый<br/> текст</div>
            <h2>Beneficiary Bank:</h2>
            <div>Размытый текст</div>
        </div><div
    class='to'>
            <h2>To:</h2>
            <div>${INVOICE_TO}</div>
        </div><div
    class='summary'>
            <h2>Invoice summary:</h2>
            <div>
        <div>Invoice for: <b>${ISSUED_TO}</b></div>
        <div>Account number: <b>${ACCOUNT}</b></div>
        <div>Invoice amount: ${AMOUNT}</div>
        </div>
        </div>
    </div>
    <div class='footer'>
        <table>
        <tr>
            <td>Service desctiption</td>
            <td>Amount</td>
            <td>Unit</td>
            <td>Cost, per unit</td>
            <td>VAT</td>
            <td>Summary</td>
        </tr>
        <tr>
            <td>${r_desc}</td>
            <td>${r_qty}</td>
            <td>${r_unit}</td>
            <td>${r_unit_cost}</td>
            <td>${r_vat}</td>
            <td>${r_summary}</td>
        </tr>
    </table>
        <div class='total'><b>Total:</b> ${INVOICE_TOTAL}</div>
    </div>
</div>
</body>
</html>