Skip to content

Instantly share code, notes, and snippets.

@hteumeuleu

hteumeuleu/netflix-stranger-things-2.html

Created October 19, 2017 13:12
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save hteumeuleu/23a123240b7c1df144d6a13d531c60db to your computer and use it in GitHub Desktop.
Save hteumeuleu/23a123240b7c1df144d6a13d531c60db to your computer and use it in GitHub Desktop.
Download ZIP
Netflix Stranger Things 2 Email
Raw
netflix-stranger-things-2.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
@media yahoo
{
table
{
border-collapse: collapse;
mso-table-lspace:0pt;
mso-table-rspace:0pt;
table-layout: fixed;
}
table table
{
table-layout: auto;
}
}
body, .container
{
background-color: #000000;
}
img
{
-ms-interpolation-mode: bicubic;
border: none;
outline: none;
border-collapse: collapse;
}
.desktop-hide, .desktop-hide img
{
height: 0 !important;
width: 0 !important;
line-height: 0 !important;
font-size: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
@media (max-width: 480px)
{
.ios-hide
{
display: none;
}
}
a
{
color: inherit !important;
}
a img
{
border-style: none;
}
.copy a
{
font-weight:bold;
text-decoration: underline !important;
color: inherit !important;
}
/* Content */
body
{
font-family: Helvetica, Arial, sans;
color: #ffffff;
}
.content-shell, .shell
{
background-color: #ffffff;
}
.content-shell-footer, .shell-footer
{
background-color: #000000;
}
.caps
{
font-size: 12px;
line-height: 22px;
font-weight: bold;
}
.shadow-white
{
background-color: #ffffff;
}
@media (max-width: 449px)
{
.ios-hide-max
{
display: none;
}
.inbox-fix
{
display: none;
}
.shell, .shell-footer
{
width: 100% !important;
}
.container, body
{
padding: 0 !important;
margin: 0 !important;
}
}
@media (max-width: 480px)
{
.copy
{
padding-left: 26px !important;
padding-right: 26px !important;
}
}
/* Hero */
.hero-background
{
background: #000000 url('http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif') no-repeat center top;
background-size: 450px;
background-repeat: no-repeat;
}
.hero-content
{
min-height: 703px;
}
@media (max-width: 449px)
{
.hero, .hero-content
{
width: 100% !important;
}
.hero-background
{
background: #000000 url('http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif') no-repeat center top;
background-size: cover;
background-repeat: no-repeat;
background-position: center top !important;
width: 100%;
height: inherit;
max-height: 700px;
}
.hero-content
{
min-height: initial !important;
}
}
@media (max-width: 449px)
{
.hero-vertical-spacer
{
height: 50%;
}
.hero-text tr td
{
padding: 0 26px 0 26px !important;
width: 90% !important;
font-size: 22px !important;
line-height: 24px !important;
}
td.hero-button-shell
{
padding: 13px 0 26px 26px !important;
display: block;
vertical-align: bottom;
}
.hero-content
{
height: 350px !important;
}
.hero
{
min-height: 500px !important;
}
.hero-background
{
background: #000000 url('http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif') !important;
background-size: 100% !important;
background-repeat: no-repeat !important;
background-position: right top !important;
width: 100%;
height: inherit;
max-height: 400px;
box-shadow: inset 0px -96px 92px -16px rgba(0,0,0,0.75);
}
}
/* Footer */
.footer
{
font-family: Helvetica, Arial, sans;
color: #6e6e6e !important;
background-color: #000000;
border-color: #000000 !important;
}
.footer a
{
color: #6e6e6e !important;
}
html body span.iOSlinks
{
color: #6e6e6e !important;
text-decoration: underline;
}
html body .footer.questions
{
font-size: 14px;
line-height: 18px;
padding: 22px 44px 0 44px !important;
color: #6e6e6e !important;
background-color: #000000;
text-align: center !important;
}
.footer.footer-copy
{
font-size: 12px;
line-height: 18px;
padding: 10px 44px 0 44px;
color: #6e6e6e !important;
background-color: #000000;
}
.footer.footer-copyNp
{
font-size: 12px;
line-height: 18px;
padding: 0px 44px 0 44px;
color: #6e6e6e !important;
background-color: #000000;
}
@media (max-width: 480px)
{
.footer.questions
{
font-size: 12px;
line-height: 16px;
padding: 15px 26px 0 26px !important;
}
.footer.footer-copy
{
font-size: 10px;
line-height: 14px;
padding: 15px 26px 0 26px !important;
}
.footer
{
padding-bottom: 50px;
}
.footer.footer-copyNp
{
padding: 0px 26px 0 26px !important;
}
}
/* Flavor Text */
.flavor-text
{
font-size: 18px;
line-height: 24px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 20px 0 0 0;
font-weight: bold;
}
.flavor-text a
{
color: #ffffff;
}
/* Date Text */
.date-text
{
font-size: 20px;
line-height: 24px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
.date-text a
{
color: #ffffff;
}
/* Title Logo */
td.title-logo
{
-wings-align: center;
-wings-valign: bottom;
vertical-align: bottom !important;
padding: 450px 50px 0 50px;
}
@media (max-width: 449px)
{
td.title-logo
{
padding: 400px 25px 0 25px !important;
}
.title-logo img
{
max-width: 419px !important;
}
}
@media (max-width: 449px)
{
td.title-logo
{
padding: 360px 25px 0 25px !important;
}
}
@media (max-width: 390px)
{
td.title-logo
{
padding: 320px 25px 0 25px !important;
}
}
@media (max-width: 375px)
{
td.title-logo
{
padding: 300px 25px 0 25px !important;
}
}
@media (max-width: 360px)
{
td.title-logo
{
padding: 280px 45px 0 45px !important;
}
}
@media (max-width: 340px)
{
td.title-logo
{
padding: 260px 45px 0 45px !important;
}
}
@media (max-width: 320px)
{
td.title-logo
{
padding: 240px 45px 0 45px !important;
}
}
/* Button */
.button-shell
{
padding: 20px 44px 0 44px;
}
.button.red td
{
color:#ffffff;
font-size:14px;
font-weight:bold;
background-color:#E50914;
text-align:center;
padding:12px 22px;
border-radius:4px;
max-width:250px;
}
.button.red .button-link
{
color:#ffffff;
font-size:14px;
font-weight:bold;
text-align:center;
text-decoration:none;
font-family: Helvetica, Arial, sans;
}
@media (max-width: 400px)
{
.button-shell
{
padding: 22px 26px 0 26px !important;
}
.button td, .button-link
{
font-size: 13px !important;
}
}
@media (max-width: 450px)
{
td[class="viewAlltxt"]
{
font-size: 15px !important;
padding-top: 4px !important;
}
html td.viewAllimg img
{
padding-top: 8px !important;
}
td[class="viewAllimg"] img
{
height: 25px !important;
width: auto !important;
padding-top: 4px !important;
}
/* */
.view-all-rule, .view-all-rule img
{
width: 100% !important;
}
}
/* Flavor Text */
.flavor-text
{
font-size: 14px;
line-height: 28px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 24px 0 0 0;
font-weight: bold;
}
/* Date Text */
.date-text
{
font-size: 20px;
line-height: 22px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
/* Logo */
.logo
{
padding: 20px 0 0 0;
}
.logo img
{
display:block;
}
@media (max-width: 480px)
{
.logo
{
padding: 15px 0 0 0 !important;
}
.logo img
{
height: auto !important;
width:25% !important;
}
.label
{
font-size:8px !important;
font-weight:bold !important;
}
}
/* Logo */
.logo
{
padding: 20px 0 0 0;
}
.logo img
{
display:block;
}
@media (max-width: 480px)
{
.logo
{
padding: 15px 0 0 0 !important;
}
.logo img
{
height: auto !important;
width:25% !important;
}
.label
{
font-size:8px !important;
font-weight:bold !important;
}
}
/* Flavor Text */
.flavor-text
{
font-size: 18px;
line-height: 24px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 20px 0 0 0;
font-weight: bold;
}
.flavor-text a
{
color: #ffffff;
}
/* Date Text */
.date-text
{
font-size: 20px;
line-height: 24px;
color: #ffffff;
font-family: Helvetica, Arial, sans;
-wings-align: center;
padding: 5px 0 0 0;
font-weight: bold;
}
.date-text a
{
color: #ffffff;
}
</style>
</head>
<body bgcolor="#000000" style="font-family:Helvetica, Arial, sans;color:rgb(255, 255, 255);background-color:rgb(0, 0, 0);">
<!--/* 100% Size Container -->
<table class="container" width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color:rgb(0, 0, 0);">
<tbody>
<tr>
<td align="center">
<!--/* Hero + Content -->
<table class="shell" width="450" cellpadding="0" cellspacing="0" border="0" style="background-color:rgb(255, 255, 255);">
<!--/* Content -->
<tbody>
<tr>
<td class="content-shell" style="background-color:rgb(255, 255, 255);">
<table class="content" width="100%" cellpadding="0" cellspacing="0" border="0">
<!--/* Hero -->
<tbody>
<tr>
<td class="hero-shell">
<a href="https://www.netflix.com/title/80057281" style="text-decoration:none !important;color:inherit;">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="hero" style="min-height:703px;">
<tbody>
<tr>
<td class="hero-background" bgcolor="#000000" style="overflow:hidden;background-repeat: no-repeat;background:rgb(0, 0, 0) url(http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif) no-repeat center top;background-size:450px;background-repeat:no-repeat;" background="http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif">
<!--[if gte mso 9]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:450px;height:703px;">
<v:fill type="tile" src="http://art-0.nflximg.net/eb3b4/0d563d6bd5e2f8d6911fd351ae10051979deb3b4.gif" color="#000000" />
<v:textbox inset="0,0,0,0">
<![endif]-->
<div>
<table class="hero-content" align="center" cellpadding="0" cellspacing="0" border="0" height="100%" width="100%" style="min-height:703px;">
<!--/* Logo -->
<tbody>
<tr>
<td class="logo" valign="top" align="center" style="padding:20px 0 0 0;">
<a href="https://www.netflix.com/browse" style="color:inherit;"><img src="http://cdn.nflximg.com/us/email/logo/newDesign/logo_v2.png" alt="Netflix" width="100" height="27" style="-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;display:block;border-style:none;"></a>
</td>
</tr>
<tr>
<td class="label" valign="top" align="center" style="font-size:9px;color:#ffffff;text-transform:uppercase;padding:5px 0px 0px 0px;font-family: Helvetica, Georgia, Arial, sans-serif;-webkit-text-size-adjust: none;letter-spacing:1px;">
Une série originale Netflix
</td>
</tr>
<!-- Title Logo -->
<!--[if !mso]>
<!-->
<style type="text/css">
table.title-logo-table, .title-logo
{
width: 100% !important;
}
.title-logo img
{
max-width: 419px !important;
width: 100% !important;
}
</style>
<!--
<![endif]-->
<tr>
<td class="title-logo" width="450" align="center" valign="bottom" style="vertical-align:bottom;padding:450px 50px 0 50px;">
<img src="http://art-0.nflximg.net/93831/28c806b75126b85ccbc2c3535b36635e00693831.png" alt="Stranger Things" style="border-collapse:collapse;display:block;max-width: 419px !important;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;border-style:none;" width="350">
</td>
</tr>
<tr>
<td class="flavor-text" align="center" style="font-size:18px;line-height:24px;color:rgb(255, 255, 255);font-family:Helvetica, Arial, sans;padding:20px 0 0 0;font-weight:bold;">
TOUS LES Ã?PISODES
<br>
<span class="date-text" style="text-decoration: none !important;font-size:20px;line-height:24px;color:rgb(255, 255, 255);font-family:Helvetica, Arial, sans;padding:5px 0 0 0;font-weight:bold;" align="center"><a href="#" style="text-decoration: none !important;color:rgb(255, 255, 255);color:inherit;color:rgb(255, 255, 255);">Le 27 octobre</a></span>
</td>
</tr>
</tbody>
</table>
</div>
<!--[if gte mso 9]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</tbody>
</table>
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table class="shell-footer" width="450" cellpadding="0" cellspacing="0" border="0" style="background-color:rgb(0, 0, 0);">
<!--/* Content -->
<tbody>
<tr>
<td class="content-shell-footer" style="background-color:rgb(0, 0, 0);">
<table class="content" width="100%" cellpadding="0" cellspacing="0" border="0">
<!-- Button -->
<tbody>
<tr>
<td class="button-shell" align="center" style="padding:20px 44px 0 44px;">
<a class="button-link" href="https://www.netflix.com/watch/80202184" style="text-decoration:none;color:inherit;">
<table class="button red" cellpadding="0" cellspacing="0" border="0" align="center">
<tbody>
<tr>
<td align="center" style="color:rgb(255, 255, 255);font-size:14px;font-weight:bold;background-color:rgb(229, 9, 20);text-align:center;padding:12px 22px;border-radius:4px;max-width:250px;">
<a class="button-link" href="https://www.netflix.com/watch/80202184" style="color:#ffffff;font-family: Helvetica, Arial, sans;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;color:inherit;color:rgb(255, 255, 255);font-size:14px;font-weight:bold;text-align:center;text-decoration:none;font-family:Helvetica, Arial, sans;">REGARDER LA BANDE-ANNONCE</a>
</td>
</tr>
</tbody>
</table>
</a>
</td>
</tr>
<tr>
<td class="filler" height="30"></td>
</tr>
<!-- View All Bar With Play -->
<tr>
<td class="view-all-shell" align="center" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<!-- View All Text -->
<tbody>
<tr>
<td align="center" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tbody>
<tr>
<td align="left" valign="top">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tbody>
<tr>
<td align="center" valign="top" style="padding:10px 0px 0px 0px;">
<table cellpadding="0" cellspacing="0" border="0" align="center">
<tbody>
<tr>
<td class="viewAlltxt" align="right" valign="middle" style="font-family: Helvetica, Arial, sans-serif;-webkit-text-size-adjust: none;color:#ffffff;font-size:18px;font-weight:lighter;padding-right:5px;">
<a href="https://www.netflix.com/browse" target="_blank" style="text-decoration: none;color:#ffffff;line-height:100%;color:inherit;">Voir tous les films et séries TV</a>
</td>
<td class="viewAllimg" align="left" valign="top" style="padding-top:-1px">
<a href="https://www.netflix.com/browse" target="_blank" style="text-decoration: none;color:#e50914;line-height:100%;color:inherit;"><img alt="" src="http://cdn.nflximg.com/us/email/adhoc/201405/oitnb/launch/201406_hpnav5_vall.png" width="27" height="47" border="0" style="-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;border-style:none;"></a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<!-- Horizontal Rule -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tbody>
<tr>
<td class="view-all-rule width100" align="center" valign="top">
<img alt="" src="http://cdn.nflximg.com/us/email/adhoc/201405/oitnb/s2comingsoon/20140529_rule.png" width="450" height="1" border="0" style="display:block;color:;font-family: Helvetica, Arial, sans-serif;-webkit-text-size-adjust: none;padding:8px 0px 0px 0px;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<!-- /* Footer -->
<tr>
<td class="footer questions" align="center" style="font-size:14px;line-height:18px;padding:22px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);text-align:center;font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);">
Des questions ? Appelez le 0800 917 813.
</td>
</tr>
<tr>
<td class="footer footer-copy" style="font-size:12px;line-height:18px;padding:10px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);">
Cet e-mail d'information vous a été envoyé dans le cadre de votre abonnement à Netflix. Pour ne plus recevoir ces e-mails,
<a href="https://www.netflix.com/ManageSubscriptions" style="color:#6e6e6e;color:rgb(110, 110, 110);color:inherit;" target="_blank">cliquez ici pour vous désabonner</a>
ou rendez-vous sur la page
<a href="https://www.netflix.com/EmailPreferences" style="color:#6e6e6e;color:rgb(110, 110, 110);color:inherit;" target="_blank">Paramètres de communication</a>
, décochez la case
<span style="font-weight:bold;">Disponible sur Netflix</span>
et cliquez sur Mettre à jour. Veuillez ne pas répondre à cet e-mail. Si vous avez besoin d'aide ou souhaitez nous contacter, vous pouvez consulter notre
<a href="https://help.netflix.com/help" style="color:#6e6e6e;color:rgb(110, 110, 110);color:inherit;" target="_blank">Centre d'aide</a>
.
</td>
</tr>
<tr>
<td class="footer footer-copy" style="font-size:12px;line-height:18px;padding:10px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);">
Ce message est adressé à [
<a href="#" style="text-decoration: none !important; color: #6e6e6e;color:rgb(110, 110, 110);color:inherit;">xxx</a>
] de la part de Netflix.
</td>
</tr>
<tr>
<td class="footer footer-copyNp" style="font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);font-size:12px;line-height:18px;padding:0px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);">
<!--legal_content_footer-->
SRC:
<a href="https://help.netflix.com/help" style="color:#6e6e6e;text-decoration:none;color:rgb(110, 110, 110);color:inherit;">12186_fr_FR</a>
</td>
</tr>
<tr>
<td class="footer footer-copyNp" style="font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);font-size:12px;line-height:18px;padding:0px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);">
L'utilisation du service et du site Web de Netflix est soumise à nos
<a style="color:#6e6e6e;text-decoration:underline;color:rgb(110, 110, 110);color:inherit;" href="https://www.netflix.com/TermsOfUse">Conditions d'utilisation</a>
et à notre
<a style="color:#6e6e6e;text-decoration:underline;color:rgb(110, 110, 110);color:inherit;" href="https://www.netflix.com/PrivacyPolicy">Déclaration de confidentialité</a>
.
</td>
</tr>
<tr>
<td class="footer footer-copyNp" style="font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);font-size:12px;line-height:18px;padding:0px 44px 0 44px;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);">
<span class=""><a href="https://www.netflix.com/browse" style="color:#6e6e6e; text-decoration:none !important;color:rgb(110, 110, 110);color:inherit;">©Netflix International B.V.</a></span>
</td>
</tr>
<tr>
<td class="footer footer-spacer" height="44" style="font-family:Helvetica, Arial, sans;color:rgb(110, 110, 110);background-color:rgb(0, 0, 0);border-color:rgb(0, 0, 0);">
<!--legal_content_footer-->
<img src="http://beacon.netflix.com/img/foobar" style="display:block;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;" border="0">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- Fix for Google Inbox -->
<table class="inbox-fix" cellpadding="0" cellspacing="0" border="0" width="450" height="1" align="center" style="width: 450px !important;">
<tbody>
<tr>
<td>
<img src="http://cdn.nflximg.com/us/email/spacer.gif" width="150" height="1" style="border-collapse:collapse;display:block;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;">
</td>
<td>
<img src="http://cdn.nflximg.com/us/email/spacer.gif" width="150" height="1" style="border-collapse:collapse;display:block;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;">
</td>
<td>
<img src="http://cdn.nflximg.com/us/email/spacer.gif" width="150" height="1" style="border-collapse:collapse;display:block;-ms-interpolation-mode:bicubic;border:none;outline:none;border-collapse:collapse;">
</td>
</tr>
</tbody>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment