Quote slide workign

3 files changed, 183 insertions, 186 deletions

diff --git a/template.html b/template.html
index 821cb47..aa5ae3f 100644
--- a/template.html
+++ b/template.html
@@ -28,7 +28,9 @@
   </slide>
 
   <slide>
-    <h2>Slide with Bullets</h2>
+    <hgroup>
+      <h2>Slide with Bullets</h2>
+    </hgroup>
     <article>
       <ul>
         <li>Titles are formatted as Open Sans with bold applied and font size is set at 45</li>
@@ -65,7 +67,9 @@
   </slide>
 
   <slide>
-    <h2>Slide with Smaller Font</h2>
+    <hgroup>
+      <h2>Slide with Smaller Font</h2>
+    </hgroup>
     <article class="smaller">
       <ul>
         <li>Titles are formatted as Open Sans with bold applied and font size is set at 45</li>
@@ -142,7 +146,9 @@ function helloWorld(world) {
     <aside class="note">
       <section>Speaker notes can go here!</section>
     </aside>
-    <h2>Slide with Speaker Notes</h2>
+    <hgroup>
+      <h2>Slide with Speaker Notes</h2>
+    </hgroup>
     <article>
       Press 'n'
     </article>
@@ -150,20 +156,31 @@ function helloWorld(world) {
 
   <slide class="segue dark nobackground">
     <aside class="gdbar"><img src="images/google_developers_icon_128.png"></aside>
-    <article class="flexbox vleft">
-      <hgroup class="auto-fadein">
-        <h2>Segue Slide</h2>
-        <h3>Subtitle Placeholder</h3>
-      </hgroup>
+    <hgroup class="auto-fadein">
+      <h2>Segue Slide</h2>
+      <h3>Subtitle Placeholder</h3>
+    </hgroup>
+  </slide>
+
+  <slide class="segue dark quote nobackground">
+    <aside class="gdbar right bottom"><img src="images/google_developers_icon_128.png"></aside>
+    <article class="flexbox vleft auto-fadein">
+      <q>
+        This is an example of quote text.
+      </q>
+      <div class="author">
+        Name<br>
+        Company
+      </div>
     </article>
   </slide>
 
   <slide class="thank-you-slide segue nobackground">
     <aside class="gdbar right"><img src="images/google_developers_icon_128.png"></aside>
-    <section class="flexbox vleft auto-fadein">
+    <article class="flexbox vleft auto-fadein">
       <h2>&lt;Thanks You!&gt;</h2>
       <p>Important contact information goes here.</p>
-    </section>
+    </article>
     <p class="auto-fadein">
       Insert contact info<br>
       Insert contact info<br>
@@ -172,9 +189,9 @@ function helloWorld(world) {
   </slide>
 
   <slide class="logoslide dark nobackground">
-    <section class="flexbox vcenter">
+    <article class="flexbox vcenter">
       <span><img src="images/google_developers_logo_white.png"></span>
-    </section>
+    </article>
   </slide>
 
 </slides>
diff --git a/theme/css/default.css b/theme/css/default.css
index f9a91b0..88ea9a9 100644
--- a/theme/css/default.css
+++ b/theme/css/default.css
@@ -399,19 +399,15 @@ slides > slide.dark {
   background: #515151;
 }
 /* line 180, ../sass/default.scss */
-slides > slide hgroup + article {
+slides > slide > hgroup + article {
   margin-top: 1.5em;
 }
-/* line 184, ../sass/default.scss */
-slides > slide > article {
-  margin-top: 2em;
-}
-/* line 187, ../sass/default.scss */
-slides > slide > article p {
+/* line 183, ../sass/default.scss */
+slides > slide > hgroup + article p {
   margin-bottom: 1em;
 }
 
-/* line 198, ../sass/default.scss */
+/* line 194, ../sass/default.scss */
 slides.layout-widescreen > slide.far-past,
 slides.layout-faux-widescreen > slide.far-past {
   display: block;
@@ -426,7 +422,7 @@ slides.layout-faux-widescreen > slide.far-past {
   -ms-transform: translate3d(-2260px, 0, 0);
   transform: translate3d(-2260px, 0, 0);
 }
-/* line 204, ../sass/default.scss */
+/* line 200, ../sass/default.scss */
 slides.layout-widescreen > slide.past,
 slides.layout-faux-widescreen > slide.past {
   display: block;
@@ -441,7 +437,7 @@ slides.layout-faux-widescreen > slide.past {
   -ms-transform: translate3d(-1130px, 0, 0);
   transform: translate3d(-1130px, 0, 0);
 }
-/* line 210, ../sass/default.scss */
+/* line 206, ../sass/default.scss */
 slides.layout-widescreen > slide.current,
 slides.layout-faux-widescreen > slide.current {
   display: block;
@@ -456,7 +452,7 @@ slides.layout-faux-widescreen > slide.current {
   -ms-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
 }
-/* line 216, ../sass/default.scss */
+/* line 212, ../sass/default.scss */
 slides.layout-widescreen > slide.next,
 slides.layout-faux-widescreen > slide.next {
   display: block;
@@ -471,7 +467,7 @@ slides.layout-faux-widescreen > slide.next {
   -ms-transform: translate3d(1130px, 0, 0);
   transform: translate3d(1130px, 0, 0);
 }
-/* line 222, ../sass/default.scss */
+/* line 218, ../sass/default.scss */
 slides.layout-widescreen > slide.far-next,
 slides.layout-faux-widescreen > slide.far-next {
   display: block;
@@ -487,30 +483,30 @@ slides.layout-faux-widescreen > slide.far-next {
   transform: translate3d(2260px, 0, 0);
 }
 
-/* line 229, ../sass/default.scss */
+/* line 225, ../sass/default.scss */
 b {
   font-weight: 600;
 }
 
-/* line 233, ../sass/default.scss */
+/* line 229, ../sass/default.scss */
 a {
   color: #0066cc;
 }
-/* line 236, ../sass/default.scss */
+/* line 232, ../sass/default.scss */
 a:visited {
   color: rgba(0, 102, 204, 0.75);
 }
-/* line 240, ../sass/default.scss */
+/* line 236, ../sass/default.scss */
 a:hover {
   color: black;
 }
 
-/* line 245, ../sass/default.scss */
+/* line 241, ../sass/default.scss */
 h1, h2, h3 {
   font-weight: 600;
 }
 
-/* line 249, ../sass/default.scss */
+/* line 245, ../sass/default.scss */
 h2 {
   font-size: 45px;
   line-height: 45px;
@@ -518,7 +514,7 @@ h2 {
   color: #515151;
 }
 
-/* line 256, ../sass/default.scss */
+/* line 252, ../sass/default.scss */
 h3 {
   font-size: 30px;
   letter-spacing: -1px;
@@ -527,38 +523,38 @@ h3 {
   color: #797979;
 }
 
-/* line 264, ../sass/default.scss */
+/* line 260, ../sass/default.scss */
 ul {