diff --git a/basics.html b/basics.html
index 5620c89fb428c28aa1fa5d8f016e3bbeee191c5e..512a36949b0afa92d0cccebf34a9e11df21037bd 100644
--- a/basics.html
+++ b/basics.html
@@ -13,6 +13,7 @@
<link rel="stylesheet" href="reveal.js/css/theme/black.css" id="theme" />
<link rel="stylesheet" href="css/company-logo.css" />
<link rel="stylesheet" href="css/ribbon.css" />
+ <link rel="stylesheet" href="css/crawl.css" />
</head>
<body>
@@ -263,6 +264,33 @@
notes:
- basically, everything you can script
</section>
+
+ <section class="star-wars" id="motivation-wars">
+ <div class="crawl">
+ <div class="title">
+ <h1>motivation #wars</h1>
+ </div>
+
+ <div data-markdown>
+ 1. revert a bad change?
+ 1. view the history?
+ 1. know why someone changed it?
+ 1. maintain multiple versions?
+ 1. see the diff of two versions?
+ 1. find commit that broke something?
+ 1. have free backup?
+ 1. have non-interfering playgrounds?
+ 1. have automated testing?
+ 1. have automated deployment?
+ 1. forget about ms word comments?
+ 1. contribute to a project?
+ 1. share your code?
+ 1. let other people do the work for you?
+ </div>
+
+ <img src="http://i.giphy.com/90F8aUepslB84.gif" />
+ </div>
+ </section>
</section>
<!---------------------------------------------------------------------
diff --git a/css/crawl.css b/css/crawl.css
new file mode 100644
index 0000000000000000000000000000000000000000..69ab0c7116f96ca256b474f32fa2406e7144827a
--- /dev/null
+++ b/css/crawl.css
@@ -0,0 +1,28 @@
+.star-wars {
+ height: 800px;
+ perspective: 400px;
+
+ color: #feda4a;
+ letter-spacing: 6px;
+}
+
+.crawl {
+ position: relative;
+ animation: crawl 120s linear;
+}
+
+.crawl > .title > h1 {
+ color: #feda4a;
+}
+
+@keyframes crawl {
+ 0% {
+ top: 0;
+ transform: rotateX(20deg) translateZ(0);
+ }
+
+ 100% {
+ top: -6000px;
+ transform: rotateX(25deg) translateZ(-2500px);
+ }
+}