Email - Coletar respostas rápidas
Coletar respostas rápidas
Caso a sua campanha precise coletar respostas rápidas do seu usuario para um email enviado, adicione o evento de resposta a um click do conteúdo do email.
Para escolher uma resposta personalizada para sua campanha altere apenas a resposta "Sua Resposta Aqui"
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=SuaRespostaAqui&redirectUrl=https://vya.digital"
O parametro "redirectUrl" após a captura da informações irá redirecionar o contato para a url informada.
Podendo coletar respostas como:
- Interesse de produto
- NPS
- Curtiu / Não Curtiu
- Solicitação de reunião
- Solicitação de apresentação
Exemplo 1:
<table cellpadding="0" cellspacing="0" class="stylingblock-content-wrapper" role="presentation"
style="background-color: #FFFFFF; min-width: 100%; " width="100%">
<tbody>
<tr>
<td class="stylingblock-content-wrapper camarker-inner" style="padding: 0px 0px 48px 0px;">
<table border="0" cellpadding="0" cellspacing="0" role="presentation"
style="border-collapse: collapse; border-spacing: 0;" width="100%">
<tbody>
<tr>
<td class="mobile-24"
style="padding-left: 48px; padding-right: 48px; padding-top: 24px; padding-bottom: 0px;">
<table border="0" cellpadding="0" cellspacing="0" role="presentation"
style="border-collapse: collapse; border-spacing: 0;" width="100%">
<tbody>
<tr>
<td align="center" style="padding-bottom: 16px;">
<p class="fm18" role="heading"
style="font-family: Arial, sans-serif; font-size: 20px; line-height: 26px; margin: 0px; text-align: center;">
<span style="color:#004381;"><strong>Diz para a gente:</strong>
</span>
</p>
<p class="fm16" role="heading"
style="font-family: Arial, sans-serif; font-size: 18px; line-height: 25px; margin: 8px 0px 0px 0px; text-align: center;">
O conteúdo deste e-mail foi útil para você?</p>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" role="presentation"
style="border-collapse: collapse; border-spacing: 0;" width="100%">
<tbody>
<tr>
<td style="padding-right: 12px;" valign="top" width="42.02%">
<table align="right" border="0" cellpadding="0" cellspacing="0"
role="presentation"
style="border-collapse: collapse; border-spacing: 0;">
<tbody>
<tr>
<td align="center">
<a data-linkto="other"
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=Curtiu"
style="border: 0;" title="sim"><img alt=""
height="49"
src="https://vya.digital/Journey_Images/like_icon_azul.png"
style="max-width: 143px; height: 49px; display: block; padding: 0px; width: 143px; text-align: center;"
width="143"></a>
</td>
</tr>
</tbody>
</table>
</td>
<td class="hideThis" width="15.94%">
</td>
<td style="padding-left: 12px;" valign="top" width="42.02%">
<table align="left" border="0" cellpadding="0" cellspacing="0"
role="presentation"
style="border-collapse: collapse; border-spacing: 0;">
<tbody>
<tr>
<td align="center">
<a data-linkto="other"
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=NaoCurtiu"
style="border: 0;" title="não muito"><img alt=""
src="https://vya.digital/Journey_Images/deslike_icon_azul.png"
style="max-width: 143px; height: auto; display: block; padding: 0px; text-align: center; width: 100%;"
width="143"></a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>Exemplo 2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width">
<style type="text/css">
.npsnumber {
color: #ffffff !important;
font-weight: bold !important;
text-align: center !important;
width: 30px;
}
.npsnumber a {
display: block;
height: 100%;
width: 100%;
color: #ffffff !important;
font-weight: bold !important;
text-align: center !important;
}
.npsnumber a:hover {
display: block;
height: 100%;
width: 100%;
color: #fff !important;
font-weight: bold !important;
text-align: center !important;
}
.panel {
background: #72C120;
border: 2px solid #ffffff;
padding: 5px !important;
}
.sub-grid table {
width: 100%;
}
.sub-grid td.sub-columns {
padding-bottom: 0;
}
#outlook a {
padding: 0;
}
body {
width: 100% !important;
min-width: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
margin: 0;
padding: 0;
}
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
#backgroundTable {
margin: 0;
padding: 0;
width: 100% !important;
line-height: 100% !important;
}
img {
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
width: auto;
max-width: 100%;
float: left;
clear: both;
display: block;
}
center {
width: 100%;
min-width: 580px;
}
a img {
border: none;
}
p {
margin: 0 0 0 10px;
}
table {
border-spacing: 0;
border-collapse: collapse;
}
td {
word-break: break-word;
-webkit-hyphens: auto;
-moz-hyphens: auto;
hyphens: auto;
border-collapse: collapse !important;
}
table,
tr,
td {
padding: 0;
vertical-align: top;
text-align: left;
}
hr {
color: #d9d9d9;
background-color: #d9d9d9;
height: 1px;
border: none;
}
table.body {
height: 100%;
width: 100%;
}
table.container {
width: 580px;
margin: 0 auto;
text-align: inherit;
}
table.row {
padding: 0px;
width: 100%;
position: relative;
}
table.container table.row {
display: block;
}
td.wrapper {
padding: 10px 20px 0px 0px;
position: relative;
}
table.columns,
table.column {
margin: 0 auto;
}
table.columns td,
table.column td {
padding: 0px 0px 10px;
}
table.columns td.sub-columns,
table.column td.sub-columns,
table.columns td.sub-column,
table.column td.sub-column {
padding-right: 10px;
}
td.sub-column,
td.sub-columns {
min-width: 0px;
}
table.row td.last,
table.container td.last {
padding-right: 0px;
}
table.one {
width: 30px;
}
table.two {
width: 80px;
}
table.three {
width: 130px;
}
table.four {
width: 180px;
}
table.five {
width: 230px;
}
table.six {
width: 280px;
}
table.seven {
width: 330px;
}
table.eight {
width: 380px;
}
table.nine {
width: 430px;
}
table.ten {
width: 480px;
}
table.eleven {
width: 530px;
}
table.twelve {
width: 580px;
}
table.one center {
min-width: 30px;
}
table.two center {
min-width: 80px;
}
table.three center {
min-width: 130px;
}
table.four center {
min-width: 180px;
}
table.five center {
min-width: 230px;
}
table.six center {
min-width: 280px;
}
table.seven center {
min-width: 330px;
}
table.eight center {
min-width: 380px;
}
table.nine center {
min-width: 430px;
}
table.ten center {
min-width: 480px;
}
table.eleven center {
min-width: 530px;
}
table.twelve center {
min-width: 580px;
}
table.one .panel center {
min-width: 10px;
}
table.two .panel center {
min-width: 60px;
}
table.three .panel center {
min-width: 110px;
}
table.four .panel center {
min-width: 160px;
}
table.five .panel center {
min-width: 210px;
}
table.six .panel center {
min-width: 260px;
}
table.seven .panel center {
min-width: 310px;
}
table.eight .panel center {
min-width: 360px;
}
table.nine .panel center {
min-width: 410px;
}
table.ten .panel center {
min-width: 460px;
}
table.eleven .panel center {
min-width: 510px;
}
table.twelve .panel center {
min-width: 560px;
}
.body .columns td.one,
.body .column td.one {
width: 8.333333%;
}
.body .columns td.two,
.body .column td.two {
width: 16.666666%;
}
.body .columns td.three,
.body .column td.three {
width: 25%;
}
.body .columns td.four,
.body .column td.four {
width: 33.333333%;
}
.body .columns td.five,
.body .column td.five {
width: 41.666666%;
}
.body .columns td.six,
.body .column td.six {
width: 50%;
}
.body .columns td.seven,
.body .column td.seven {
width: 58.333333%;
}
.body .columns td.eight,
.body .column td.eight {
width: 66.666666%;
}
.body .columns td.nine,
.body .column td.nine {
width: 75%;
}
.body .columns td.ten,
.body .column td.ten {
width: 83.333333%;
}
.body .columns td.eleven,
.body .column td.eleven {
width: 91.666666%;
}
.body .columns td.twelve,
.body .column td.twelve {
width: 100%;
}
td.offset-by-one {
padding-left: 50px;
}
td.offset-by-two {
padding-left: 100px;
}
td.offset-by-three {
padding-left: 150px;
}
td.offset-by-four {
padding-left: 200px;
}
td.offset-by-five {
padding-left: 250px;
}
td.offset-by-six {
padding-left: 300px;
}
td.offset-by-seven {
padding-left: 350px;
}
td.offset-by-eight {
padding-left: 400px;
}
td.offset-by-nine {
padding-left: 450px;
}
td.offset-by-ten {
padding-left: 500px;
}
td.offset-by-eleven {
padding-left: 550px;
}
td.expander {
visibility: hidden;
width: 0px;
padding: 0 !important;
}
table.columns .text-pad,
table.column .text-pad {
padding-left: 10px;
padding-right: 10px;
}
table.columns .left-text-pad,
table.columns .text-pad-left,
table.column .left-text-pad,
table.column .text-pad-left {
padding-left: 10px;
}
table.columns .right-text-pad,
table.columns .text-pad-right,
table.column .right-text-pad,
table.column .text-pad-right {
padding-right: 10px;
}
.block-grid {
width: 100%;
max-width: 580px;
}
.block-grid td {
display: inline-block;
padding: 10px;
}
.two-up td {
width: 270px;
}
.three-up td {
width: 173px;
}
.four-up td {
width: 125px;
}
.five-up td {
width: 96px;
}
.six-up td {
width: 76px;
}
.seven-up td {
width: 62px;
}
.eight-up td {
width: 52px;
}
table.center,
td.center {
text-align: center;
}
h1.center,
h2.center,
h3.center,
h4.center,
h5.center,
h6.center {
text-align: center;
}
span.center {
display: block;
width: 100%;
text-align: center;
}
img.center {
margin: 0 auto;
float: none;
}
.show-for-small,
.hide-for-desktop {
display: none;
}
body,
table.body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
td {
color: #222222;
font-family: "Helvetica", "Arial", sans-serif;
font-weight: normal;
padding: 0;
margin: 0;
text-align: left;
line-height: 1.3;
}
h1,
h2,
h3,
h4,
h5,
h6 {
word-break: normal;
}
h1 {
font-size: 40px;
}
h2 {
font-size: 36px;
}
h3 {
font-size: 32px;
}
h4 {
font-size: 28px;
}
h5 {
font-size: 24px;
}
h6 {
font-size: 20px;
}
body,
table.body,
p,
td {
font-size: 14px;
line-height: 19px;
}
p.lead,
p.lede,
p.leed {
font-size: 18px;
line-height: 21px;
text-align: center;
color: #535D67 !important;
margin-bottom: 20px;
}
p {
margin-bottom: 10px;
}
small {
font-size: 10px;
}
a {
color: #A3ACB6;
text-decoration: none;
}
a:hover {
color: #72C120 !important;
}
a:active {
color: #72C120 !important;
}
a:visited {
color: #ffffff !important;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
color: #2ba6cb;
}
h1 a:active,
h2 a:active,
h3 a:active,
h4 a:active,
h5 a:active,
h6 a:active {
color: #2ba6cb !important;
}
h1 a:visited,
h2 a:visited,
h3 a:visited,
h4 a:visited,
h5 a:visited,
h6 a:visited {
color: #2ba6cb !important;
}
table.button,
table.tiny-button,
table.small-button,
table.medium-button,
table.large-button {
width: 100%;
overflow: hidden;
}
table.button td,
table.tiny-button td,
table.small-button td,
table.medium-button td,
table.large-button td {
display: block;
width: auto !important;
text-align: center;
background: #2ba6cb;
border: 1px solid #2284a1;
color: #ffffff;
padding: 8px 0;
}
table.tiny-button td {
padding: 5px 0 4px;
}
table.small-button td {
padding: 8px 0 7px;
}
table.medium-button td {
padding: 12px 0 10px;
}
table.large-button td {
padding: 21px 0 18px;
}
table.button td a,
table.tiny-button td a,
table.small-button td a,
table.medium-button td a,
table.large-button td a {
font-weight: bold;
text-decoration: none;
font-family: Helvetica, Arial, sans-serif;
color: #ffffff;
font-size: 16px;
}
table.tiny-button td a {
font-size: 12px;
font-weight: normal;
}
table.small-button td a {
font-size: 16px;
}
table.medium-button td a {
font-size: 20px;
}
table.large-button td a {
font-size: 24px;
}
table.button:hover td,
table.button:visited td,
table.button:active td {
background: #2795b6 !important;
}
table.button:hover td a,
table.button:visited td a,
table.button:active td a {
color: #fff !important;
}
table.button:hover td,
table.tiny-button:hover td,
table.small-button:hover td,
table.medium-button:hover td,
table.large-button:hover td {
background: #2795b6 !important;
}
table.button:hover td a,
table.button:active td a,
table.button td a:visited,
table.tiny-button:hover td a,
table.tiny-button:active td a,
table.tiny-button td a:visited,
table.small-button:hover td a,
table.small-button:active td a,
table.small-button td a:visited,
table.medium-button:hover td a,
table.medium-button:active td a,
table.medium-button td a:visited,
table.large-button:hover td a,
table.large-button:active td a,
table.large-button td a:visited {
color: #ffffff !important;
}
table.secondary td {
background: #e9e9e9;
border-color: #d0d0d0;
color: #555;
}
table.secondary td a {
color: #555;
}
table.secondary:hover td {
background: #d0d0d0 !important;
color: #555;
}
table.secondary:hover td a,
table.secondary td a:visited,
table.secondary:active td a {
color: #555 !important;
}
table.success td {
background: #5da423;
border-color: #457a1a;
}
table.success:hover td {
background: #457a1a !important;
}
table.alert td {
background: #c60f13;
border-color: #970b0e;
}
table.alert:hover td {
background: #970b0e !important;
}
table.radius td {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
table.round td {
-webkit-border-radius: 500px;
-moz-border-radius: 500px;
border-radius: 500px;
}
body.outlook p {
display: inline !important;
}
@media only screen and (max-width: 600px) {
table[class=body] img {
width: auto !important;
height: auto !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] center {
min-width: 0 !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .container {
width: 95% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .row {
width: 100% !important;
display: block !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .wrapper {
display: block !important;
padding-right: 0 !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns,
table[class=body] .column {
table-layout: fixed !important;
float: none !important;
width: 100% !important;
padding-right: 0px !important;
padding-left: 0px !important;
display: block !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .wrapper.first .columns,
table[class=body] .wrapper.first .column {
display: table !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] table.columns td,
table[class=body] table.column td {
width: 100% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.one,
table[class=body] .column td.one {
width: 8.333333% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.two,
table[class=body] .column td.two {
width: 16.666666% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.three,
table[class=body] .column td.three {
width: 25% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.four,
table[class=body] .column td.four {
width: 33.333333% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.five,
table[class=body] .column td.five {
width: 41.666666% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.six,
table[class=body] .column td.six {
width: 50% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.seven,
table[class=body] .column td.seven {
width: 58.333333% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.eight,
table[class=body] .column td.eight {
width: 66.666666% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.nine,
table[class=body] .column td.nine {
width: 75% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.ten,
table[class=body] .column td.ten {
width: 83.333333% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.eleven,
table[class=body] .column td.eleven {
width: 91.666666% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .columns td.twelve,
table[class=body] .column td.twelve {
width: 100% !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] td.offset-by-one,
table[class=body] td.offset-by-two,
table[class=body] td.offset-by-three,
table[class=body] td.offset-by-four,
table[class=body] td.offset-by-five,
table[class=body] td.offset-by-six,
table[class=body] td.offset-by-seven,
table[class=body] td.offset-by-eight,
table[class=body] td.offset-by-nine,
table[class=body] td.offset-by-ten,
table[class=body] td.offset-by-eleven {
padding-left: 0 !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] table.columns td.expander {
width: 1px !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .right-text-pad,
table[class=body] .text-pad-right {
padding-left: 10px !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .left-text-pad,
table[class=body] .text-pad-left {
padding-right: 10px !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .hide-for-small,
table[class=body] .show-for-desktop {
display: none !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .show-for-small,
table[class=body] .hide-for-desktop {
display: inherit !important;
}
}
table.facebook td {
background: #3b5998;
border-color: #2d4473;
}
table.facebook:hover td {
background: #2d4473 !important;
}
table.twitter td {
background: #00acee;
border-color: #0087bb;
}
table.twitter:hover td {
background: #0087bb !important;
}
table.google-plus td {
background-color: #DB4A39;
border-color: #CC0000;
}
table.google-plus:hover td {
background: #CC0000 !important;
}
.template-label {
color: #ffffff;
font-weight: lighter;
font-size: 18px;
}
.callout .wrapper {
padding-bottom: 20px;
}
.callout .panel {
background: #ECF8FF;
border-color: #b9e5ff;
}
.header {
background: #535D67;
}
.footer .wrapper {
background: #ebebeb;
}
.footer h5 {
padding-bottom: 10px;
}
table.columns .text-pad {
padding-left: 10px;
padding-right: 10px;
}
table.columns .left-text-pad {
padding-left: 10px;
}
table.columns .right-text-pad {
padding-right: 10px;
}
@media only screen and (max-width: 600px) {
table[class=body] .right-text-pad {
padding-left: 10px !important;
}
}
@media only screen and (max-width: 600px) {
table[class=body] .left-text-pad {
padding-right: 10px !important;
}
}
</style>
</head>
<body>
<table class="body">
<tr>
<td class="center" align="center" valign="top">
<center>
<table class="container" style="margin-top:40px; margin-bottom:50px;">
<tr>
<td>
<table class="row">
<tr>
<td class="wrapper last">
<table class="twelve columns">
<tr>
<td>
<p class="lead" align="center">Qual é a probabilidade de você
recomendar o “produto” a um amigo ou colega?</p>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
<table class="container" style="margin-bottom:10px;">
<tr>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=1">1</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=2">2</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=3">3</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=4">4</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=5">5</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=6">6</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=7">7</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=8">8</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=9">9</a>
</td>
<td class="npsnumber panel"><a
href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=10">10</a>
</td>
</tr>
</table>
<table class="container" style="margin-bottom:60px;">
<tr>
<td class="six sub-columns" style="color:#535D67;">Não é provável</td>
<td class="six sub-columns" style="text-align:right; color:#535D67;">Muito
provavelmente 👌</td>
</tr>
</table>
<table class="row">
<tr>
<td class="wrapper last">
<table class="twelve columns">
<tr>
<td align="center">
<center>
<p style="text-align:center;"><a
href="https://vya.digital">Sobre Vya.Digital</a></p>
</center>
</td>
<td class="expander"></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- container end below -->
</td>
</tr>
</table>
</center>
</td>
</tr>
</table>
</body>
</html>Exemplo 3:
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office">
<!--NAVIGATION CODE
LOGO: 209
TOP BAR: 275
EMAIL CONTENT: 259
SIGNATURE: 296
FOOTER: 409
-->
<head>
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">
#outlook a {
padding: 0;
}
.ReadMsgBody {
width: 100%;
}
.ExternalClass {
width: 100%;
}
.ExternalClass * {
line-height: 100%;
}
body {
margin: 0;
padding: 0;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
table,
td {
border-collapse: collapse;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
img {
border: 0;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
h1 {
margin-top: 0;
margin-bottom: 14;
padding-top: 0;
padding-bottom: 0;
line-height: 1.1em;
}
p,
h2,
h3,
h4 {
margin-top: 0;
margin-bottom: 12;
padding-top: 0;
padding-bottom: 0;
}
ul,
ol,
{
margin-top: 14;
margin-bottom: 14;
font-weight: normal;
}
ul,
ol,
li {
margin-left: 20;
margin-right: 0;
padding-left: 20;
padding-right: 0;
}
ul,
ol {
margin-left: 20px;
}
ol,
ol,
li {
list-style-type: disc;
}
.arrow_box {
margin-top: -20px;
position: relative;
background: #ffffff;
border-top: 0px solid #ffffff;
}
.arrow_box:after,
.arrow_box:before {
top: 100%;
left: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.arrow_box:after {
margin-top: -1px;
border-color: rgba(255, 255, 255, 0);
border-top-color: #ffffff;
border-width: 13px 20px 0 20px;
margin-left: -20px;
}
.arrow_box:before {
border-color: rgba(232, 232, 232, 0);
border-top-color: #e8e8e8;
border-width: 13.5px 20.5px 0 20.5px;
margin-left: -20.3px;
}
a[href^="x-apple-data-detectors:"] {
color: inherit;
text-decoration: inherit;
}
</style>
<!--[if !mso]><!-->
<style type="text/css">
@media only screen and (max-width: 480px) {
@-ms-viewport {
width: 320px;
}
@viewport {
width: 320px;
}
.mobile-full-width {
width: 100% !important;
}
.mobile-hide {
display: none !important;
}
.mobile-padding {
padding-bottom: 30px;
}
}
</style>
<link href="https://fonts.googleapis.com/css?family=Hind:300,400,500,600,700 rel=stylesheet">
<link href="https://fonts.googleapis.com/css?family=Hind+Siliguri:400,300,500,600,700" rel="stylesheet"
type="text/css">
<link href="http://fonts.googleapis.com/css?family=Montserrat:400,500,300,600,700" rel="stylesheet" type="text/css">
</style>
<style type="text/css">
@media only screen and (min-width: 480px) {
.mj-column-per-100 {
width: 100% !important;
}
.mj-column-per-48 {
width: 48.5% !important;
}
.mj-column-per-3 {
width: 3% !important;
}
.mj-column-per-80 {
width: 80% !important;
}
.mj-column-per-19 {
width: 19% !important;
}
}
</style>
</head>
<body style="background-color: rgb(250, 250, 250);" class="" bgcolor="#fafafa">
<table role="presentation" style="background: #fff; font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0">
<tbody>
<tr>
<td>
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation" style="font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0" align="center">
<tbody>
<tr>
<td
style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 0px;">
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
<table role="presentation" style="background: #c6c6c6; font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0">
<tbody>
<tr>
<td>
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation" style="font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0" align="center">
<tbody>
<tr>
<td
style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 20px 0px; padding-bottom: 1px; padding-top: 0px;">
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
<!----------- logo ----------->
<table role="presentation" style="background: #fafafa; font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0">
<tbody>
<tr>
<td data-nl-format="datetime">
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation" style="font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0" align="center">
<tbody>
<tr>
<td
style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 0px;">
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation" style="font-size: 0px; width: 100%;"
cellspacing="0" cellpadding="0" border="0" align="center">
<tbody>
<tr>
<td style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 0px 0px; padding-bottom: 15px; padding-top: 3%;"
data-nl-format="datetime">
<div class="mj-column-per-100 outlook-group-fix"
style="vertical-align: top; display: inline-block; direction: ltr; font-size: 13px; text-align: left; width: 100%;">
<table role="presentation" width="100%" cellspacing="0"
cellpadding="0" border="0">
<tbody>
<tr>
<td style="word-wrap: break-word; font-size: 0px; padding: 20px; "
align="center">
<table role="presentation"
style="border-collapse: collapse; border-spacing: 0px;"
cellspacing="0" cellpadding="0"
border="0" align="center">
<tbody>
<tr>
<td style="width: 230px;"><a
href="https://vya.digital"
target="_blank"><img
alt="Vya.Digital"
title="Vya.Digital"
src="https://vya.digital/Journey_Images/vyaLogoPositivo.png"
style="border: none; border-radius: 0px; display: block; font-size: 13px; outline: none; text-decoration: none; width: 190px;"
width="190"
height="" />
</a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<!----------- end logo ----------->
<table role="presentation" style="font-size: 0px; width: 100%;" cellspacing="0"
cellpadding="0" border="0">
<tbody>
<tr>
<td>
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation"
style="font-size: 0px; width: 100%;" cellspacing="0"
cellpadding="0" border="0" align="center">
<tbody>
<tr>
<td
style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 0px 0px 10px;">
<table role="presentation"
style="font-size: 0px; width: 100%;"
cellspacing="0" cellpadding="0"
border="0">
<tbody>
<tr>
<td>
<div
style="margin: 0px auto; max-width: 570px;">
<table
role="presentation"
style="font-size: 0px; width: 100%;"
cellspacing="0"
cellpadding="0"
border="0"
align="center">
<tbody>
<tr>
<td
style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 0px 0px 20px;">
<!----------- top bar ----------->
<div class="mj-column-per-100 outlook-group-fix"
style="vertical-align: top; display: inline-block; border-top: 9px solid #36A582; direction: ltr; font-size: 13px; text-align: left; width: 100%;">
<!----------- end top bar ----------->
<table
role="presentation"
style="background: #fff; border-left: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8"
width="100%"
cellspacing="0"
cellpadding="0"
border="0">
<tbody>
<tr>
<td style="word-wrap: break-word; font-size: 0px; padding: 0px;"
align="center">
<table
role="presentation"
style="border-collapse: collapse; border-spacing: 0px;"
cellspacing="0"
cellpadding="0"
border="0"
align="center">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
</tr>
<!----------- email content ----------->
<td style="word-wrap: break-word; font-size: 0px; padding: 5% 10% 6.5%;"
align="center"
data-nl-format="datetime">
<div
style="cursor: auto; color: #272727; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 24px; text-align: left; max-width: 550px; ">
<!-- body html -->
<table
cellpadding="0"
cellspacing="0"
style="font-family: 'Open Sans', sans-serif; font-weight: normal;width:100%;">
<tbody>
<tr>
<td align="center"
colspan="11"
style="font-family: 'Open Sans', sans-serif;">
<p style="text-align: center; font-size: 20px;"
align="center">
Qual
é
a
probabilidade
de
você
recomendar
a
<strong>Vya.Digital</strong>
a
um
amigo
ou
colega?
</p>
</td>
</tr>
<tr>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=0"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">0
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=1"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">1
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=2"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">2
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=3"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">3
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=4"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">4
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=5"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">5
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=6"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">6
</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=7"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">7</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=8"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">8</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=9"
style="border:1px solid #cccccc; border-radius:3px; font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">9</a>
</td>
</tr>
</tbody>
</table>
</td>
<td
style="width:9%;min-width:25px">
<table
cellpadding="0"
cellspacing="0"
style="width:90%">
<tbody>
<tr>
<td align="center"
bgcolor="#fff"
height="40"
style="display: block;text-align:center"
width="100%">
<a href="https://app.vya.digital/api/v2/answer/register?code={{externalId}}&answer=10"
style="border:1px solid #cccccc; border-radius:3px;font-weight: bold; font-family:sans-serif; text-decoration: none; line-height:40px; width:100%; min-width:25px; display:inline-block;color: #222222;mso-hide:all;">10</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="left"
colspan="6"
style="font-family: 'Open Sans', sans-serif; color:red; font-size:13px; padding-top:10px">
Não
é
nada
provável
</td>
<td align="right"
colspan="5"
style="font-family: 'Open Sans', sans-serif; color:#36A582; font-size:13px; padding-top:10px; padding-right:5px;">
Extremamente
provável
</td>
</tr>
</tbody>
</table>
<!-- body html -->
</div>
<div
style="cursor: auto; color: #272727; font-family: 'Open Sans', sans-serif; font-size: 15px; line-height: 24px; text-align: left; max-width: 550px;">
</td>
</tr>
<!----------- end email content ----------->
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
<div class="arrow_box"
style="vertical-align: top; display: inline-block; direction: ltr; font-size: 13px; text-align: left; width: 25px%;">
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
</tbody>
</table>
<table role="presentation"
style="mso-hide: all; background: url('') top center / cover no-repeat; font-size: 0px; width: 100%;"
cellspacing="0" cellpadding="0" border="0" background="https://vya.digital">
<tbody>
<tr>
<td>
<div style="margin: 0px auto; max-width: 570px;">
<table role="presentation" style="font-size: 0px; width: 100%;" cellspacing="0" cellpadding="0"
border="0" align="center">
<tbody>
<tr>
<td style="text-align: center; vertical-align: top; direction: ltr; font-size: 0px; padding: 10px 0px; padding-bottom: 45px; padding-top: 0px;"
data-nl-format="datetime"></td>
</tr>
</tbody>
</table>