Separate print and web styles for course guides

app/styles/teachers/teacher-course-solution-view.sass

@@ -1,31 +1,49 @@
 #teacher-course-solution-view
+  .print
+    text-align: center
+    .btn a
+      color: white
 
-  background-color: white
+  #site-content-area
-  color: black
+    background-color: white
-  font-family: sans-serif
-  margin: 0px
-  padding: 24px
-
-  hr
-    display: block
-    border-style: inset
-    border-width: 1px
-
-  h1, h2, h3, h4, h5
     color: black
     font-family: sans-serif
-    font-variant: normal
+    margin: 0px
-    margin: 20px 0px
+    padding: 24px
 
-  h4
+    hr
-    color: gray
+      display: block
+      border-style: inset
+      border-width: 1px
 
-  img
+    h1, h2, h3, h4, h5
-    display: block
+      color: black
-    margin: auto
+      font-family: sans-serif
+      font-variant: normal
+      margin: 20px 0px
 
-  p
+    h4
-    margin: 16px 0px
+      color: gray
 
-  .page-break-before
+    img
-    page-break-before: always
+      display: block
+      margin: auto
+
+    p
+      margin: 16px 0px
+
+    .page-break-before
+      page-break-before: always
+
+    @media screen
+      max-width: 900px
+      background-color: #f8f8f8
+      border-radius: 10px
+      border: 1px solid #ddd
+      padding: 40px 100px
+      font-size: 0.85em
+      margin: 20px auto
+
+  @media print
+    #main-nav, #teacher-dashboard-nav, #footer, #final-footer, .do-not-print
+      display: none

app/templates/teachers/teacher-course-solution-view.jade

@@ -1,3 +1,17 @@
+extends /templates/base-flat
+
+block page_nav
+  include ../courses/teacher-dashboard-nav.jade
+  .do-not-print.container
+    span.backlink
+      a(href='/teachers/courses')
+        |< Back to Course Guides
+    .print
+      .btn.btn-md.btn-navy
+        a(href='javascript:window.print()')
+          span.glyphicon.glyphicon-print  
+          |Print this guide
+
 block content
 
   if !me.isTeacher() && !me.isAdmin()