<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-md-9">
<div class="well">
<div class="media">
<div class="media-body">
<h4 class="media-heading">Nome da Empresa</h4>
<p>
Endereço: Endereco da empresa, 0000 <br>
Bairro: Rio Molha Cep: 89000-000 <br>
Cidade: Jaraguá do Sul - Sc <br>
Fone: (47) 3333-3333 Fax:(47) 3333-3333
</p>
</div>
</div>
</div>
<p class="text-right">Jaraguá do Sul, 01 de abril de 2016.</p>
<div class="alert alert-warning">
<h4>Duplicatas a Vencer</h4>
<p>Prezado cliente temos um vencimento programado para as datas abaixo, favor Verificar se esta tudo ok para fazer o pagamento.</p>
<p>Caso não tenha recebido o boleto ou surgir qualquer imprevisto, favor entrar em contato:</p>
</div>
<table class="table table-list-search">
<thead>
<tr>
<th>Rep</th>
<th>Duplicata</th>
<th>Emissão</th>
<th>Vencimento</th>
<th>Valor</th>
<th>Saldo</th>
<th>Portador</th>
<th>Número Titulo</th>
</tr>
</thead>
<tbody>
<tr>
<td>125</td>
<td>12335-1/1</td>
<td>12-11-2011</td>
<td>20-11-2011</td>
<td>123,00</td>
<td>123,00</td>
<td>Banco do Brasil</td>
<td>01234-15678-12356-12358-12335-221322</td>
</tr>
<tr>
<td>125</td>
<td>12335-1/1</td>
<td>12-11-2011</td>
<td>20-11-2011</td>
<td>123,00</td>
<td>123,00</td>
<td>Banco do Brasil</td>
<td>01234-15678-12356-12358-12335-221322</td>
</tr>
<tr>
<td>125</td>
<td>12335-1/1</td>
<td>12-11-2011</td>
<td>20-11-2011</td>
<td>123,00</td>
<td>123,00</td>
<td>Banco do Brasil</td>
<td>01234-15678-12356-12358-12335-221322</td>
</tr>
<tr>
<td>125</td>
<td>12335-1/1</td>
<td>12-11-2011</td>
<td>20-11-2011</td>
<td>123,00</td>
<td>123,00</td>
<td>Banco do Brasil</td>
<td>01234-15678-12356-12358-12335-221322</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
/* Methods */
.method .header, .method .cell {
padding: 6px 6px 6px 10px; }
.method .list-header .header {
font-weight: normal;
text-transform: uppercase;
font-size: 0.8em;
color: #999;
background-color: #eee; }
.method [class^="row"],
.method [class*=" row"] {
border-bottom: 1px solid #ddd; }
.method [class^="row"]:hover,
.method [class*=" row"]:hover {
background-color: #f7f7f7; }
.method .cell {
font-size: 0.85em; }
.method .cell .mobile-isrequired {
display: none;
font-weight: normal;
text-transform: uppercase;
color: #aaa;
font-size: 0.8em; }
.method .cell .propertyname {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
.method .cell .type {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; }
.method .cell code {
color: #428bca; }
.method .cell a, .method .cell a:hover {
text-decoration: none; }
.method .cell code.custom {
color: #8a6d3b;
text-decoration: none; }
.method .cell .text-muted {
color: #ddd; }
@media (max-width: 991px) {
.method [class^="row"],
.method [class*=" row"] {
padding-top: 10px;
padding-bottom: 10px; }
.method .cell {
padding: 0 10px; }
.method .cell .propertyname {
font-weight: bold;
font-size: 1.2em; }
.method .cell .propertyname .lookuplink {
font-weight: normal;
font-size: 1.5em;
position: absolute;
top: 0;
right: 10px; }
.method .cell .type {
padding-left: 10px;
font-size: 1.1em; }
.method .cell .isrequired {
padding-left: 10px;
display: none; }
.method .cell .description {
padding-left: 10px; }
.method .cell .mobile-isrequired {
display: inline; } }
/* Row Utilities */
[class^='row'].margin-0,
[class*=' row'].margin-0,
[class^='form-group'].margin-0,
[class*=' form-group'].margin-0 {
margin-left: -0px;
margin-right: -0px; }
[class^='row'].margin-0 > [class^='col-'],
[class^='row'].margin-0 > [class*=' col-'],
[class*=' row'].margin-0 > [class^='col-'],
[class*=' row'].margin-0 > [class*=' col-'],
[class^='form-group'].margin-0 > [class^='col-'],
[class^='form-group'].margin-0 > [class*=' col-'],
[class*=' form-group'].margin-0 > [class^='col-'],
[class*=' form-group'].margin-0 > [class*=' col-'] {
padding-right: 0px;
padding-left: 0px; }
[class^='row'].margin-0 [class^='row'],
[class^='row'].margin-0 [class*=' row'],
[class^='row'].margin-0 [class^='form-group'],
[class^='row'].margin-0 [class*=' form-group'],
[class*=' row'].margin-0 [class^='row'],
[class*=' row'].margin-0 [class*=' row'],
[class*=' row'].margin-0 [class^='form-group'],
[class*=' row'].margin-0 [class*=' form-group'],
[class^='form-group'].margin-0 [class^='row'],
[class^='form-group'].margin-0 [class*=' row'],
[class^='form-group'].margin-0 [class^='form-group'],
[class^='form-group'].margin-0 [class*=' form-group'],
[class*=' form-group'].margin-0 [class^='row'],
[class*=' form-group'].margin-0 [class*=' row'],
[class*=' form-group'].margin-0 [class^='form-group'],
[class*=' form-group'].margin-0 [class*=' form-group'] {
margin-left: 0;
margin-right: 0; }