| Current File : /var/www/vinorea/modules/tvcmsnewsletterpopup/mails/en/fieldnewsletter_voucher.html |
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title>Message from {shop_name}</title>
<style>
@media only screen and (max-width: 300px) {
body {
width: 218px !important;
margin: auto !important;
}
.table {
width: 195px !important;
margin: auto !important;
}
.logo,
.titleblock,
.linkbelow,
.box,
.footer,
.space_footer {
width: auto !important;
display: block !important;
}
span.title {
font-size: 20px !important;
line-height: 23px !important
}
span.subtitle {
font-size: 14px !important;
line-height: 18px !important;
padding-top: 10px !important;
display: block !important;
}
td.box p {
font-size: 12px !important;
font-weight: bold !important;
}
.table-recap table,
.table-recap thead,
.table-recap tbody,
.table-recap th,
.table-recap td,
.table-recap tr {
display: block !important;
}
.table-recap {
width: 200px!important;
}
.table-recap tr td,
.conf_body td {
text-align: center !important;
}
.address {
display: block !important;
margin-bottom: 10px !important;
}
.space_address {
display: none !important;
}
}
@media only screen and (min-width: 301px) and (max-width: 500px) {
body {
width: 308px!important;
margin: auto!important;
}
.table {
width: 285px!important;
margin: auto!important;
}
.logo,
.titleblock,
.linkbelow,
.box,
.footer,
.space_footer {
width: auto!important;
display: block!important;
}
.table-recap table,
.table-recap thead,
.table-recap tbody,
.table-recap th,
.table-recap td,
.table-recap tr {
display: block !important;
}
.table-recap {
width: 293px !important;
}
.table-recap tr td,
.conf_body td {
text-align: center !important;
}
}
@media only screen and (min-width: 501px) and (max-width: 768px) {
body {
width: 478px!important;
margin: auto!important;
}
.table {
width: 450px!important;
margin: auto!important;
}
.logo,
.titleblock,
.linkbelow,
.box,
.footer,
.space_footer {
width: auto!important;
display: block!important;
}
}
@media only screen and (max-device-width: 480px) {
body {
width: 308px!important;
margin: auto!important;
}
.table {
width: 285px;
margin: auto!important;
}
.logo,
.titleblock,
.linkbelow,
.box,
.footer,
.space_footer {
width: auto!important;
display: block!important;
}
.table-recap {
width: 285px!important;
}
.table-recap tr td,
.conf_body td {
text-align: center!important;
}
.address {
display: block !important;
margin-bottom: 10px !important;
}
.space_address {
display: none !important;
}
}
</style>
</head>
<body style="-webkit-text-size-adjust:none;background-color:#fff;width:650px;font-family:Open-sans, sans-serif;color:#555454;font-size:13px;line-height:18px;margin:auto">
<table class="table table-mail" style="width:100%;margin-top:10px;-moz-box-shadow:0 0 5px #afafaf;-webkit-box-shadow:0 0 5px #afafaf;-o-box-shadow:0 0 5px #afafaf;box-shadow:0 0 5px #afafaf;filter:progid:DXImageTransform.Microsoft.Shadow(color=#afafaf,Direction=134,Strength=5)">
<tr>
<td class="space" style="width:20px;padding:7px 0"> </td>
<td align="center" style="padding:7px 0">
<table class="table" bgcolor="#ffffff" style="width:100%">
<tr>
<td align="center" class="logo" style="border-bottom:4px solid #333333;padding:7px 0">
<a title="{shop_name}" href="{shop_url}" style="color:#337ff1">
<img src="{shop_logo}" alt="{shop_name}" />
</a>
</td>
</tr>
<tr>
<td align="center" class="titleblock" style="padding:7px 0">
<font size="2" face="Open-sans, sans-serif" color="#555454">
<span class="title" style="font-weight:500;font-size:28px;text-transform:uppercase;line-height:33px">Hi,</span>
</font>
</td>
</tr>
<tr>
<td class="space_footer" style="padding:0!important"> </td>
</tr>
<tr>
<td class="box" style="border:1px solid #D6D4D4;background-color:#f8f8f8;padding:7px 0">
<table class="table" style="width:100%">
<tr>
<td width="10" style="padding:7px 0"> </td>
<td style="padding:7px 0">
<font size="2" face="Open-sans, sans-serif" color="#555454">
<p data-html-only="1" style="border-bottom:1px solid #D6D4D4;margin:3px 0 7px;text-transform:uppercase;font-weight:500;font-size:18px;padding-bottom:10px">
Newsletter subscription </p>
<span style="color:#777">
Regarding your newsletter subscription, we are pleased to offer you the following voucher: <span style="color:#333"><strong>{discount}</strong></span>
</span>
</font>
</td>
<td width="10" style="padding:7px 0"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="space_footer" style="padding:0!important"> </td>
</tr>
<tr>
<td class="footer" style="border-top:4px solid #333333;padding:7px 0">
<span><a href="{shop_url}" style="color:#337ff1">{shop_name}</a> powered by <a href="http://www.prestashop.com/" style="color:#337ff1">PrestaShop™</a></span>
</td>
</tr>
</table>
</td>
<td class="space" style="width:20px;padding:7px 0"> </td>
</tr>
</table>
</body>
</html>