<!DOCTYPE html>
<html>
<head>
<style>html,body,table { line-height:1.5; } body { margin:0;padding:0; } h1,h2,h3,h4,h5,h6 { font-weight:bold;font-style:normal;font-size:1em;margin:0; } h2 { margin:1em 0; } h3 { margin:1em 0; } h5 { font-style:italic; } h6 { font-weight:normal;font-style:italic; } p,ol,ul,figure,blockquote,.spaced-block { margin:1em 0; } img { border:0;height:auto;line-height:100%;outline:none;-webkit-text-decoration:none;text-decoration:none; } body,table,td,a { -webkit-text-size-adjust:100%;-ms-text-size-adjust:100%; } table,td { border-collapse:separate;mso-table-lspace:0pt;mso-table-rspace:0pt; } table td { vertical-align:top; } img { -ms-interpolation-mode:bicubic;max-width:100%; } * { -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; } hr { margin:36px 0;border:0;height:1px;background:#eee; } ul,ol { margin-left:1em;padding:0;list-style-position:outside; } ol ol,ul ul,ol ul,ul ol { padding:0 0 0 1em; } li { padding:0 0 0 1em;margin:0 0 0 1em; } .email-button { border:0 none; } .built-with { width:100%;max-width:640px;margin-left:auto;margin-right:auto; } </style>
<style>.ck-link { text-decoration: underline; }</style>
<style>.ck-link { text-decoration: underline; }</style>
<style>@media only screen and (max-width:600px) { .email-container { padding:0 !important; } }
@media only screen { .email * { word-break: break-word; } }
@media screen and (max-width: 384px) { .mail-message-content { width: 414px !important; } }
@media only screen { .email * { word-break: break-word; } }
@media screen and (max-width: 384px) { .mail-message-content { width: 414px !important; } }
@media only screen and (max-width:600px) { .ck-padding-left-none { padding-left:0px !important; } .ck-padding-right-none { padding-right:0px !important; } .ck-padding-left-mobile-friendly { padding-left:18px !important; } .ck-padding-right-mobile-friendly { padding-right:18px !important; } }
@media only screen and (max-width:600px) { .ck-mobile-font-size { font-size:50px !important; } }
@media only screen and (max-width:600px) { .ck-mobile-font-size { font-size:50px !important; } }</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div style="background-color:#ffffff"><table role="presentation" cellpadding="0" cellspacing="0" class="email" style="background:#ffffff !important;width:100%" bgcolor="#ffffff"><tbody><tr>
<td><div class="email-container normal" style="padding-top:0;padding-left:0;padding-bottom:30px;padding-right:0;margin:0 auto;max-width:100%"><table cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="width:100%;margin:0 auto;background-color:#ffffff"><tbody><tr><td>
<div class="ck-section" style="margin:30px auto 7px auto"><center>
<table cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;max-width:640px"><tbody><tr>
<td contenteditable="false"></td>
<td width="640" style="border-radius:0px;box-sizing:border-box;mso-padding-alt:0px 4px 0px 4px"><div class="ck-inner-section ck-padding-left-mobile-friendly ck-padding-right-mobile-friendly" style="padding:0px 4px 0px 4px"><div style="margin-left:auto;margin-right:auto">
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">Hello my front-end friend,</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">Creating websites was a hobby of mine for a long time. I<strong> started making my first sites in the late 90s</strong> with Photoshop slicing, table layouts, and image maps. I never thought writing HTML and CSS would become such an important part of my life.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">After a wandering path of unrelated degrees, I ended up as a graphic designer at a small agency. </p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">I loved it, but the pay was terrible, so I started freelancing on the side as well, mostly designing websites. After a few jobs, I figured that if they were hiring me to make the designs already, I could probably make more money by also coding those designs into actual sites as well.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class=""><strong>Little did I know that making something for a client is a lot harder than the random hobby sites I made back in the day!</strong> </p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">But even though it was hard, I enjoyed it even more than the design work.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class=""><strong>Then things took a big turn.</strong> </p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">I left my design job to become a teacher.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">While the school’s focus was print design, once they found out I had web experience, I quickly became the go-to web teacher.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class=""><strong>And that’s when I realized that while I could build a website, I didn’t really know what I was doing.</strong></p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">I had figured out a few patterns I could repeat to create the layouts I was designing, and I had enough experience to recognize the common pitfalls, but teaching was a completely different beast. <strong>I had to explain </strong><strong><em>why</em></strong><strong> things worked, and I had no idea</strong>.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">So I started researching, reading, and watching any video I could get my hands on (there were a lot fewer back then), spending most of my evenings trying to find ways to explain things to my students.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">And somewhere in all that, something shifted. While I learned about a ton of CSS features that I hadn’t even been aware of, the most important part was that <strong>I started to understand how CSS works</strong>.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">Suddenly, the code I wrote just <em>worked</em>. Not because I memorized more stuff and knew more properties, but because <strong>I was finally working </strong><em><strong>with</strong></em><strong> the browser instead of against it</strong>. When I ran into a problem, I could figure it out without even needing Google because I understood what the browser was trying to do and where my instructions conflicted with it.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">It honestly felt like I suddenly had a cheat code.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class=""><strong>That’s what I want for you, which is why I created CSS Demystified</strong>. I wanted to give people the same shift I experienced, one that turned CSS from a source of frustration into something I enjoy, without you having to spend the years it took me for things to start to click.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">As you might know, I shut down CSS Demystified a few months ago. That's because I've completely recreated the course from the ground up, including building a custom platform, so I didn't have to make any compromises due to the limitations of 3rd-party tools.</p>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">The new version is *finally* ready after more than a year's work. I’ll have a lot more details about the course for you tomorrow. For now, I’ll leave you with this, from someone who’s been through the original version of the course:</p>
<div style="padding:10px 20px;margin:0 0 20px;border-left-style:solid;border-left-width:5px;border-left-color:#000000;font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5;text-align:left" class="blockquotes">
<div class="blockquotes-line"><em>“You will learn to write CSS with confidence. This course gives you a structured guide on how to approach CSS by teaching you how to think and by giving you plenty of truly practical tools.”</em></div>
<div class="blockquotes-line">
<strong>Igor dos Reis</strong> — CSS Demystified V1 alum</div>
</div>
<p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">Cheers,<br>Kevin</p>
<div>
<table cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto"><tbody><tr><td><p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:18px;color:#353535;font-weight:400;line-height:1.5" class="">P.S. With this launch of CSS Demystified, I'll be sending more emails than usual over the next several days. If you aren't interested in the course and you’d like to only get my regular Sunday emails, <a href="https://b59b20d1.click.convertkit-mail4.com/wvuwxmknkghghk7d4o8u7hnzr8k7lf8hodzk/48hwrz62hehmlw52v8aq/aHR0cHM6Ly93d3cua2V2aW5wb3dlbGwuY28vdXBkYXRlZC8=" trigger-id="5625201" target="_blank" class="ck-link" rel="noopener noreferrer" style="color:#0000ff" url-id="1843696864">click here to opt out of these extra emails</a>.</p></td></tr></tbody></table></div>
<hr style="margin-top:48px;margin-bottom:48px">
</div></div></td>
<td contenteditable="false"></td>
</tr></tbody></table>
<div><!--[if mso]><br /><br /><![endif]--></div>
</center></div>
<div class="ck-section" style="margin:0px auto 24px auto"><center>
<table cellpadding="0" cellspacing="0" style="width:100%;margin:0 auto;max-width:640px"><tbody><tr>
<td contenteditable="false"></td>
<td width="640" style="background-color:#f7f7f7;border-radius:0px;box-sizing:border-box;mso-padding-alt:18px 18px 18px 18px" bgcolor="#f7f7f7"><div class="ck-inner-section ck-padding-left-mobile-friendly ck-padding-right-mobile-friendly" style="padding:18px 18px 18px 18px"><div style="margin-left:auto;margin-right:auto;max-width:640px"><p style="font-family:-apple-system, BlinkMacSystemFont, sans-serif;font-size:15px;color:#747474;font-weight:400;line-height:1.5" class=""><a href="https://b59b20d1.unsubscribe.convertkit-mail4.com/wvuwxmknkghghk7d4o8u7hnzr8k7lf8hodzk" target="_blank" class="ck-link" rel="noopener noreferrer" style="color:#006df2">Unsubscribe</a> · <a href="https://preferences.convertkit-mail4.com/wvuwxmknkghghk7d4o8u7hnzr8k7lf8hodzk" target="_blank" class="ck-link" rel="noopener noreferrer" style="color:#006df2">Preferences</a><br>600 1st Ave, Ste 330 PMB 92768, Seattle, WA 98104-2246</p></div></div></td>
<td contenteditable="false"></td>
</tr></tbody></table>
<div><!--[if mso]><br /><br /><![endif]--></div>
</center></div>
</td></tr></tbody></table></div></td>
<td></td>
</tr></tbody></table></div>
<!-- -->
<img src="https://b59b20d1.open.convertkit-mail4.com/wvuwxmknkghghk7d4o8u7hnzr8k7lf8hodzk" alt="" style="display:block">
</body>
</html>