Grade band pages

pegasus/sites.v3/code.org/public/css/educate.css

@@ -21,7 +21,6 @@
   width: 100%;
   color: white;
   padding: 20px;
-  border-radius: 5px;
 }
 
 .educate-h1 {
@@ -36,11 +35,21 @@
 }
 
 .educate-button {
+  background-color: #e7e8ea;
+  border-color: #c6cacd;
+  color: #5b6770;
+  border-radius: 0px;
+  font-size: 12px;
+  min-width: 120px;
   position: absolute;
   bottom: 0;
   margin-bottom: 5%;
 }
 
+.educate-button:hover { 
+  background-color: white;
+}
+
 .resources-h1 {
   text-align: center;
   margin-top: -1%;

pegasus/sites.v3/code.org/public/educate/curriculum/elementary-school.md

@@ -117,16 +117,21 @@ If you've been teaching Courses 1-4 and want to know how to transition to teachi
 
 # Express Course
 
-<div class="col-25" style="padding-right: 10px;">
+<div class="col-50" style="padding-right: 10px;">
   <a href="<%= CDO.studio_url('/s/pre-express') %>"><img src="/images/curriculum/course-tile-pre-reader-express.png"></a>
-</div>
-
-<div class="col-25" style="padding-right: 10px;">
+  <br>
+  <br>
   <a href="<%= CDO.studio_url('/s/express') %>"><img src="/images/curriculum/course-tile-express.png"></a>
 </div>
 
+[col-50]
+
 CS Fundamentals Express combines the best of Courses A-F into a single condensed course (with a simpler option for pre-readers). We recommend Courses A-F for most classrooms, but if your school only offers one computer science course or you want to have your students work through multiple courses in a single year, the Express course is a better choice. By removing the ramp up between years, the express course provides a smoother path and doesn’t repeat concepts for students. This is also our recommended option for students studying computer science on their own, outside of a classroom.
 
+[/col-50]
+
+<div style="clear:both"></div>
+
 <br>
 <br>
 <br>

pegasus/sites.v3/code.org/public/educate/curriculum/express-course.md

@@ -14,22 +14,17 @@ social:
 ---
 # Computer Science Fundamentals - Express
 
-<div class="col-33" style="padding-right: 10px;">
-  <a href="<%= CDO.studio_url('/s/express') %>"><img src="/images/curriculum/course-tile-express.png"></a>
-</div>
-
-[col-66]
-
 Computer Science Fundamentals Express is a 30 hour course designed for 9-18 year old students (with an [option for pre-readers](https://studio.code.org/s/pre-express)). It can be taught once a week in an after school club, integrated as a unit in a longer technology class, or used as an intro unit in a computer science class. Students learn to create computer programs that will help them learn to collaborate with others, develop problem-solving skills, and persist through difficult tasks. They will study programming concepts, computational thinking, digital citizenship, and develop interactive games or stories they can share. 
 
+<br>
+<center><a href="<%= CDO.studio_url('/s/express') %>"><img src="/images/curriculum/course-tile-express.png"></a></center>
+<br>
+<br>
+
 The course teaches the foundational concepts of programming using drag and drop blocks rather than a programming language such as JavaScript or Python. Blocks are an easier way to get started and many top Universities today begin their classes with block based programming.
 
 The Express Course combines the concepts taught in our [elementary school courses](/educate/curriculum/elementary-school) in an accelerated fashion designed for older students. You can download the [CS Fundamentals curriculum guide here](/files/CSF_CoursesA-F_Curriculum_Guide.pdf).
 
-[/col-66]
-
-<div style="clear:both"></div>
-
 <a id="info-sessions"></a>
 # <strong>New to teaching computer science?</strong>
 

pegasus/sites.v3/code.org/public/student/elementary.haml

@@ -0,0 +1,85 @@
+---
+title: Computer Science Curriculum for Grades K-5
+theme: responsive
+---
+
+%link{type: "text/css", href: "/css/learn-carousel.css", rel: "stylesheet"}
+= view 'mobilecheck.js'
+
+.solid-block-header
+  Grades K-5
+
+%h1 Courses by Code.org
+
+%h2 Computer Science Fundamentals Express Courses
+
+A great option for students getting started on their own.  You'll learn the 
+fundamentals of computer science with drag & drop blocks.  Create your own 
+drawings and games.
+
+%div{style: "clear: both"}
+%br
+
+.col-50{style: "padding-right: 10px;"}
+  %a{href: CDO.studio_url('/s/pre-express')}
+    %img{src: "/images/curriculum/course-tile-pre-reader-express.png"}
+
+.col-50{style: "padding-right: 10px;"}
+  %a{href: CDO.studio_url('/s/express')}
+    %img{src: "/images/curriculum/course-tile-express.png"}
+
+%div{style: "clear: both"}
+
+%h2 Computer Science Fundamentals for Elementary Schools
+
+For pre-readers in elementary school classrooms
+
+%div{style: "clear: both"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/coursea')}
+    %img{src: "/images/curriculum/course-tile-coursea.png"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/courseb')}
+    %img{src: "/images/curriculum/course-tile-courseb.png"}
+
+%div{style: "clear: both"}
+%br
+%br
+
+For older students in elementary school classrooms
+
+%div{style: "clear: both"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/coursec')}
+    %img{src: "/images/curriculum/course-tile-coursec.png"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/coursed')}
+    %img{src: "/images/curriculum/course-tile-coursed.png"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/coursee')}
+    %img{src: "/images/curriculum/course-tile-coursee.png"}
+
+.col-25
+  %a{href: CDO.studio_url('/s/coursef')}
+    %img{src: "/images/curriculum/course-tile-coursef.png"}
+
+%div{style: "clear: both"}
+
+%h2 Looking for courses in other languages?
+
+We are working on translating Courses A-F and the Express Course to languages
+beyond English. In the meantime, we recommend using
+%a{href: "/educate/curriculum/cs-fundamentals-international"} Courses 1-4 and 
+the Accelerated Course. These courses cover the same basic concepts and have 
+already been translated into 25+ languages.
+
+%hr
+
+%h1 Courses from 3rd parties
+
+= view :learn_carousels, variation:'elementary'

pegasus/sites.v3/code.org/public/student/middle-high.haml

@@ -0,0 +1,34 @@
+---
+title: Computer Science Curriculum for Grades 6-12
+theme: responsive
+---
+
+%link{type: "text/css", href: "/css/learn-carousel.css", rel: "stylesheet"}
+= view 'mobilecheck.js'
+
+.solid-block-header
+  Grades 6-12
+
+%h1 Courses by Code.org
+
+%h2 Get started with block programming
+
+.col-50
+  %a{href: CDO.studio_url('/s/express')}
+    %img{src: "/images/curriculum/course-tile-express.png"}
+
+.col-50
+  Learn the fundamentals of Computer Science with drag & drop blocks. Create
+  your own drawings and games.
+
+%div{style: "clear: both"}
+
+%h2 Learn JavaScript, HTML, and CSS
+
+= view :tools_boxes
+
+%hr
+
+%h1 Courses from 3rd parties
+
+= view :learn_carousels, variation:'middle_high'

pegasus/sites.v3/code.org/public/student/university.haml

@@ -0,0 +1,15 @@
+---
+title: Computer Science Curriculum for University+
+theme: responsive
+---
+
+%link{type: "text/css", href: "/css/learn-carousel.css", rel: "stylesheet"}
+= view 'mobilecheck.js'
+
+.solid-block-header
+  University+
+
+Code.org does not make post secondary courses, but there are great options to 
+learn computer science at any age. Here are some we recommend:
+
+= view :learn_carousels, variation:'university'