Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Auto Save

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>US inflation, Guptas raided, robot skiing</title>
  
  
  
  
  
</head>

<body>

  <head>
    <!-- For Windows Phone 8. See http://bit.ly/1u4tj4v - Windows Phone 8 strips out DOCTYPE and renders emails in IE 5 mode by DEFAULT -->
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!--[if gte mso 9]>
    <style>
      #email-body,#email-footer {
      width:620px;
      }
    </style>
    <![endif]-->

  <style type="text/css">
		body{
			padding:0;
			margin:0;
			font-family:-apple-system,".SFNSDisplay-Regular",Roboto,Helvetica,Tahoma,sans-serif;
			-ms-text-size-adjust:100%;
			color:#333;
			background:#fff;
		}
		p{
			margin:1em 0;
		}
		a{
			color:#168DD9;
			text-decoration:none;
		}
		table{
			border:0;
		}
		#email-body{
			margin:auto;
			max-width:620px;
			padding:15px 20px;
			font-size:19px;
			line-height:1.4;
			word-wrap:normal;
			text-align:left;
		}
		#email-body h2{
			font-size:15px;
			color:#006AA4;
			text-transform:uppercase;
			margin:30px 0 20px;
			padding:30px 0 0;
			line-height:1.1;
			border-top:1px solid #e2e2e2;
		}
		#email-body h2+p{
			margin:5px 0 1em;
		}
		#email-body figure{
			margin:1em 0;
			padding:0;
		}
		.inline-image-credit{
			font-size:14px;
			color:#bebebe;
		}
		#email-sponsor-header,.email-sponsor-label{
			color:#888;
			font-size:13px;
		}
		#email-body img{
			height:auto;
			max-width:100%;
		}
		#email-header{
			background:#000;
			text-align:center;
			padding:25px 0;
		}
		#email-logo{
			width:230px;
		}
		#email-sponsor-header{
			height:0;
			padding:0;
			text-align:center;
			background:#262626;
		}
		#email-sponsor-header td table{
			border:0;
			margin:7px 0;
		}
		#email-sponsor-header img{
			max-width:130px;
			max-height:30px;
			vertical-align:middle;
			margin-left:10px;
		}
		.email-sponsor-name{
			display:none !important;
			width:0;
			height:0;
			text-indent:-9999px;
			font-size:0;
			mso-hide:all;
		}
		#email-footer-container{
			background:#f4f4f4;
		}
		#email-footer{
			padding:20px;
			max-width:620px;
			margin:auto;
		}
		#email-footer p{
			margin:0 0 20px;
			font-size:12px;
		}
		#email-body .sponsor-message-title{
			color:#f1a33f;
		}
		#email-body .partner-message-title{
			color:#a1a1a1;
		}
		#email-footer .constrain{
			text-align:left;
			padding:0 20px;
		}
		#email-footer p.last{
			margin:0;
		}
		#email-body .first-headline:not(.sponsor-message-title){
			margin-top:0;
			padding-top:5px;
			border:0 !important;
		}
	@media screen and (max-width:580px){
		#email-body{
			font-size:17px;
		}

}	@media screen and (max-width:580px){
		.constrain{
			max-width:100%;
			padding:0 7%;
			margin:0;
		}

}</style><!--[if !mso]><!--><link href="https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i" rel="stylesheet"><!--<![endif]--></head>
  <body style="padding: 0;margin: 0;font-family: -apple-system,&quot;.SFNSDisplay-Regular&quot;,Roboto,Helvetica,Tahoma,sans-serif;-ms-text-size-adjust: 100%;color: #333;background: #fff;">
    <table id="email-header" cellpadding="0" cellspacing="0" width="100%" style="border: 0;background: #000;text-align: center;padding: 25px 0;">
      <tbody>
        <tr>
          <td><a href="https://qz.com/" title="Quartz - qz.com" target="_blank" style="color: #168DD9;text-decoration: none;"><img id="email-logo" width="230" src="https://gallery.mailchimp.com/610c6c88d981c23e5c6638b14/images/ba0ea940-719d-43f6-8e3f-a23481fc390b.png" alt="Quartz - qz.com" style="width: 230px;"></a></td>
        </tr>
      </tbody>
    </table>
    <table id="email-sponsor-header" cellpadding="0" cellspacing="0" width="100%" style="border: 0;color: #888;font-size: 13px;height: 0;padding: 0;text-align: center;background: #262626;">
      <tbody></tbody>
    </table>
    <table id="email-body-container" cellpadding="0" cellspacing="0" width="100%" style="border: 0;">
      <tbody>
        <tr>
          <td align="center">
            <table id="email-body" cellpadding="0" cellspacing="0" style="border: 0;margin: auto;max-width: 620px;padding: 15px 20px;font-size: 19px;line-height: 1.4;word-wrap: normal;text-align: left;">
              <tbody><tr>
                <td><p style="margin: 1em 0;">Good morning, Quartz readers!</p>
