fiddling with testimonial responsiveness

app/assets/stylesheets/_web_dev.sass

@@ -16,7 +16,7 @@
 .heading
   background-repeat: no-repeat
   background-position: center
-  
+
 .heading , .parallax
   height: 500px
   color: white
@@ -312,10 +312,10 @@ h4 , h5 , h6
  ***************************************************************** *
 
 .testimonial
-  margin-bottom: 30px
   p
     margin-top: 0
   .figure
+    margin-bottom: 30px
 
     img
       border-radius: 3px
@@ -337,3 +337,7 @@ section.parallax .testimonial cite span
 .tipster
   .content
     display: none
+
+.jumbotron
+  h1
+    font-size: 4rem

app/views/pages/course.html.haml

@@ -1,6 +1,30 @@
 - title! "Web Development teaching method"
 - description! "Web Dev Camp has 4 modules of 2 weeks. introduction, communication, presentation to mastery"
 
+.section
+  .row.jumbotron
+    .col-md-3
+      =image_tag "coder.jpg"
+    .col-md-9
+      %h1.display-3.centered Web Application Development
+      %p.lead.centered And all that entails
+      %hr.my-2/
+      .col-md-4
+        %h3 Programming
+        %ul
+          %li Laguages
+          %li Web technologies
+          %li Frameworks
+      .col-md-4
+        %h3 Teamwork
+        %ul
+          %li Roles
+          %li distributed Workflow
+          %li Frameworks
+
+      .col-md-4
+        %h3 Excecution
+
 .section.dark_section
   .container
     .row.white.margin-bottom-50.margin-top-30

app/views/pages/index.html.haml

@@ -12,11 +12,11 @@
 .section
   .container
     .row
-      .col-md-6
+      .col-md-12.col-lg-6
         .testimonial
-          .figure.col-md-5.col-lg-3
+          .figure.col-md-4.col-lg-4.col-sm-8.offset-sm-2.offset-md-0
             =image_tag "people/alice.jpg" , class: :rounded
-          .testimonial-content.nopadding.col-md-7.col-lg-9
+          .testimonial-content.nopadding.col-md-8.col-lg-8.col-sm-12
             %p
               When I started to teach myself code, the journey to becoming a junior developer
               seemed impossibly long and hard. Graduating from Web Dev Camp, I feel as though
@@ -25,11 +25,11 @@
             %cite
               Alice Dee
               %span former Engineer
-      .col-md-6
+      .col-md-12.col-lg-6
         .testimonial
-          .figure.col-md-5.col-lg-3
+          .figure.col-md-4.col-lg-4.col-sm-8.offset-sm-2.offset-md-0
             =image_tag "people/patricia.jpg" , class: :rounded
-          .testimonial-content.nopadding.col-md-7.col-lg-9
+          .testimonial-content.nopadding.col-md-8.col-lg-8.col-sm-12
             %p
               WebDev Camp is obviously very different from university teaching methods.
               Firstly, we worked straight away on a 'real' solution. There was no 'faffing about'.
@@ -50,11 +50,11 @@
 .section
   .container.margin-bottom-80
     .row
-      .col-md-6
+      .col-md-12.col-lg-6
         .testimonial
-          .figure.col-md-5.col-lg-3
+          .figure.col-md-4.col-lg-4.col-sm-8.offset-sm-2.offset-md-0
             =image_tag "people/zita.jpg" , class: :rounded
-          .testimonial-content.nopadding.col-md-7.col-lg-9
+          .testimonial-content.nopadding.col-md-8.col-lg-8.col-sm-12
             %p
               The whole experience of Webdev.camp has been an intensive and empowering
               learning journey for me, and not just with regard to my new skills.
@@ -63,11 +63,11 @@
             %cite
               Zita Székely
               %span former Tester
-      .col-md-6
+      .col-md-12.col-lg-6
         .testimonial
-          .figure.col-md-5.col-lg-3
+          .figure.col-md-4.col-lg-4.col-sm-8.offset-sm-2.offset-md-0
             =image_tag "people/ioana.jpg" , class: :rounded
-          .testimonial-content.nopadding.col-md-7.col-lg-9
+          .testimonial-content.nopadding.col-md-8.col-lg-8.col-sm-12
             %p
               Before I started the Web Dev Camp course, a junior developer title seemed
               like something unapproachable. Now, after graduation I know that I am one already!