1{% extends '@MailThemes/modern/components/layout.html.twig' %}
2
3{% block title %}{{ 'Contact'|trans({}, 'Emails.Body', locale) }}{% endblock %}
4
5{% block content %}
6<!--[if mso | IE]>
7                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
8
9            <tr>
10              <td
11                 class="" width="604px"
12              >
13
14      <table
15         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:604px;" width="604"
16      >
17        <tr>
18          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
19      <![endif]-->
20              <div style="margin:0px auto;max-width:604px;">
21                <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
22                  <tbody>
23                    <tr>
24                      <td style="direction:ltr;font-size:0px;padding:0 25px;text-align:center;">
25                        <!--[if mso | IE]>
26                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
27
28        <tr>
29
30            <td
31               class="" style="vertical-align:top;width:554px;"
32            >
33          <![endif]-->
34                        <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
35                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
36                            <tbody>
37                              <tr>
38                                <td style="vertical-align:top;padding:0;">
39                                  <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
40                                    <!-- TITLE BEGINING -->
41                                    <tr>
42                                      <td align="left" style="font-size:0px;padding:10px 25px;padding-top:0;padding-bottom:20px;word-break:break-word;">
43                                        <div style="font-family:Open sans, arial, sans-serif;font-size:20px;font-weight:600;line-height:25px;text-align:left;color:#363A41;">{{ 'Message from a {shop_name} customer'|trans({}, 'Emails.Body', locale) }}</div>
44                                      </td>
45                                    </tr>
46                                    <!-- TITLE ENDING -->
47                                  </table>
48                                </td>
49                              </tr>
50                            </tbody>
51                          </table>
52                        </div>
53                        <!--[if mso | IE]>
54            </td>
55
56        </tr>
57
58                  </table>
59                <![endif]-->
60                      </td>
61                    </tr>
62                  </tbody>
63                </table>
64              </div>
65              <!--[if mso | IE]>
66          </td>
67        </tr>
68      </table>
69
70              </td>
71            </tr>
72          <![endif]-->
73              <!-- BORDER BEGINING -->
74              <!--[if mso | IE]>
75            <tr>
76              <td
77                 class="" width="604px"
78              >
79
80      <table
81         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:604px;" width="604"
82      >
83        <tr>
84          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
85      <![endif]-->
86              <div style="margin:0px auto;max-width:604px;">
87                <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
88                  <tbody>
89                    <tr>
90                      <td style="direction:ltr;font-size:0px;padding:0 50px 40px;text-align:left;">
91                        <!--[if mso | IE]>
92                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
93
94        <tr>
95
96            <td
97               class="" style="vertical-align:top;width:25px;"
98            >
99          <![endif]-->
100                        <div class="mj-column-px-25 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
101                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%">
102                            <tr>
103                              <td class="left" style="font-size:0px;padding:10px 25px;padding-top:0;padding-right:0;padding-left:0;word-break:break-word;">
104                                <p style="border-top:solid 3px #505050;font-size:1px;margin:0px auto;width:25px;">
105                                </p>
106                                <!--[if mso | IE]>
107        <table
108           align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 3px #505050;font-size:1px;margin:0px auto;width:25px;" role="presentation" width="25px"
109        >
110          <tr>
111            <td style="height:0;line-height:0;">
112              &nbsp;
113            </td>
114          </tr>
115        </table>
116      <![endif]-->
117                              </td>
118                            </tr>
119                          </table>
120                        </div>
121                        <!--[if mso | IE]>
122            </td>
123
124        </tr>
125
126                  </table>
127                <![endif]-->
128                      </td>
129                    </tr>
130                  </tbody>
131                </table>
132              </div>
133              <!--[if mso | IE]>
134          </td>
135        </tr>
136      </table>
137
138              </td>
139            </tr>
140          <![endif]-->
141              <!-- BORDER ENDING -->
142              <!-- MESSAGE BOX BEGINING -->
143              <!--[if mso | IE]>
144            <tr>
145              <td
146                 class="" width="604px"
147              >
148
149      <table
150         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:604px;" width="604"
151      >
152        <tr>
153          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
154      <![endif]-->
155              <div style="margin:0px auto;max-width:604px;">
156                <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
157                  <tbody>
158                    <tr>
159                      <td style="direction:ltr;font-size:0px;padding:15px 50px 40px;text-align:center;">
160                        <!--[if mso | IE]>
161                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
162
163        <tr>
164
165            <td
166               class="" style="vertical-align:top;width:504px;"
167            >
168          <![endif]-->
169                        <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
170                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
171                            <tbody>
172                              <tr>
173                                <td style="background-color:#fefefe;border:1px solid #DFDFDF;vertical-align:top;padding:20px 0;">
174                                  <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
175                                    <tr>
176                                      <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
177                                        <div style="font-family:Open sans, arial, sans-serif;font-size:16px;line-height:25px;text-align:left;color:#363A41;"><span class="label">{{ 'Customer Email Address:'|trans({}, 'Emails.Body', locale)|raw }}</span> <span style="color:#25B9D7;font-weight:600; text-decoration: underline;">{email}</span></div>
178                                      </td>
179                                    </tr>
180                                    <tr>
181                                      <td align="left" style="font-size:0px;padding:10px 25px;padding-top:0px;word-break:break-word;">
182                                        <div style="font-family:Open sans, arial, sans-serif;font-size:16px;line-height:25px;text-align:left;color:#363A41;"><span class="label">{{ 'Order ID #:'|trans({}, 'Emails.Body', locale)|raw }}</span>
183                                          <span> {order_name}</span></div>
184                                      </td>
185                                    </tr>
186                                    <tr>
187                                      <td align="left" style="font-size:0px;padding:10px 25px;padding-top:0px;word-break:break-word;">
188                                        <div style="font-family:Open sans, arial, sans-serif;font-size:16px;line-height:25px;text-align:left;color:#363A41;"><span class="label">{{ 'Attached file:'|trans({}, 'Emails.Body', locale)|raw }}</span><span> {attached_file}</span></div>
189                                      </td>
190                                    </tr>
191                                  </table>
192                                </td>
193                              </tr>
194                            </tbody>
195                          </table>
196                        </div>
197                        <!--[if mso | IE]>
198            </td>
199
200        </tr>
201
202                  </table>
203                <![endif]-->
204                      </td>
205                    </tr>
206                  </tbody>
207                </table>
208              </div>
209              <!--[if mso | IE]>
210          </td>
211        </tr>
212      </table>
213
214              </td>
215            </tr>
216          <![endif]-->
217              <!-- MESSAGE BOX ENDING -->
218              <!-- SUBTITLE BEGINING -->
219              <!--[if mso | IE]>
220            <tr>
221              <td
222                 class="" width="604px"
223              >
224
225      <table
226         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:604px;" width="604"
227      >
228        <tr>
229          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
230      <![endif]-->
231              <div style="margin:0px auto;max-width:604px;">
232                <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
233                  <tbody>
234                    <tr>
235                      <td style="direction:ltr;font-size:0px;padding:0 50px 0;text-align:left;">
236                        <!--[if mso | IE]>
237                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
238
239        <tr>
240
241            <td
242               class="" style="vertical-align:top;width:504px;"
243            >
244          <![endif]-->
245                        <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
246                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
247                            <tbody>
248                              <tr>
249                                <td style="vertical-align:top;padding:0;">
250                                  <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
251                                    <tr>
252                                      <td align="left" style="font-size:0px;padding:0;word-break:break-word;">
253                                        <div style="font-family:Open sans, arial, sans-serif;font-size:16px;font-weight:600;line-height:25px;text-align:left;color:#363A41;">{{ 'Customer message:'|trans({}, 'Emails.Body', locale)|raw }}</div>
254                                      </td>
255                                    </tr>
256                                  </table>
257                                </td>
258                              </tr>
259                            </tbody>
260                          </table>
261                        </div>
262                        <!--[if mso | IE]>
263            </td>
264
265        </tr>
266
267                  </table>
268                <![endif]-->
269                      </td>
270                    </tr>
271                  </tbody>
272                </table>
273              </div>
274              <!--[if mso | IE]>
275          </td>
276        </tr>
277      </table>
278
279              </td>
280            </tr>
281          <![endif]-->
282              <!-- SUBTITLE ENDING -->
283              <!-- MESSAGE BEGINING -->
284              <!--[if mso | IE]>
285            <tr>
286              <td
287                 class="" width="604px"
288              >
289
290      <table
291         align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:604px;" width="604"
292      >
293        <tr>
294          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
295      <![endif]-->
296              <div style="margin:0px auto;max-width:604px;">
297                <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;">
298                  <tbody>
299                    <tr>
300                      <td style="direction:ltr;font-size:0px;padding:15px 50px 40px;text-align:center;">
301                        <!--[if mso | IE]>
302                  <table role="presentation" border="0" cellpadding="0" cellspacing="0">
303
304        <tr>
305
306            <td
307               class="" style="vertical-align:top;width:504px;"
308            >
309          <![endif]-->
310                        <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
311                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
312                            <tbody>
313                              <tr>
314                                <td style="background-color:#f3f3f3;vertical-align:top;padding-top:10px;padding-bottom:10px;">
315                                  <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="" width="100%">
316                                    <tr>
317                                      <td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;">
318                                        <div style="font-family:Open sans, arial, sans-serif;font-size:16px;line-height:25px;text-align:left;color:#363A41;">{message}</div>
319                                      </td>
320                                    </tr>
321                                  </table>
322                                </td>
323                              </tr>
324                            </tbody>
325                          </table>
326                        </div>
327                        <!--[if mso | IE]>
328            </td>
329
330        </tr>
331
332                  </table>
333                <![endif]-->
334                      </td>
335                    </tr>
336                  </tbody>
337                </table>
338              </div>
339              <!--[if mso | IE]>
340          </td>
341        </tr>
342      </table>
343
344              </td>
345            </tr>
346          <![endif]-->
347              <!-- MESSAGE ENDING -->
348              <!--[if mso | IE]>
349                  </table>
350                <![endif]-->
351
352{% endblock %}
353
354{% block styles %}
355{{ parent() }}
356<style type="text/css">
357    #outlook a {
358      padding: 0;
359    }
360
361    body {
362      margin: 0;
363      padding: 0;
364      -webkit-text-size-adjust: 100%;
365      -ms-text-size-adjust: 100%;
366    }
367
368    table,
369    td {
370      border-collapse: collapse;
371      mso-table-lspace: 0pt;
372      mso-table-rspace: 0pt;
373    }
374
375    img {
376      border: 0;
377      height: auto;
378      line-height: 100%;
379      outline: none;
380      text-decoration: none;
381      -ms-interpolation-mode: bicubic;
382    }
383
384    p {
385      display: block;
386      margin: 13px 0;
387    }
388  </style><style type="text/css">
389    @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700);
390    @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i);
391  </style><style type="text/css">
392    @media only screen and (min-width:480px) {
393      .mj-column-per-100 {
394        width: 100% !important;
395        max-width: 100%;
396      }
397
398      .mj-column-px-25 {
399        width: 25px !important;
400        max-width: 25px;
401      }
402    }
403  </style><style type="text/css">
404  </style><style type="text/css">
405    .shadow {
406      box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.1);
407    }
408
409    .label {
410      font-weight: 700;
411    }
412
413    .warning {
414      font-weight: 700;
415      font-size: 16px;
416    }
417
418    a {
419      color: #25B9D7;
420      text-decoration: underline;
421      font-weight: 600;
422    }
423
424    a.light {
425      font-weight: 400;
426    }
427
428    span.strong {
429      font-weight: 600;
430    }
431
432    @media only screen and (max-width: 480px) {
433
434      body,
435      .no-bg {
436        background-color: #fff !important;
437      }
438
439      .left p {
440        text-align: left;
441        display: inline-block
442      }
443    }
444  </style>
445
446{% endblock %}
447