<h2 class="first-headline " style="font-size: 15px;color: #006AA4;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;margin-top: 0;padding-top: 5px;border: 0 !important;">What to watch for today</h2>
<p style="margin: 5px 0 1em;"><strong>Markets walk a tightrope on US inflation and VIX data.</strong> The US consumer price index is expected to show a slight downtick, but any surprises <a href="https://www.bloomberg.com/news/articles/2018-02-13/u-s-cpi-report-takes-on-bigger-importance-after-markets-plunge?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">could trigger another big market sell-off</a>. Separately, <a href="https://www.bloomberg.com/news/articles/2018-02-13/vix-could-be-volatile-on-expiration-even-if-stocks-are-flat?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">monthly options will expire</a> for the closely watched CBOE Volatility Index, making bigger swings more likely.</p>
<p style="margin: 1em 0;"><strong>Boris Johnson offers a Brexit valentine. </strong>In London, the British foreign minister <a href="https://www.politico.eu/article/boris-johnson-brexit-speech-london-betrayal-would-be-disastrous-mistake/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">will deliver a speech</a> that sets out a new vision for post-Brexit Britain, as the government tries to win over people who voted to remain in the EU. It will be the first of six “Road to Brexit” speeches over the coming weeks.</p>
<p style="margin: 1em 0;"><strong>Cisco Systems is about to turn a corner.</strong> At least, analysts are feeling optimistic that the networks company will return to quarterly <a href="https://www.marketwatch.com/story/cisco-earnings-high-hopes-pinned-to-return-to-revenue-growth-2018-02-12?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">revenue growth</a> after six straight quarters of declines.</p>

<h2 style="font-size: 15px;color: #006AA4;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;">While you were sleeping</h2>
<p style="margin: 5px 0 1em;"><strong>Police raided the home of a powerful family with ties to Jacob Zuma.</strong> The elite Hawks unit swept into the <a href="https://uk.reuters.com/article/uk-safrica-politics/south-african-police-raid-gupta-home-pressure-cranks-up-on-zuma-idUKKCN1FY0I1?il=0&amp;mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">Gupta family compound</a> in Johannesburg. The Gupta brothers are believed to have corrupt links with the embattled South African president. Meanwhile, Zuma still hasn’t stepped down despite expectations that he would this morning.</p>
<p style="margin: 1em 0;"><strong>Donald Trump’s lawyer said he paid Stormy Daniels out of his own pocket.</strong> Michael Cohen told the New York Times that he had paid <a href="https://www.nytimes.com/2018/02/13/us/politics/stormy-daniels-michael-cohen-trump.html?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">$130,000 to porn actress</a> (paywall) Stephanie Clifford—who claimed she had an affair with Trump—in the run up to the 2016 election. Cohen said that he wasn’t reimbursed for it, but wouldn’t say if Trump had been aware of the payment.</p>
<p style="margin: 1em 0;"><strong>The Israeli opposition called for Benjamin Netanyahu’s resignation.</strong> Israeli police on Monday recommended charging the prime minister with bribery, over allegations <a href="https://www.apnews.com/164fe9cee9964886bc97e9a70baa37d6/The-Latest:-Israel-opposition-calls-on-Netanyahu-to-resign?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">he took expensive gifts</a> from wealthy businessmen. Netanyahu then went on TV to accuse the police of conducting a witch hunt, and vowed to keep leading the country.</p>
<p style="margin: 1em 0;"><strong>Punjab National Bank uncovered fraud to the tune of $1.8 billion.</strong> India’s <a href="https://qz.com/1206812/punjab-national-bank-duped-of-nearly-a-third-of-its-market-value-from-a-single-branch/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">second-largest state bank</a> said it had detected fraudulent and unauthorized transactions at a single branch in Mumbai—that’s the equivalent of eight times its 2017 net income. Other banks are also likely to be affected.</p>
<p style="margin: 1em 0;"><strong>Germany ended 2017 on a high.</strong> The juggernaut economy reported 0.6% growth in the fourth quarter from the year before and <a href="https://www.ft.com/content/57287e10-1156-11e8-8cb6-b9ccc4c4dbbb?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">2.2% overall in 2017</a> (paywall). As expected, robust exports powered the growth—the Federal Statistics Office said household consumption was more or less flat.</p>
<h2 style="font-size: 15px;color: #006AA4;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;">Quartz obsession interlude</h2>
<p style="margin: 5px 0 1em;"><strong>Dan Kopf on the foolish strategies people use to pay down credit card debt. </strong>“The best way to pay off credit card debt is simple. If you can’t pay the full balance for all the cards, pay the minimum monthly payment for each, and then devote the rest to repaying the card with the highest interest rate. Following this rule, you incur the least interest and save the most money. Very few people do this.” <a href="https://qz.com/1205124/the-foolish-strategies-people-often-use-to-pay-back-credit-card-debt/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">Read more here</a>.</p>
<h2 style="font-size: 15px;color: #006AA4;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;">Matters of debate</h2>
<p style="margin: 5px 0 1em;"><strong>“Smart cities” are a pipe dream.</strong> Gadgetry won’t make urban living <a href="https://www.theatlantic.com/technology/archive/2018/02/stupid-cities/553052/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">more affordable or resilient</a>.</p>
<p style="margin: 1em 0;"><strong>Nobody knows what’s causing stock meltdowns. </strong>Understanding why something happened in the market is <a href="https://qz.com/1205782/nobody-really-knows-why-stock-markets-went-haywire-last-week/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">only slightly easier</a> than grasping the meaning of life.</p>
<p style="margin: 1em 0;"><strong>South Africa’s political crisis could taint an entire continent. </strong>If the nation fails to recover, cynicism about Africa <a href="https://www.ft.com/content/3ff7e280-0fd5-11e8-8cb6-b9ccc4c4dbbb?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">will spread across the rest of the world</a> (paywall).</p>
<h2 class="partner-message-title" style="font-size: 15px;color: #a1a1a1;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;">Message from our Partner</h2>
<p style="margin: 5px 0 1em;"><b>Sign up for a revolutionary new book club made for people in search of the next big idea.</b> <a href="https://www.nextbigideaclub.com/home-spring-1" target="_blank" style="color: #168DD9;text-decoration: none;">Subscribers</a> to the Next Big Idea Club receive groundbreaking new nonfiction books hand-selected by Malcolm Gladwell, Susan Cain, Adam Grant, and Daniel Pink each season, as well as author interviews, video insights, and two books donated on their behalf to underresourced students.</p>
<h2 style="font-size: 15px;color: #006AA4;text-transform: uppercase;margin: 30px 0 20px;padding: 30px 0 0;line-height: 1.1;border-top: 1px solid #e2e2e2;">Surprising discoveries</h2>
<p style="margin: 5px 0 1em;"><strong>Robots had their own Winter Olympics in South Korea.</strong> Eight teams sent <a href="https://qz.com/1206297/a-robot-skiing-competition-in-south-korea-reminds-us-how-far-away-the-apocalypse-is/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">autonomous humanoids</a> down a 70-meter ski slope, with very mixed results.</p>
<p style="margin: 1em 0;"><strong>South Korea bankrolled North Korea’s trip to the Winter Olympics.</strong> Seoul signed off on $2.64 million to cover personnel costs for <a href="https://in.reuters.com/article/olympics-2018-northkorea-payment/south-korea-approves-record-2-6-million-budget-for-north-koreans-olympic-visit-idINKCN1FY09A?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">hundreds of North Koreans</a>.</p>
<p style="margin: 1em 0;"><strong>A scientist captured an impossible photo of a single atom. </strong>The award-winning image <a href="https://qz.com/1205279/photo-of-an-atom-a-scientist-captured-an-incredible-photograph/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">shows a glowing strontium atom</a> suspended in a web of lab machinery.</p>
<p style="margin: 1em 0;"><strong>China banned touching penguins in Antarctica. </strong>Ill-mannered tourists have been <a href="https://www.independent.co.uk/environment/antarctica-china-tourists-dont-touch-penguins-travel-environment-latest-a8203981.html?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">flocking to the continent</a>.</p>
<p style="margin: 1em 0;"><strong>The Amazon molly can clone itself without any male DNA. </strong>The <a href="https://qz.com/1205980/the-amazon-molly-is-all-female-fish-species-thats-changing-scientific-thinking-on-asexual-reproduction/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">all-female fish species</a> is upending how scientists think about asexual reproduction.</p>
<p style="margin: 1em 0;">Our best wishes for a productive day. Please send any news, comments, Valentine’s Day messages, and atom pics to <a href="mailto:[email protected]" style="color: #168DD9;text-decoration: none;" target="_blank">[email protected]</a>. You can follow us <a href="https://twitter.com/qz/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">on Twitter</a> for updates throughout the day or download our <a href="https://itunes.apple.com/us/app/quartz-news-in-a-whole-new-way/id1076683233?mt=8&amp;mc_cid=de482d20e8&amp;mc_eid=70835afaec&amp;mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">apps for iPhone</a> and <a href="https://play.google.com/store/apps/details?id=com.qz.android&amp;mc_cid=de482d20e8&amp;mc_eid=70835afaec&amp;mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">Android</a>. Today’s Daily Brief was written by Jill Petzinger and edited by Lianna Brinded.</p>
</td>
              </tr>
            </tbody></table>
          </td>
        </tr>
      </tbody>
    </table>
    <table id="email-footer-container" cellpadding="0" cellspacing="0" width="100%" style="border: 0;background: #f4f4f4;">
      <tbody>
        <tr>
          <td align="center">
            <table id="email-footer" cellpadding="0" cellspacing="0" style="border: 0;padding: 20px;max-width: 620px;margin: auto;">
              <tbody>
                <tr>
                  <td><p style="margin: 0 0 20px;font-size: 12px;">Enjoying the Daily Brief? Forward it to a friend! They can <a href="https://qz.com/newsletters/daily-brief/?utm_source=dbfwdfooter&amp;utm_medium=nl&amp;utm_campaign=dbsignups&amp;mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">click here to sign up.</a></p><p style="margin: 0 0 20px;font-size: 12px;">If you click a link to an e-commerce site and make a purchase, we may receive a small cut of the revenue, which helps support our ambitious journalism. See <a href="https://qz.com/about/ethicsandadvertisingguidelines/?mc_cid=e4f60bcd15&amp;mc_eid=f70f6e7360" style="color: #168DD9;text-decoration: none;" target="_blank">here</a> for more information.</p><p style="margin: 0 0 20px;font-size: 12px;">Want to receive the Daily Brief at a different time? <a href="#" style="color: #168DD9;text-decoration: none;" target="_blank">Click here</a> to change your edition. To unsubscribe entirely, <a href="#" style="color: #168DD9;text-decoration: none;" target="_blank">click here</a>.</p><p class="last" style="margin: 0;font-size: 12px;"><b>Quartz</b> | 675 Avenue of the Americas, 4th Fl | New York, NY 10011 | United States</p></td>
                </tr>
              </tbody>
            </table>
          </td>
        </tr>
      </tbody>
    </table>
 
</body>
  
  

</body>

</html>

              
            
!

CSS

              
                
              
            
!

JS

              
                
              
            
!
999px

Console