Merge remote-tracking branch 'origin/master' into course_start

Conflicts:
	common/lib/xmodule/xmodule/course_module.py
	lms/urls.py

cms/djangoapps/contentstore/tests/tests.py

@@ -4,45 +4,165 @@ from django.test import TestCase
 from mock import patch, Mock
 from override_settings import override_settings
 from django.conf import settings
+from django.core.urlresolvers import reverse
+
+from student.models import Registration
+from django.contrib.auth.models import User
+
 
 def parse_json(response):
     """Parse response, which is assumed to be json"""
     return json.loads(response.content)
 
+
+def user(email):
+    '''look up a user by email'''
+    return User.objects.get(email=email)
+
+def registration(email):
+    '''look up registration object by email'''
+    return Registration.objects.get(user__email=email)
+
 class AuthTestCase(TestCase):
     """Check that various permissions-related things work"""
 
-    def test_index(self):
-        """Make sure the main page loads."""
-        resp = self.client.get('/')
-        self.assertEqual(resp.status_code, 200)
+    def setUp(self):
+        self.email = 'a@b.com'
+        self.pw = 'xyz'
+        self.username = 'testuser'
 
-    def test_signup_load(self):
-        """Make sure the signup page loads."""
-        resp = self.client.get('/signup')
-        self.assertEqual(resp.status_code, 200)
-
-
-    def test_create_account(self):
+    def check_page_get(self, url, expected):
+        resp = self.client.get(url)
+        self.assertEqual(resp.status_code, expected)
+        return resp
+        
+    def test_public_pages_load(self):
+        """Make sure pages that don't require login load without error."""
+        pages = (
+                 reverse('login'),
+                 reverse('signup'),
+                 )
+        for page in pages:
+            print "Checking '{0}'".format(page)
+            self.check_page_get(page, 200)
 
+    def test_create_account_errors(self):
         # No post data -- should fail
         resp = self.client.post('/create_account', {})
         self.assertEqual(resp.status_code, 200)
         data = parse_json(resp)
         self.assertEqual(data['success'], False)
-        
-        # Should work
+
+    def _create_account(self, username, email, pw):
+        '''Try to create an account.  No error checking'''
         resp = self.client.post('/create_account', {
-            'username': 'user',
-            'email': 'a@b.com',
-            'password': 'xyz',
+            'username': username,
+            'email': email,
+            'password': pw,
             'location' : 'home',
             'language' : 'Franglish',
             'name' : 'Fred Weasley',
             'terms_of_service' : 'true',
             'honor_code' : 'true'})
+        return resp
+
+    def create_account(self, username, email, pw):
+        '''Create the account and check that it worked'''
+        resp = self._create_account(username, email, pw)
         self.assertEqual(resp.status_code, 200)
         data = parse_json(resp)
         self.assertEqual(data['success'], True)
+
+        # Check both that the user is created, and inactive
+        self.assertFalse(user(self.email).is_active)
+
+        return resp
+
+    def _activate_user(self, email):
+        '''look up the user's activation key in the db, then hit the activate view.
+        No error checking'''
+        activation_key = registration(email).activation_key
+
+        # and now we try to activate
+        resp = self.client.get(reverse('activate', kwargs={'key': activation_key}))
+        return resp
+
+    def activate_user(self, email):
+        resp = self._activate_user(email)
+        self.assertEqual(resp.status_code, 200)
+        # Now make sure that the user is now actually activated
+        self.assertTrue(user(self.email).is_active)
+
+    def test_create_account(self):
+        self.create_account(self.username, self.email, self.pw)
+        self.activate_user(self.email)
+
+
+    def _login(self, email, pw):
+        '''Login.  View should always return 200.  The success/fail is in the
+        returned json'''
+        resp = self.client.post(reverse('login_post'),
+                                {'email': email, 'password': pw})
+        self.assertEqual(resp.status_code, 200)
+        return resp
+
+
+    def login(self, email, pw):
+        '''Login, check that it worked.'''
+        resp = self._login(self.email, self.pw)
+        data = parse_json(resp)
+        self.assertTrue(data['success'])
+        return resp
+
+    def test_login(self):
+        self.create_account(self.username, self.email, self.pw)
+
+        # Not activated yet.  Login should fail.
+        resp = self._login(self.email, self.pw)
+        data = parse_json(resp)
+        self.assertFalse(data['success'])
         
+        self.activate_user(self.email)
+
+        # Now login should work
+        self.login(self.email, self.pw)
+
+    def test_private_pages_auth(self):
+        """Make sure pages that do require login work."""
+        auth_pages = (
+            reverse('index'),
+            reverse('edit_item'),
+            reverse('save_item'),
+            )
+
+        # These are pages that should just load when the user is logged in
+        # (no data needed)
+        simple_auth_pages = (
+            reverse('index'),
+            )
+
+        # need an activated user
+        self.test_create_account()
+
+        # Not logged in.  Should redirect to login.
+        print 'Not logged in'
+        for page in auth_pages:
+            print "Checking '{0}'".format(page)
+            self.check_page_get(page, expected=302)
+
+        # Logged in should work.
+        self.login(self.email, self.pw)
+
+        print 'Logged in'
+        for page in simple_auth_pages:
+            print "Checking '{0}'".format(page)
+            self.check_page_get(page, expected=200)
         
+
+    def test_index_auth(self):
+
+        # not logged in.  Should return a redirect.
+        resp = self.client.get(reverse('index'))
+        self.assertEqual(resp.status_code, 302)
+
+        # Logged in should work.

cms/djangoapps/contentstore/views.py

@@ -2,6 +2,7 @@ from util.json_request import expect_json
 import json
 
 from django.http import HttpResponse
+from django.contrib.auth.decorators import login_required
 from django.core.context_processors import csrf
 from django_future.csrf import ensure_csrf_cookie
 from django.core.urlresolvers import reverse
@@ -13,7 +14,27 @@ from github_sync import export_to_github
 from mitxmako.shortcuts import render_to_response
 from xmodule.modulestore.django import modulestore
 
+# ==== Public views ==================================================
 
+@ensure_csrf_cookie
+def signup(request):
+    """
+    Display the signup form.
+    """
+    csrf_token = csrf(request)['csrf_token']
+    return render_to_response('signup.html', {'csrf': csrf_token }) 
+
+@ensure_csrf_cookie
+def login_page(request):
+    """
+    Display the login form.
+    """
+    csrf_token = csrf(request)['csrf_token']
+    return render_to_response('login.html', {'csrf': csrf_token }) 
+    
+# ==== Views for any logged-in user ==================================
+
+@login_required
 @ensure_csrf_cookie
 def index(request):
     courses = modulestore().get_items(['i4x', None, None, 'course', None])
@@ -26,26 +47,34 @@ def index(request):
                     for course in courses]
     })
 
+# ==== Views with per-item permissions================================
 
-@ensure_csrf_cookie
-def signup(request):
-    """
-    Display the signup form.
-    """
-    csrf_token = csrf(request)['csrf_token']
-    return render_to_response('signup.html', {'csrf': csrf_token }) 
+def has_access(user, location):
+    '''Return True if user allowed to access this piece of data'''
+    # TODO (vshnayder): actually check perms
+    return user.is_active and user.is_authenticated
 
+@login_required
 @ensure_csrf_cookie
 def course_index(request, org, course, name):
+    location = ['i4x', org, course, 'course', name]
+    if not has_access(request.user, location):
+        raise Http404  # TODO (vshnayder): better error
+    
     # TODO (cpennington): These need to be read in from the active user
-    course = modulestore().get_item(['i4x', org, course, 'course', name])
+    course = modulestore().get_item(location)
     weeks = course.get_children()
     return render_to_response('course_index.html', {'weeks': weeks})
 
-
+@login_required
 def edit_item(request):
-    item_id = request.GET['id']
-    item = modulestore().get_item(item_id)
+    # TODO (vshnayder): change name from id to location in coffee+html as well.
+    item_location = request.GET['id']
+    print item_location, request.GET
+    if not has_access(request.user, item_location):
+        raise Http404  # TODO (vshnayder): better error
+        
+    item = modulestore().get_item(item_location)
     return render_to_response('unit.html', {
         'contents': item.get_html(),
         'js_module': item.js_module_name(),
@@ -54,18 +83,39 @@ def edit_item(request):
     })
 
 
+def user_author_string(user):
+    '''Get an author string for commits by this user.  Format:
+    first last <email@email.com>.
+
+    If the first and last names are blank, uses the username instead.
+    Assumes that the email is not blank.
+    '''
+    f = user.first_name
+    l = user.last_name
+    if f == '' and l == '':
+        f = user.username
+    return '{first} {last} <{email}>'.format(first=f,
+                                             last=l,
+                                             email=user.email)
+
+@login_required
 @expect_json
 def save_item(request):
-    item_id = request.POST['id']
+    item_location = request.POST['id']
+    if not has_access(request.user, item_location):
+        raise Http404  # TODO (vshnayder): better error
+
     data = json.loads(request.POST['data'])
-    modulestore().update_item(item_id, data)
+    modulestore().update_item(item_location, data)
 
     # Export the course back to github
     # This uses wildcarding to find the course, which requires handling
     # multiple courses returned, but there should only ever be one
-    course_location = Location(item_id)._replace(category='course', name=None)
+    course_location = Location(item_location)._replace(
+        category='course', name=None)
     courses = modulestore().get_items(course_location, depth=None)
     for course in courses:
-        export_to_github(course, "CMS Edit")
+        author_string = user_author_string(request.user)
+        export_to_github(course, "CMS Edit", author_string)
 
     return HttpResponse(json.dumps({}))

cms/djangoapps/github_sync/__init__.py

@@ -38,7 +38,12 @@ def import_from_github(repo_settings):
     return git_repo.head.commit.hexsha, module_store.courses[course_dir]
 
 
-def export_to_github(course, commit_message):
+def export_to_github(course, commit_message, author_str=None):
+    '''
+    Commit any changes to the specified course with given commit message,
+    and push to github (if MITX_FEATURES['GITHUB_PUSH'] is True).
+    If author_str is specified, uses it in the commit.
+    '''
     repo_path = settings.DATA_DIR / course.metadata.get('course_dir', course.location.course)
     fs = OSFS(repo_path)
     xml = course.export_to_xml(fs)
@@ -49,8 +54,11 @@ def export_to_github(course, commit_message):
     git_repo = Repo(repo_path)
     if git_repo.is_dirty():
         git_repo.git.add(A=True)
-        git_repo.git.commit(m=commit_message)
-
+        if author_str is not None:
+            git_repo.git.commit(m=commit_message, author=author_str)
+        else:
+            git_repo.git.commit(m=commit_message)
+        
         origin = git_repo.remotes.origin
         if settings.MITX_FEATURES['GITHUB_PUSH']:
             push_infos = origin.push()

cms/djangoapps/github_sync/views.py

@@ -49,4 +49,4 @@ def github_post_receive(request):
     revision, course = import_from_github(repo)
     export_to_github(course, repo['path'], "Changes from cms import of revision %s" % revision)
 
-    return HttpResponse('Push recieved')
+    return HttpResponse('Push received')

cms/envs/common.py

@@ -70,6 +70,10 @@ TEMPLATE_DIRS = (
 
 MITX_ROOT_URL = ''
 
+LOGIN_REDIRECT_URL = MITX_ROOT_URL + '/login'
+LOGIN_URL = MITX_ROOT_URL + '/login'
+
+
 TEMPLATE_CONTEXT_PROCESSORS = (
     'django.core.context_processors.request',
     'django.core.context_processors.static',

cms/envs/dev.py

@@ -29,39 +29,37 @@ DATABASES = {
     }
 }
 
-REPO_ROOT = ENV_ROOT / "content"
-
 REPOS = {
     'edx4edx': {
-        'path': REPO_ROOT / "edx4edx",
+        'path': DATA_DIR / "edx4edx",
         'org': 'edx',
         'course': 'edx4edx',
         'branch': 'for_cms',
         'origin': 'git@github.com:MITx/edx4edx.git',
     },
     '6002x-fall-2012': {
-        'path': REPO_ROOT / '6002x-fall-2012',
+        'path': DATA_DIR / '6002x-fall-2012',
         'org': 'mit.edu',
         'course': '6.002x',
         'branch': 'for_cms',
         'origin': 'git@github.com:MITx/6002x-fall-2012.git',
     },
     '6.00x': {
-        'path': REPO_ROOT / '6.00x',
+        'path': DATA_DIR / '6.00x',
         'org': 'mit.edu',
         'course': '6.00x',
         'branch': 'for_cms',
         'origin': 'git@github.com:MITx/6.00x.git',
     },
     '7.00x': {
-        'path': REPO_ROOT / '7.00x',
+        'path': DATA_DIR / '7.00x',
         'org': 'mit.edu',
         'course': '7.00x',
         'branch': 'for_cms',
         'origin': 'git@github.com:MITx/7.00x.git',
     },
     '3.091x': {
-        'path': REPO_ROOT / '3.091x',
+        'path': DATA_DIR / '3.091x',
         'org': 'mit.edu',
         'course': '3.091x',
         'branch': 'for_cms',

cms/templates/activation_active.html

@@ -1,4 +1,4 @@
-<%inherit file="marketing.html" />
+<%inherit file="base.html" />
 
 <%block name="content">
 
@@ -7,8 +7,7 @@
 
 <section class="activation">
   <h1>Account already active!</h1>
-  <p> This account has already been activated. You can log in at
-  the <a href="/">home page</a>.</p>
+  <p> This account has already been activated. <a href="/login">Log in here</a>.</p>
 </div>
 </section>
 

cms/templates/activation_complete.html

@@ -1,12 +1,11 @@
-<%inherit file="marketing.html" />
-
+<%inherit file="base.html" />
 
 <%block name="content">
 
 <section class="tos">
 <div>
   <h1>Activation Complete!</h1>
-  <p>Thanks for activating your account. You can log in at the <a href="/">home page</a>.</p>
+  <p>Thanks for activating your account. <a href="/login">Log in here</a>.</p>
 </div>
 </section>
 

cms/templates/activation_invalid.html

@@ -1,4 +1,4 @@
-<%inherit file="marketing.html" />
+<%inherit file="base.html" />
 
 <%block name="content">
 <section class="tos">

cms/templates/login.html

@@ -1,11 +1,76 @@
-<form name="login" action="login", method="post">
-    <input type="hidden" name="csrfmiddlewaretoken" value="${csrf_token}"/>
+<%inherit file="base.html" />
+<%! from django.core.urlresolvers import reverse %>
+<%block name="title">Log in</%block>
 
-    % if next is not None:
-    <input type="hidden" name="next" value="${next}"/>
-    % endif
+<%block name="content">
 
-    Username: <input type="text" name="username" />
-    Possword: <input type="password" name="password" />
-    <input type="submit" value="Submit" />
-</form>
+<section class="main-container">
+
+  <section class="main-content">
+    <header>
+      <h3>Log in</h3>
+      <hr>
+    </header>
+
+    <form id="login_form" action="login_post" method="post">
+      <label>E-mail</label>
+      <input name="email" type="email" placeholder="E-mail">
+      <label>Password</label>
+      <input name="password" type="password" placeholder="Password">
+      <label class="remember-me">
+        <input name="remember" type="checkbox">
+        Remember me
+      </label>
+      <div class="submit">
+        <input name="submit" type="submit" value="Submit">
+      </div>
+    </form>
+
+    <section class="login-extra">
+      <p>
+        <span>Not enrolled? <a href="${reverse('signup')}">Sign up.</a></span>
+        <a href="#" class="pwd-reset">Forgot password?</a>
+      </p>
+    </section>
+
+
+  </section>
+
+</section>
+
+<script type="text/javascript">
+(function() {
+   function getCookie(name) {
+     return $.cookie(name);
+   }
+   function postJSON(url, data, callback) {
+     $.ajax({type:'POST',
+       url: url,
+       dataType: 'json',
+       data: data,
+       success: callback,
+       headers : {'X-CSRFToken':getCookie('csrftoken')}
+     });
+   }
+
+   $('form#login_form').submit(function(e) {
+     e.preventDefault();
+     var submit_data = $('#login_form').serialize();
+
+     postJSON('/login_post',
+       submit_data,
+       function(json) {
+       if(json.success) {
+        location.href="${reverse('index')}";
+        } else if($('#login_error').length == 0) {
+        $('#login_form').prepend('<div id="login_error">Email or password is incorrect.</div>');
+        } else {
+        $('#login_error').stop().css("background-color", "#933").animate({ backgroundColor: "#333"}, 2000);
+        }
+        }
+        );
+     });
+})(this)
+</script>
+      
+</%block>

cms/templates/marketing.html

@@ -1 +0,0 @@
-<%inherit file="base.html" />

cms/templates/registration/reg_complete.html

@@ -0,0 +1,3 @@
+<h1>Check your email</h1>
+<p>An activation link has been sent to ${ email }, along with
+instructions for activating your account.</p>

cms/templates/widgets/header.html

@@ -1,6 +1,7 @@
+<%! from django.core.urlresolvers import reverse %>
 <header>
   <nav>
-    <h2><a href="/">6.002x circuits and electronics</a></h2>
+    <h2><a href="/">edX CMS: TODO:-course-name-here</a></h2>
     <ul>
       <li>
         <a href="#" class="new-module wip">New Module</a>
@@ -13,6 +14,12 @@
     <ul class="user-nav">
       <li><a href="#" class="wip">Tasks</a></li>
       <li><a href="#" class="wip">Settings</a></li>
+      % if user.is_authenticated():
+         <li><a href="${reverse('logout')}">Log out</a></li>
+      % else:
+         <li><a href="${reverse('login')}">Log in</a></li>
+      % endif
+
     </ul>
   </nav>
 </header>

cms/urls.py

@@ -11,16 +11,25 @@ urlpatterns = ('',
     url(r'^$', 'contentstore.views.index', name='index'),
     url(r'^edit_item$', 'contentstore.views.edit_item', name='edit_item'),
     url(r'^save_item$', 'contentstore.views.save_item', name='save_item'),
-    url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)$', 'contentstore.views.course_index', name='course_index'),
+    url(r'^(?P<org>[^/]+)/(?P<course>[^/]+)/course/(?P<name>[^/]+)$',
+        'contentstore.views.course_index', name='course_index'),
     url(r'^github_service_hook$', 'github_sync.views.github_post_receive'),
 )
 
 # User creation and updating views
 urlpatterns += (
-    url(r'^signup$', 'contentstore.views.signup'),
+    url(r'^signup$', 'contentstore.views.signup', name='signup'),
 
     url(r'^create_account$', 'student.views.create_account'),
-    url(r'^activate/(?P<key>[^/]*)$', 'student.views.activate_account'),
+    url(r'^activate/(?P<key>[^/]*)$', 'student.views.activate_account', name='activate'),
+
+    # form page
+    url(r'^login$', 'contentstore.views.login_page', name='login'),
+    # ajax view that actually does the work
+    url(r'^login_post$', 'student.views.login_user', name='login_post'),
+
+    url(r'^logout$', 'student.views.logout_user', name='logout'),
+
     )
 
 if settings.DEBUG:

common/djangoapps/student/views.py

@@ -147,12 +147,12 @@ def create_account(request, post_override=None):
             js['value'] = "Error (401 {field}). E-mail us.".format(field=a)
             return HttpResponse(json.dumps(js))
 
-    if 'honor_code' not in post_vars or post_vars['honor_code'] != u'true':
+    if post_vars.get('honor_code', 'false') != u'true':
         js['value']="To enroll, you must follow the honor code.".format(field=a)
         return HttpResponse(json.dumps(js))
 
 
-    if 'terms_of_service' not in post_vars or post_vars['terms_of_service'] != u'true':
+    if post_vars.get('terms_of_service', 'false') != u'true':
         js['value']="You must accept the terms of service.".format(field=a)
         return HttpResponse(json.dumps(js))
 

common/lib/capa/capa/capa_problem.py

@@ -22,6 +22,7 @@ import random
 import re
 import scipy
 import struct
+import sys
 
 from lxml import etree
 from xml.sax.saxutils import unescape
@@ -78,7 +79,7 @@ class LoncapaProblem(object):
          - id           (string): identifier for this problem; often a filename (no spaces)
          - state        (dict): student state
          - seed         (int): random number generator seed (int)
-         - system       (I4xSystme): I4xSystem instance which provides OS, rendering, and user context 
+         - system       (I4xSystem): I4xSystem instance which provides OS, rendering, and user context 
 
         '''
 
@@ -196,7 +197,7 @@ class LoncapaProblem(object):
 
         Thus, for example, input_ID123 -> ID123, and input_fromjs_ID123 -> fromjs_ID123
 
-        Calles the Response for each question in this problem, to do the actual grading.
+        Calls the Response for each question in this problem, to do the actual grading.
         '''
         self.student_answers = answers
         oldcmap = self.correct_map				# old CorrectMap
@@ -276,6 +277,34 @@ class LoncapaProblem(object):
                 parent.remove(inc)
                 log.debug('Included %s into %s' % (file, self.problem_id))
 
+    def _extract_system_path(self, script):
+        '''
+        Extracts and normalizes additional paths for code execution.
+        For now, there's a default path of data/course/code; this may be removed
+        at some point.
+        '''
+
+        DEFAULT_PATH = ['code']
+
+        # Separate paths by :, like the system path.
+        raw_path = script.get('system_path', '').split(":") + DEFAULT_PATH
+
+        # find additional comma-separated modules search path
+        path = []
+
+        for dir in raw_path:
+
+            if not dir:
+                continue
+
+            # path is an absolute path or a path relative to the data dir
+            dir = os.path.join(self.system.filestore.root_path, dir)
+            abs_dir = os.path.normpath(dir)
+            log.debug("appending to path: %s" % abs_dir)
+            path.append(abs_dir)
+        
+        return path
+    
     def _extract_context(self, tree, seed=struct.unpack('i', os.urandom(4))[0]):  # private
         '''
         Extract content of <script>...</script> from the problem.xml file, and exec it in the
@@ -291,7 +320,20 @@ class LoncapaProblem(object):
         context['the_lcp'] = self                		# pass instance of LoncapaProblem in
         context['script_code'] = ''
 
-        for script in tree.findall('.//script'):
+        self._execute_scripts(tree.findall('.//script'), context)
+
+        return context
+
+    def _execute_scripts(self, scripts, context):
+        ''' 
+        Executes scripts in the given context.
+        '''
+        original_path = sys.path
+
+        for script in scripts:
+
+            sys.path = original_path + self._extract_system_path(script)
+
             stype = script.get('type')
             if stype:
                 if 'javascript' in stype:
@@ -308,7 +350,8 @@ class LoncapaProblem(object):
             except Exception:
                 log.exception("Error while execing script code: " + code)
                 raise responsetypes.LoncapaProblemError("Error while executing script code")
-        return context
+            finally:
+                sys.path = original_path
 
     def _extract_html(self, problemtree):  # private
         '''

common/lib/xmodule/xmodule/course_module.py

@@ -42,6 +42,10 @@ class CourseDescriptor(SequenceDescriptor):
     @property
     def title(self):
         return self.metadata['display_name']
+    
+    @property
+    def number(self):
+        return self.location.course
 
     @property
     def instructors(self):
@@ -79,7 +83,7 @@ class CourseDescriptor(SequenceDescriptor):
                             'requirements', 'syllabus', 'textbook', 'faq', 'more_info', 'number', 'instructors']:
             try:
                 with self.system.resources_fs.open(path("about") / section_key + ".html") as htmlFile:
-                    return htmlFile.read()
+                    return htmlFile.read().decode('utf-8')
             except ResourceNotFoundError:
                 log.exception("Missing about section {key} in course {url}".format(key=section_key, url=self.location.url()))
                 return "! About section missing !"
@@ -108,7 +112,7 @@ class CourseDescriptor(SequenceDescriptor):
         if section_key in ['handouts', 'guest_handouts', 'updates', 'guest_updates']:
             try:
                 with self.system.resources_fs.open(path("info") / section_key + ".html") as htmlFile:
-                    return htmlFile.read()
+                    return htmlFile.read().decode('utf-8')
             except ResourceNotFoundError:
                 log.exception("Missing info section {key} in course {url}".format(key=section_key, url=self.location.url()))
                 return "! Info section missing !"

doc/development.md

@@ -0,0 +1,30 @@
+# Running the CMS
+
+One can start the CMS by running `rake cms`. This will run the server on localhost
+port 8001.
+
+However, the server also needs data to work from.
+
+## Installing Mongodb
+
+Please see http://www.mongodb.org/downloads for more detailed instructions.
+
+### Ubuntu
+
+    sudo apt-get install mongodb
+
+### OSX
+
+Use the MacPorts package `mongodb` or the Homebrew formula `mongodb`
+
+## Initializing Mongodb
+
+Check out the course data directories that you want to work with into the
+`GITHUB_REPO_ROOT` (by default, `../data`). Then run the following command:
+
+
+    rake django-admin[import,cms,dev,../data]
+
+Replace `../data` with your `GITHUB_REPO_ROOT` if it's not the default value.
+
+This will import all courses in your data directory into mongodb

doc/overview.md

@@ -108,7 +108,7 @@ environments, defined in `cms/envs`.
 
 - javascript -- we use coffeescript, which compiles to js, and is much nicer to work with.  Look for `*.coffee` files.  We use _jasmine_ for testing js.
 
-- _mako_  -- we use this for templates, and have a fork called mitxmako (TODO: why did we have to fork mako?)
+- _mako_  -- we use this for templates, and have wrapper called mitxmako that makes mako look like the django templating calls.
 
 We use a fork of django-pipeline to make sure that the js and css always reflect the latest `*.coffee` and `*.sass` files (We're hoping to get our changes merged in the official version soon).  This works differently in development and production.  Test uses the production settings.  
 

lms/envs/test.py

@@ -95,7 +95,7 @@ for static_dir in STATICFILES_DIRS:
     except ValueError:
         data_dir = static_dir
 
-    if not data_dir.startswith(REPO_ROOT):
+    if data_dir.startswith(REPO_ROOT):
         new_staticfiles_dirs.append(static_dir)
 STATICFILES_DIRS = new_staticfiles_dirs
 

lms/static/sass/_about_pages.scss

@@ -1,5 +1,5 @@
 .container.about {
-  padding: 20px 0 120px;
+  padding: 20px 10px 120px;
 
   > nav {
     margin-bottom: 80px;
@@ -51,6 +51,7 @@
       }
 
       .photo {
+        @include box-sizing(border-box);
         background: rgb(255,255,255);
         border: 1px solid rgb(210,210,210);
         padding: 1px;
@@ -64,6 +65,11 @@
         }
       }
 
+      > article {
+        float: left;
+        width: flex-grid(8);
+      }
+
       &.left {
         .photo {
           float: left;

lms/static/sass/_course_about.scss

@@ -24,8 +24,9 @@
       @include clearfix;
       margin: 0 auto;
       max-width: 1200px;
+      padding: 0px 10px;
       position: relative;
-      width: flex-grid(12);
+      width: grid-width(12);
       z-index: 2;
 
 
@@ -243,12 +244,12 @@
     border: 1px solid rgb(200,200,200);
     border-top: none;
     float: left;
-    padding: 20px 20px 30px;
+    padding: 16px 20px 30px;
     width: flex-grid(4);
 
     header {
       margin-bottom: 30px;
-      padding-bottom: 20px;
+      padding-bottom: 16px;
       position: relative;
       text-align: center;
 
@@ -358,18 +359,42 @@
         margin-bottom: 20px;
         padding-bottom: 10px;
 
+        &:hover {
+          .icon {
+            opacity: 1;
+          }
+        }
+
         p {
           color: $lighter-base-font-color;
           float: left;
           font-family: $sans-serif;
         }
 
-        img {
-          background: rgb(230,230,230);
+        .icon {
+          background-size: cover;
           float: left;
           height: 19px;
-          margin: 3px 10px 0 0;
+          margin: 2px 10px 0 0;
+          opacity: 0.6;
+          @include transition(all, 0.15s, linear);
           width: 19px;
+
+          &.start-icon {
+            @include background-image(url('/static/images/portal-icons/calendar-icon.png'));
+          }
+
+          &.final-icon {
+            @include background-image(url('/static/images/portal-icons/pencil-icon.png'));
+          }
+
+          &.length-icon {
+            @include background-image(url('/static/images/portal-icons/chart-icon.png'));
+          }
+
+          &.number-icon {
+            @include background-image(url('/static/images/portal-icons/course-info-icon.png'));
+          }
         }
 
         span {

lms/static/sass/_courses.scss

@@ -4,7 +4,7 @@
 
   header.search {
     background: rgb(240,240,240);
-    @include background-image(url('/static/images/shot-2-large.jpg'));
+    //@include background-image(url('/static/images/shot-2-large.jpg'));
     background-size: cover;
     border-bottom: 1px solid rgb(100,100,100);
     @include box-shadow(inset 0 -1px 8px 0 rgba(0,0,0, 0.2), inset 0 1px 12px 0 rgba(0,0,0, 0.3));

lms/static/sass/_dashboard.scss

@@ -30,29 +30,62 @@
 
         > ul {
           background: rgb(250,250,250);
-          border: 1px solid rgb(220,220,220);
+          border: 1px solid rgb(200,200,200);
           border-top: none;
           @include border-bottom-radius(4px);
           @include box-sizing(border-box);
+          @include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.15));
           @include clearfix;
           margin: 0px;
-          padding: 0px 10px 20px;
+          padding: 20px 10px 10px;
           width: flex-grid(12);
 
           li {
+            @include clearfix;
+            border-bottom: 1px dotted rgb(220,220,220);
             list-style: none;
+            margin-bottom: 20px;
+            padding-bottom: 10px;
 
-            p {
-              color: $lighter-base-font-color;
-              font-family: $sans-serif;
-              text-shadow: 0 1px rgba(255,255,255, 0.8);
-
-              span {
-                font-weight: 700;
-                margin-left: 10px;
-                text-transform: none;
+            &:hover {
+              .title .icon {
+                opacity: 1;
               }
             }
+
+            span.title {
+              color: $lighter-base-font-color;
+              float: left;
+              font-family: $sans-serif;
+
+              .icon {
+                background-size: cover;
+                float: left;
+                height: 19px;
+                margin: 2px 8px 0 0;
+                opacity: 0.6;
+                @include transition(all, 0.15s, linear);
+                width: 19px;
+
+                &.email-icon {
+                  @include background-image(url('/static/images/portal-icons/email-icon.png'));
+                }
+
+                &.location-icon {
+                  @include background-image(url('/static/images/portal-icons/home-icon.png'));
+                }
+
+                &.language-icon {
+                  @include background-image(url('/static/images/portal-icons/language-icon.png'));
+                }
+              }
+            }
+
+            span.data {
+              color: $lighter-base-font-color;
+              font-weight: 700;
+              margin-left: 12px;
+            }
           }
         }
       }
@@ -254,9 +287,11 @@
 
 
           .course-work-icon {
-            background: rgb(200,200,200);
+            @include background-image(url('/static/images/portal-icons/pencil-icon.png'));
+            background-size: cover;
             float: left;
             height: 22px;
+            opacity: 0.7;
             width: 22px;
           }
 
@@ -280,7 +315,7 @@
 
           .progress {
             @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
-            left: 40px;
+            left: 35px;
             position: absolute;
             right: 130px;
 

lms/static/sass/_home.scss

@@ -17,6 +17,7 @@
       @extend .animation-home-header-pop-up;
       max-width: 1200px;
       margin: 0 auto;
+      padding: 0 10px;
       position: relative;
       text-align: center;
 
@@ -32,7 +33,7 @@
       border: 1px solid rgb(100,100,100);
       @include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
       @include inline-block;
-      padding: 30px 50px 30px;
+      padding: 20px 30px 30px;
       position: relative;
       text-align: center;
       z-index: 1;
@@ -40,22 +41,10 @@
 
     .title {
       @include inline-block;
-      margin-right: 50px;
-      padding-right: 50px;
       position: relative;
       text-align: left;
       vertical-align: middle;
 
-      &::before {
-        @extend .faded-vertical-divider;
-        content: "";
-        display: block;
-        height: 170px;
-        position: absolute;
-        right: 0px;
-        top: -20px;
-      }
-
       &::after {
         @extend .faded-vertical-divider-light;
         content: "";
@@ -99,66 +88,139 @@
         }
       }
 
-      .social-sharing {
+      .secondary-actions {
         @include box-sizing(border-box);
+        @include clearfix;
         float: left;
-        height: 44px;
-        position: relative;
-        text-align: center;
+        height: 47px;
         width: flex-grid(6);
 
-        &:hover {
-          .sharing-message {
-            opacity: 1;
-            top: 56px;
-          }
-        }
-
-        .sharing-message {
-          @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
-                                                            rgba(0,0,0, 0.7) 100%));
-          border: 1px solid rgba(0,0,0, 0.5);
-          @include border-radius(4px);
-          @include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
+        a.intro-video {
+          background: rgb(245,245,245);
+          @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(235,235,235)));
+          border: 1px solid rgb(200,200,200);
+          @include border-radius(30px);
           @include box-sizing(border-box);
-          color: rgb(255,255,255);
-          float: right;
-          font-family: $serif;
-          font-size: 0.9em;
-          font-style: italic;
-          left: 50%;
-          margin-left: -110px;
-          opacity: 0;
-          padding: 6px 10px;
-          position: absolute;
-          text-align: center;
-          @include transition(all, 0.15s, ease-out);
-          top: 65px;
-          width: 220px;
+          @include box-shadow(inset 0 -1px 0 0 rgba(255,255,255, 0.8), inset 0 1px 0 0 rgba(255,255,255, 0.8));
+          @include clearfix;
+          display: block;
+          float: left;
+          height: 100%;
+          overflow: hidden;
+          text-align: middle;
+          width: flex-grid(6);
 
           &:hover {
-            opacity: 0;
+            text-decoration: none;
+
+            p {
+              color: $base-font-color;
+            }
+
+            .video {
+              opacity: 1;
+            }
+          }
+
+          .video {
+            @include background-image(url('/static/images/shot-2-large.jpg'));
+            background-size: cover;
+            border-right: 1px solid rgb(200,200,200);
+            @include border-left-radius(30px);
+            @include box-shadow(1px 0 0 0 rgba(255,255,255, 0.6), inset 1px 0 0 0 rgba(255,255,255, 0.8), inset 0 0 0 1px rgba(255,255,255, 0.7));
+            float: left;
+            height: 100%;
+            opacity: 0.8;
+            position: relative;
+            @include transition(all, 0.15s, linear);
+            width: 60px;
+            vertical-align: middle;
+
+            .play {
+              @include background-image(url('/static/images/portal-icons/video-play-icon.png'));
+              background-size: cover;
+              height: 31px;
+              margin-left: -13px;
+              margin-top: -15px;
+              left: 50%;
+              position: absolute;
+              top: 50%;
+              width: 31px;
+            }
+          }
+
+          p {
+            color: $lighter-base-font-color;
+            font-style: italic;
+            padding-top: 10px;
+            text-align: center;
+            text-shadow: 0 1px rgba(255,255,255, 0.6);
+            @include transition(all, 0.15s, linear);
+            vertical-align: middle;
           }
         }
-
-        .share {
+        .social-sharing {
+          @include box-sizing(border-box);
+          float: left;
           height: 44px;
-          @include inline-block;
-          margin-right: 10px;
-          opacity: 0.5;
-          @include transition(all, 0.15s, linear);
-          width: 44px;
+          margin-right: flex-gutter();
+          position: relative;
+          text-align: center;
+          width: flex-grid(6);
 
           &:hover {
-            opacity: 1;
+            .sharing-message {
+              opacity: 1;
+              top: 56px;
+            }
           }
 
-          img {
-            width: 100%;
+          .sharing-message {
+            @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
+                                                              rgba(0,0,0, 0.7) 100%));
+            border: 1px solid rgba(0,0,0, 0.5);
+            @include border-radius(4px);
+            @include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5));
+            @include box-sizing(border-box);
+            color: rgb(255,255,255);
+            float: right;
+            font-family: $serif;
+            font-size: 0.9em;
+            font-style: italic;
+            left: 50%;
+            margin-left: -110px;
+            opacity: 0;
+            padding: 6px 10px;
+            position: absolute;
+            text-align: center;
+            @include transition(all, 0.15s, ease-out);
+            top: 65px;
+            width: 220px;
+
+            &:hover {
+              opacity: 0;
+            }
           }
 
-          &:last-child {
-            margin-right: 0px;
+          .share {
+            height: 44px;
+            @include inline-block;
+            margin-right: 10px;
+            opacity: 0.5;
+            @include transition(all, 0.15s, linear);
+            width: 44px;
+
+            &:hover {
+              opacity: 1;
+            }
+
+            img {
+              width: 100%;
+            }
+
+            &:last-child {
+              margin-right: 0px;
+            }
           }
         }
       }
@@ -168,15 +230,18 @@
       background: #fff;
       border: 1px solid rgb(200,200,200);
       @include box-sizing(border-box);
+      float: left;
       @include inline-block;
       padding: 1px;
       position: relative;
       vertical-align: middle;
-      width: 210px;
+      //width: 210px;
+      width: flex-grid(3);
       z-index: 2;
 
       .hero {
-        height: 125px;
+        //height: 125px;
+        height: 100%;
         overflow: hidden;
         position: relative;
 

lms/static/sass/application.css

@@ -0,0 +1,7108 @@
+@charset "UTF-8";
+/* HTML5 Boilerplate  */
+article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
+  display: block; }
+
+audio, canvas, video {
+  display: inline-block;
+  *display: inline;
+  *zoom: 1; }
+
+audio:not([controls]) {
+  display: none; }
+
+[hidden] {
+  display: none; }
+
+html {
+  font-size: 100%;
+  -webkit-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%; }
+
+html, button, input, select, textarea {
+  font-family: sans-serif;
+  color: #222; }
+
+body {
+  margin: 0;
+  font-size: 1em;
+  line-height: 1.4; }
+
+::-moz-selection {
+  background: #fe57a1;
+  color: #fff;
+  text-shadow: none; }
+
+::selection {
+  background: #fe57a1;
+  color: #fff;
+  text-shadow: none; }
+
+a {
+  color: #00e; }
+
+a:visited {
+  color: #551a8b; }
+
+a:hover {
+  color: #06e; }
+
+a:focus {
+  outline: thin dotted; }
+
+a:hover, a:active {
+  outline: 0; }
+
+abbr[title] {
+  border-bottom: 1px dotted; }
+
+b, strong {
+  font-weight: bold; }
+
+blockquote {
+  margin: 1em 40px; }
+
+dfn {
+  font-style: italic; }
+
+hr {
+  display: block;
+  height: 1px;
+  border: 0;
+  border-top: 1px solid #ccc;
+  margin: 1em 0;
+  padding: 0; }
+
+ins {
+  background: #ff9;
+  color: #000;
+  text-decoration: none; }
+
+mark {
+  background: #ff0;
+  color: #000;
+  font-style: italic;
+  font-weight: bold; }
+
+pre, code, kbd, samp {
+  font-family: monospace, serif;
+  _font-family: 'courier new', monospace;
+  font-size: 1em; }
+
+pre {
+  white-space: pre;
+  white-space: pre-wrap;
+  word-wrap: break-word; }
+
+q {
+  quotes: none; }
+
+q:before, q:after {
+  content: "";
+  content: none; }
+
+small {
+  font-size: 85%; }
+
+sub, sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline; }
+
+sup {
+  top: -0.5em; }
+
+sub {
+  bottom: -0.25em; }
+
+ul, ol {
+  margin: 1em 0;
+  padding: 0 0 0 40px; }
+
+dd {
+  margin: 0 0 0 40px; }
+
+nav ul, nav ol {
+  list-style: none;
+  list-style-image: none;
+  margin: 0;
+  padding: 0; }
+
+img {
+  border: 0;
+  -ms-interpolation-mode: bicubic;
+  vertical-align: middle; }
+
+svg:not(:root) {
+  overflow: hidden; }
+
+figure {
+  margin: 0; }
+
+form {
+  margin: 0; }
+
+fieldset {
+  border: 0;
+  margin: 0;
+  padding: 0; }
+
+label {
+  cursor: pointer; }
+
+legend {
+  border: 0;
+  *margin-left: -7px;
+  padding: 0;
+  white-space: normal; }
+
+button, input, select, textarea {
+  font-size: 100%;
+  margin: 0;
+  vertical-align: baseline;
+  *vertical-align: middle; }
+
+button, input {
+  line-height: normal; }
+
+button, input[type="button"], input[type="reset"], input[type="submit"] {
+  cursor: pointer;
+  -webkit-appearance: button;
+  *overflow: visible; }
+
+button[disabled], input[disabled] {
+  cursor: default; }
+
+input[type="checkbox"], input[type="radio"] {
+  box-sizing: border-box;
+  padding: 0;
+  *width: 13px;
+  *height: 13px; }
+
+input[type="search"] {
+  -webkit-appearance: textfield;
+  -moz-box-sizing: content-box;
+  -webkit-box-sizing: content-box;
+  box-sizing: content-box; }
+
+input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {
+  -webkit-appearance: none; }
+
+button::-moz-focus-inner, input::-moz-focus-inner {
+  border: 0;
+  padding: 0; }
+
+textarea {
+  overflow: auto;
+  vertical-align: top;
+  resize: vertical; }
+
+input:invalid, textarea:invalid {
+  background-color: #f0dddd; }
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0; }
+
+td {
+  vertical-align: top; }
+
+.chromeframe {
+  margin: 0.2em 0;
+  background: #ccc;
+  color: black;
+  padding: 0.2em 0; }
+
+.ir {
+  display: block;
+  border: 0;
+  text-indent: -999em;
+  overflow: hidden;
+  background-color: transparent;
+  background-repeat: no-repeat;
+  text-align: left;
+  direction: ltr;
+  *line-height: 0; }
+
+.ir br {
+  display: none; }
+
+.hidden {
+  display: none !important;
+  visibility: hidden; }
+
+.visuallyhidden {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px; }
+
+.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
+  clip: auto;
+  height: auto;
+  margin: 0;
+  overflow: visible;
+  position: static;
+  width: auto; }
+
+.invisible {
+  visibility: hidden; }
+
+.clearfix:before, .topbar:before, nav.sequence-nav:before, div.course-wrapper section.course-content .problem-set:before, div.course-wrapper section.course-content section.problems-wrapper:before, div.course-wrapper section.course-content div#seq_content:before, div.course-wrapper section.course-content ol.vert-mod > li:before, section.course-content nav.sequence-bottom ul:before, section.course-content div.video article.video-wrapper section.video-controls:before, section.course-content div.video article.video-wrapper section.video-controls div.slider:before, section.tool-wrapper:before, section.tool-wrapper div#controlls-container:before, section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper:before, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:before, section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders:before, section.problem-set:before, section.problems-wrapper:before, .clearfix:after, .topbar:after, nav.sequence-nav:after, div.course-wrapper section.course-content .problem-set:after, div.course-wrapper section.course-content section.problems-wrapper:after, div.course-wrapper section.course-content div#seq_content:after, div.course-wrapper section.course-content ol.vert-mod > li:after, section.course-content nav.sequence-bottom ul:after, section.course-content div.video article.video-wrapper section.video-controls:after, section.course-content div.video article.video-wrapper section.video-controls div.slider:after, section.tool-wrapper:after, section.tool-wrapper div#controlls-container:after, section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper:after, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:after, section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders:after, section.problem-set:after, section.problems-wrapper:after {
+  content: "";
+  display: table; }
+
+.clearfix:after, .topbar:after, nav.sequence-nav:after, div.course-wrapper section.course-content .problem-set:after, div.course-wrapper section.course-content section.problems-wrapper:after, div.course-wrapper section.course-content div#seq_content:after, div.course-wrapper section.course-content ol.vert-mod > li:after, section.course-content nav.sequence-bottom ul:after, section.course-content div.video article.video-wrapper section.video-controls:after, section.course-content div.video article.video-wrapper section.video-controls div.slider:after, section.tool-wrapper:after, section.tool-wrapper div#controlls-container:after, section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper:after, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:after, section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders:after, section.problem-set:after, section.problems-wrapper:after {
+  clear: both; }
+
+.clearfix, .topbar, nav.sequence-nav, div.course-wrapper section.course-content .problem-set, div.course-wrapper section.course-content section.problems-wrapper, div.course-wrapper section.course-content div#seq_content, div.course-wrapper section.course-content ol.vert-mod > li, section.course-content nav.sequence-bottom ul, section.course-content div.video article.video-wrapper section.video-controls, section.course-content div.video article.video-wrapper section.video-controls div.slider, section.tool-wrapper, section.tool-wrapper div#controlls-container, section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper, section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders, section.problem-set, section.problems-wrapper {
+  *zoom: 1; }
+
+@media print {
+  * {
+    background: transparent !important;
+    color: black !important;
+    box-shadow: none !important;
+    text-shadow: none !important;
+    filter: none !important;
+    -ms-filter: none !important; }
+
+  a, a:visited {
+    text-decoration: underline; }
+
+  a[href]:after {
+    content: " (" attr(href) ")"; }
+
+  abbr[title]:after {
+    content: " (" attr(title) ")"; }
+
+  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
+    content: ""; }
+
+  pre, blockquote {
+    border: 1px solid #999;
+    page-break-inside: avoid; }
+
+  thead {
+    display: table-header-group; }
+
+  tr, img {
+    page-break-inside: avoid; }
+
+  img {
+    max-width: 100% !important; }
+
+  @page {
+    margin: 0.5cm; }
+
+  p, h2, h3 {
+    orphans: 3;
+    widows: 3; }
+
+  h2, h3 {
+    page-break-after: avoid; } }
+/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 25, 2012 05:06:34 PM America/New_York */
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-Light-webfont.eot");
+  src: url("../fonts/OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Light-webfont.woff") format("woff"), url("../fonts/OpenSans-Light-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Light-webfont.svg#OpenSansLight") format("svg");
+  font-weight: 300;
+  font-style: normal; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-LightItalic-webfont.eot");
+  src: url("../fonts/OpenSans-LightItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-LightItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-LightItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic") format("svg");
+  font-weight: 300;
+  font-style: italic; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-Regular-webfont.eot");
+  src: url("../fonts/OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Regular-webfont.woff") format("woff"), url("../fonts/OpenSans-Regular-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular") format("svg");
+  font-weight: 600;
+  font-style: normal; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-Italic-webfont.eot");
+  src: url("../fonts/OpenSans-Italic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Italic-webfont.woff") format("woff"), url("../fonts/OpenSans-Italic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic") format("svg");
+  font-weight: 400;
+  font-style: italic; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-Bold-webfont.eot");
+  src: url("../fonts/OpenSans-Bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-Bold-webfont.woff") format("woff"), url("../fonts/OpenSans-Bold-webfont.ttf") format("truetype"), url("../fonts/OpenSans-Bold-webfont.svg#OpenSansBold") format("svg");
+  font-weight: 700;
+  font-style: normal; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-BoldItalic-webfont.eot");
+  src: url("../fonts/OpenSans-BoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-BoldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-BoldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic") format("svg");
+  font-weight: 700;
+  font-style: italic; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-ExtraBold-webfont.eot");
+  src: url("../fonts/OpenSans-ExtraBold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBold-webfont.woff") format("woff"), url("../fonts/OpenSans-ExtraBold-webfont.ttf") format("truetype"), url("../fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold") format("svg");
+  font-weight: 800;
+  font-style: normal; }
+
+@font-face {
+  font-family: 'Open Sans';
+  src: url("../fonts/OpenSans-ExtraBoldItalic-webfont.eot");
+  src: url("../fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.woff") format("woff"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.ttf") format("truetype"), url("../fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic") format("svg");
+  font-weight: 800;
+  font-style: italic; }
+
+html, body {
+  background: #fafafa;
+  font-family: "Open Sans", Verdana, Geneva, sans-serif;
+  font-size: 1em;
+  line-height: 1em;
+  -webkit-font-smoothing: antialiased; }
+
+h1, h2, h3, h4, h5, h6 {
+  color: #3c3c3c;
+  font: normal 1.2em/1.2em Georgia, Cambria, "Times New Roman", Times, serif;
+  margin: 0px; }
+
+h1 {
+  color: #3c3c3c;
+  font: normal 2em/1.4em "Open Sans", Verdana, Geneva, sans-serif;
+  letter-spacing: 1px;
+  margin-bottom: 30px;
+  text-align: center;
+  text-transform: uppercase; }
+
+h2 {
+  color: #a0a0a0;
+  font: normal 1.2em/1.2em Georgia, Cambria, "Times New Roman", Times, serif;
+  letter-spacing: 1px;
+  margin-bottom: 15px;
+  text-transform: uppercase;
+  -webkit-font-smoothing: antialiased; }
+
+p + h2, ul + h2, ol + h2 {
+  margin-top: 40px; }
+
+p {
+  color: #3c3c3c;
+  font: normal 1em/1.6em Georgia, Cambria, "Times New Roman", Times, serif;
+  margin: 0px; }
+
+span {
+  font: normal 1em/1.6em "Open Sans", Verdana, Geneva, sans-serif; }
+
+p + p, ul + p, ol + p {
+  margin-top: 20px; }
+
+p a:link, p a:visited {
+  color: #1d9dd9;
+  font: normal 1em/1em Georgia, Cambria, "Times New Roman", Times, serif;
+  text-decoration: none;
+  -webkit-transition-property: all;
+  -moz-transition-property: all;
+  -ms-transition-property: all;
+  -o-transition-property: all;
+  transition-property: all;
+  -webkit-transition-duration: 0.1s;
+  -moz-transition-duration: 0.1s;
+  -ms-transition-duration: 0.1s;
+  -o-transition-duration: 0.1s;
+  transition-duration: 0.1s;
+  -webkit-transition-timing-function: linear;
+  -moz-transition-timing-function: linear;
+  -ms-transition-timing-function: linear;
+  -o-transition-timing-function: linear;
+  transition-timing-function: linear;
+  -webkit-transition-delay: 0;
+  -moz-transition-delay: 0;
+  -ms-transition-delay: 0;
+  -o-transition-delay: 0;
+  transition-delay: 0; }
+  p a:link:hover, p a:visited:hover {
+    color: #1d9dd9;
+    text-decoration: underline; }
+
+a:link, a:visited {
+  color: #1d9dd9;
+  font: normal 1em/1em "Open Sans", Verdana, Geneva, sans-serif;
+  text-decoration: none;
+  -webkit-transition-property: all;
+  -moz-transition-property: all;
+  -ms-transition-property: all;
+  -o-transition-property: all;
+  transition-property: all;
+  -webkit-transition-duration: 0.1s;
+  -moz-transition-duration: 0.1s;
+  -ms-transition-duration: 0.1s;
+  -o-transition-duration: 0.1s;
+  transition-duration: 0.1s;
+  -webkit-transition-timing-function: linear;
+  -moz-transition-timing-function: linear;
+  -ms-transition-timing-function: linear;
+  -o-transition-timing-function: linear;
+  transition-timing-function: linear;
+  -webkit-transition-delay: 0;
+  -moz-transition-delay: 0;
+  -ms-transition-delay: 0;
+  -o-transition-delay: 0;
+  transition-delay: 0; }
+  a:link:hover, a:visited:hover {
+    text-decoration: underline; }
+
+.content-wrapper {
+  background: white;
+  margin: 0 auto 0;
+  width: 100%; }
+
+.container {
+  zoom: 1;
+  margin: 0 auto 0;
+  padding: 0px 10px;
+  width: 1180px; }
+  .container:before, .container:after {
+    content: "";
+    display: table; }
+  .container:after {
+    clear: both; }
+
+.static-container {
+  zoom: 1;
+  margin: 0 auto 0;
+  max-width: 1200px;
+  padding: 60px 0px 120px;
+  width: 100%; }
+  .static-container:before, .static-container:after {
+    content: "";
+    display: table; }
+  .static-container:after {
+    clear: both; }
+  .static-container .inner-wrapper {
+    margin: 0 auto 0;
+    width: 83.051%; }
+  .static-container ol, .static-container ul {
+    list-style: disc; }
+    .static-container ol li, .static-container ul li {
+      color: #3c3c3c;
+      font: normal 1em/1.4em Georgia, Cambria, "Times New Roman", Times, serif;
+      margin: 0px; }
+  .static-container h1 {
+    margin-bottom: 30px; }
+  .static-container h1 + hr {
+    margin-bottom: 60px; }
+  .static-container p + h2, .static-container ul + h2, .static-container ol + h2 {
+    margin-top: 40px; }
+  .static-container ul + p, .static-container ol + p {
+    margin-top: 20px; }
+
+.faded-hr-divider, .horizontal-divider, .modal .inner-wrapper header hr::after, .modal .inner-wrapper form .honor-code-summary hr::after, .course-info .container nav::after, .course-info .course-sidebar header::after, .container.about > nav::after {
+  background-image: -webkit-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -moz-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -ms-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -o-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  height: 1px;
+  width: 100%; }
+
+.faded-hr-divider-medium, .home .university-partners::before, .home .university-partners::after {
+  background-image: -webkit-linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 50%, rgba(240, 240, 240, 0));
+  background-image: -moz-linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 50%, rgba(240, 240, 240, 0));
+  background-image: -ms-linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 50%, rgba(240, 240, 240, 0));
+  background-image: -o-linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 50%, rgba(240, 240, 240, 0));
+  background-image: linear-gradient(180deg, rgba(240, 240, 240, 0) 0%, #f0f0f0 50%, rgba(240, 240, 240, 0));
+  height: 1px;
+  width: 100%; }
+
+.faded-hr-divider-light, .horizontal-divider::after, .modal .inner-wrapper header hr, .modal .inner-wrapper form .honor-code-summary hr {
+  background-image: -webkit-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0));
+  background-image: -moz-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0));
+  background-image: -ms-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0));
+  background-image: -o-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0));
+  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 50%, rgba(255, 255, 255, 0));
+  height: 1px;
+  width: 100%; }
+
+.faded-vertical-divider, .vertical-divider, footer nav .top ol li::after, footer nav .top .primary a.logo::after, header.global h1.logo::before, .home .university-partners .partners li.partner::before, .find-courses header.search .inner-wrapper.main-search .logo::after, .find-courses header.search .inner-wrapper.university-search .logo::after, .university-profile header.search .inner-wrapper.main-search .logo::after, .university-profile header.search .inner-wrapper.university-search .logo::after {
+  background-image: -webkit-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -moz-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -ms-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: -o-linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  background-image: linear-gradient(90deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, rgba(200, 200, 200, 0));
+  height: 100%;
+  width: 1px; }
+
+.faded-vertical-divider-light, .vertical-divider::after, header.global h1.logo::after, .home > header .title::after, .home .university-partners .partners li.partner::after {
+  background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
+  background-image: -moz-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
+  background-image: -ms-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
+  background-image: -o-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
+  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0));
+  height: 100%;
+  width: 1px; }
+
+.vertical-divider {
+  position: relative; }
+  .vertical-divider::after {
+    content: "";
+    display: block;
+    position: absolute;
+    left: 1px; }
+
+.horizontal-divider {
+  border: none;
+  position: relative; }
+  .horizontal-divider::after {
+    content: "";
+    display: block;
+    position: absolute;
+    top: 1px; }
+
+.fade-right-hr-divider {
+  background-image: -webkit-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8);
+  background-image: -moz-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8);
+  background-image: -ms-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8);
+  background-image: -o-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8);
+  background-image: linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8);
+  border: none; }
+
+.fade-left-hr-divider {
+  background-image: -webkit-linear-gradient(180deg, #c8c8c8 0%, rgba(200, 200, 200, 0));
+  background-image: -moz-linear-gradient(180deg, #c8c8c8 0%, rgba(200, 200, 200, 0));
+  background-image: -ms-linear-gradient(180deg, #c8c8c8 0%, rgba(200, 200, 200, 0));
+  background-image: -o-linear-gradient(180deg, #c8c8c8 0%, rgba(200, 200, 200, 0));
+  background-image: linear-gradient(180deg, #c8c8c8 0%, rgba(200, 200, 200, 0));
+  border: none; }
+
+.error-message-colors, .container.activation h1.invalid {
+  background: #fd5757;
+  border: 1px solid #ca1111;
+  color: #8f0e0e; }
+
+.success-message-colors, .container.activation h1.valid {
+  background: #63ec89;
+  border: 1px solid #11ca36;
+  color: #238f0e; }
+
+.animation-home-header-pop-up, .home > header .outer-wrapper {
+  -webkit-animation: home-header-pop-up 1.15s ease-in-out;
+  -moz-animation: home-header-pop-up 1.15s ease-in-out;
+  animation: home-header-pop-up 1.15s ease-in-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 1s;
+  -moz-animation-delay: 1s;
+  animation-delay: 1s; }
+
+@-webkit-keyframes home-header-pop-up {
+  0% {
+    opacity: 0;
+    top: 300px; }
+
+  45% {
+    opacity: 1; }
+
+  65% {
+    top: -40px; }
+
+  85% {
+    top: 10px; }
+
+  100% {
+    top: 0px; } }
+
+@-moz-keyframes home-header-pop-up {
+  0% {
+    opacity: 0;
+    top: 300px; }
+
+  45% {
+    opacity: 1; }
+
+  65% {
+    top: -40px; }
+
+  85% {
+    top: 10px; }
+
+  100% {
+    top: 0px; } }
+
+@keyframes home-header-pop-up {
+  0% {
+    opacity: 0;
+    top: 300px; }
+
+  45% {
+    opacity: 1; }
+
+  65% {
+    top: -40px; }
+
+  85% {
+    top: 10px; }
+
+  100% {
+    top: 0px; } }
+
+.animation-title-appear {
+  -webkit-animation: title-appear 4.65s ease-out;
+  -moz-animation: title-appear 4.65s ease-out;
+  animation: title-appear 4.65s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 1s;
+  -moz-animation-delay: 1s;
+  animation-delay: 1s; }
+
+@-webkit-keyframes title-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  27% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  90% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    top: 0px; } }
+
+@-moz-keyframes title-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  27% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  90% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    top: 0px; } }
+
+@keyframes title-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  27% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  90% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    top: 0px; } }
+
+.animation-home-appear {
+  -webkit-animation: home-appear 4.25s ease-out;
+  -moz-animation: home-appear 4.25s ease-out;
+  animation: home-appear 4.25s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 1s;
+  -moz-animation-delay: 1s;
+  animation-delay: 1s; }
+
+@-webkit-keyframes home-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  30% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  80% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.7);
+    -moz-transform: scale(0.7);
+    -ms-transform: scale(0.7);
+    -o-transform: scale(0.7);
+    transform: scale(0.7); } }
+
+@-moz-keyframes home-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  30% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  80% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.7);
+    -moz-transform: scale(0.7);
+    -ms-transform: scale(0.7);
+    -o-transform: scale(0.7);
+    transform: scale(0.7); } }
+
+@keyframes home-appear {
+  0% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.9);
+    -moz-transform: scale(0.9);
+    -ms-transform: scale(0.9);
+    -o-transform: scale(0.9);
+    transform: scale(0.9); }
+
+  20% {
+    opacity: 1; }
+
+  30% {
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  80% {
+    opacity: 1;
+    top: 40px;
+    -webkit-transform: scale(1);
+    -moz-transform: scale(1);
+    -ms-transform: scale(1);
+    -o-transform: scale(1);
+    transform: scale(1); }
+
+  100% {
+    opacity: 0;
+    top: 60px;
+    -webkit-transform: scale(0.7);
+    -moz-transform: scale(0.7);
+    -ms-transform: scale(0.7);
+    -o-transform: scale(0.7);
+    transform: scale(0.7); } }
+
+.animation-edx-appear {
+  -webkit-animation: edx-appear 1.25s ease-in;
+  -moz-animation: edx-appear 1.25s ease-in;
+  animation: edx-appear 1.25s ease-in;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 2.15s;
+  -moz-animation-delay: 2.15s;
+  animation-delay: 2.15s; }
+
+@-webkit-keyframes edx-appear {
+  0% {
+    opacity: 0; }
+
+  100% {
+    opacity: 1; } }
+
+@-moz-keyframes edx-appear {
+  0% {
+    opacity: 0; }
+
+  100% {
+    opacity: 1; } }
+
+@keyframes edx-appear {
+  0% {
+    opacity: 0; }
+
+  100% {
+    opacity: 1; } }
+
+.animation-mit-slide {
+  -webkit-animation: mit-slide 1.15s ease-out;
+  -moz-animation: mit-slide 1.15s ease-out;
+  animation: mit-slide 1.15s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 2s;
+  -moz-animation-delay: 2s;
+  animation-delay: 2s; }
+
+@-webkit-keyframes mit-slide {
+  0% {
+    left: 80px; }
+
+  100% {
+    left: 0px; } }
+
+@-moz-keyframes mit-slide {
+  0% {
+    left: 80px; }
+
+  100% {
+    left: 0px; } }
+
+@keyframes mit-slide {
+  0% {
+    left: 80px; }
+
+  100% {
+    left: 0px; } }
+
+.animation-harvard-slide {
+  -webkit-animation: harvard-slide 1.15s ease-out;
+  -moz-animation: harvard-slide 1.15s ease-out;
+  animation: harvard-slide 1.15s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 2s;
+  -moz-animation-delay: 2s;
+  animation-delay: 2s; }
+
+@-webkit-keyframes harvard-slide {
+  0% {
+    right: 80px; }
+
+  100% {
+    right: 0px; } }
+
+@-moz-keyframes harvard-slide {
+  0% {
+    right: 80px; }
+
+  100% {
+    right: 0px; } }
+
+@keyframes harvard-slide {
+  0% {
+    right: 80px; }
+
+  100% {
+    right: 0px; } }
+
+.animation-divider-left-slide {
+  -webkit-animation: divider-left-slide 1.1s ease-out;
+  -moz-animation: divider-left-slide 1.1s ease-out;
+  animation: divider-left-slide 1.1s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 2s;
+  -moz-animation-delay: 2s;
+  animation-delay: 2s; }
+
+@-webkit-keyframes divider-left-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 200px; } }
+
+@-moz-keyframes divider-left-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 200px; } }
+
+@keyframes divider-left-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 200px; } }
+
+.animation-divider-right-slide {
+  -webkit-animation: divider-right-slide 1.1s ease-out;
+  -moz-animation: divider-right-slide 1.1s ease-out;
+  animation: divider-right-slide 1.1s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 2s;
+  -moz-animation-delay: 2s;
+  animation-delay: 2s; }
+
+@-webkit-keyframes divider-right-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 480px; } }
+
+@-moz-keyframes divider-right-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 480px; } }
+
+@keyframes divider-right-slide {
+  0% {
+    left: 340px; }
+
+  100% {
+    left: 480px; } }
+
+.animation-video-appear {
+  -webkit-animation: video-appear 1.25s ease-out;
+  -moz-animation: video-appear 1.25s ease-out;
+  animation: video-appear 1.25s ease-out;
+  -webkit-animation-fill-mode: both;
+  -moz-animation-fill-mode: both;
+  animation-fill-mode: both;
+  -webkit-animation-delay: 4.4s;
+  -moz-animation-delay: 4.4s;
+  animation-delay: 4.4s; }
+
+@-webkit-keyframes video-appear {
+  0% {
+    bottom: -270px;
+    opacity: 0.9; }
+
+  80% {
+    opacity: 1; }
+
+  100% {
+    bottom: 0px; } }
+
+@-moz-keyframes video-appear {
+  0% {
+    bottom: -270px;
+    opacity: 0.9; }
+
+  80% {
+    opacity: 1; }
+
+  100% {
+    bottom: 0px; } }
+
+@keyframes video-appear {
+  0% {
+    bottom: -270px;
+    opacity: 0.9; }
+
+  80% {
+    opacity: 1; }
+
+  100% {
+    bottom: 0px; } }
+
+.clearfix:after, .topbar:after, nav.sequence-nav:after, div.course-wrapper section.course-content .problem-set:after, div.course-wrapper section.course-content section.problems-wrapper:after, div.course-wrapper section.course-content div#seq_content:after, div.course-wrapper section.course-content ol.vert-mod > li:after, section.course-content nav.sequence-bottom ul:after, section.course-content div.video article.video-wrapper section.video-controls:after, section.course-content div.video article.video-wrapper section.video-controls div.slider:after, section.tool-wrapper:after, section.tool-wrapper div#controlls-container:after, section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper:after, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:after, section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders:after, section.problem-set:after, section.problems-wrapper:after {
+  clear: both;
+  content: ".";
+  display: block;
+  height: 0;
+  visibility: hidden; }
+
+.wrapper {
+  margin: 0 auto;
+  max-width: 1400px;
+  min-width: 810px;
+  text-align: left;
+  width: 100%; }
+  .wrapper div.table-wrapper, .wrapper div.course-wrapper {
+    display: table;
+    width: 100%;
+    overflow: hidden; }
+    @media screen and (min-width: 1400px) {
+      .wrapper div.table-wrapper, .wrapper div.course-wrapper {
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        -ms-border-radius: 4px;
+        -o-border-radius: 4px;
+        border-radius: 4px; } }
+
+h1.top-header, div.course-wrapper section.course-content ol.vert-mod > li header {
+  background: #f3f3f3;
+  border-bottom: 1px solid #e3e3e3;
+  margin: -lh() -lh() lh();
+  padding: lh(); }
+
+.button {
+  border: 1px solid #6f6f6f;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -o-border-radius: 3px;
+  border-radius: 3px;
+  -webkit-box-shadow: inset 0 1px 0 #a2a2a2, 0 0 3px #cccccc;
+  -moz-box-shadow: inset 0 1px 0 #a2a2a2, 0 0 3px #cccccc;
+  box-shadow: inset 0 1px 0 #a2a2a2, 0 0 3px #cccccc;
+  color: #fff;
+  cursor: pointer;
+  font: bold 14px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+  background-color: #959595;
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #959595), color-stop(100%, #7b7b7b));
+  background-image: -webkit-linear-gradient(top, #959595, #7b7b7b);
+  background-image: -moz-linear-gradient(top, #959595, #7b7b7b);
+  background-image: -ms-linear-gradient(top, #959595, #7b7b7b);
+  background-image: -o-linear-gradient(top, #959595, #7b7b7b);
+  background-image: linear-gradient(top, #959595, #7b7b7b);
+  padding: 4px 8px;
+  text-decoration: none;
+  text-shadow: none;
+  -webkit-font-smoothing: antialiased; }
+  .button:hover, .button:focus {
+    border: 1px solid #555555;
+    -webkit-box-shadow: inset 0 1px 0 #bbbbbb, 0 0 3px #cccccc;
+    -moz-box-shadow: inset 0 1px 0 #bbbbbb, 0 0 3px #cccccc;
+    box-shadow: inset 0 1px 0 #bbbbbb, 0 0 3px #cccccc;
+    background-color: #a2a2a2;
+    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a2a2a2), color-stop(100%, #7b7b7b));
+    background-image: -webkit-linear-gradient(top, #a2a2a2, #7b7b7b);
+    background-image: -moz-linear-gradient(top, #a2a2a2, #7b7b7b);
+    background-image: -ms-linear-gradient(top, #a2a2a2, #7b7b7b);
+    background-image: -o-linear-gradient(top, #a2a2a2, #7b7b7b);
+    background-image: linear-gradient(top, #a2a2a2, #7b7b7b); }
+
+.light-button, a.light-button {
+  border: 1px solid #ccc;
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -o-border-radius: 3px;
+  border-radius: 3px;
+  -webkit-box-shadow: inset 0 1px 0 white;
+  -moz-box-shadow: inset 0 1px 0 white;
+  box-shadow: inset 0 1px 0 white;
+  color: #666;
+  cursor: pointer;
+  font: normal 14px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+  background-color: white;
+  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #eeeeee));
+  background-image: -webkit-linear-gradient(top, white, #eeeeee);
+  background-image: -moz-linear-gradient(top, white, #eeeeee);
+  background-image: -ms-linear-gradient(top, white, #eeeeee);
+  background-image: -o-linear-gradient(top, white, #eeeeee);
+  background-image: linear-gradient(top, white, #eeeeee);
+  padding: 4px 8px;
+  text-decoration: none;
+  -webkit-font-smoothing: antialiased; }
+  .light-button:hover, .light-button:focus, a.light-button:hover, a.light-button:focus {
+    border: 1px solid #ccc;
+    background-color: white;
+    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, white), color-stop(100%, #e6e6e6));
+    background-image: -webkit-linear-gradient(top, white, #e6e6e6);
+    background-image: -moz-linear-gradient(top, white, #e6e6e6);
+    background-image: -ms-linear-gradient(top, white, #e6e6e6);
+    background-image: -o-linear-gradient(top, white, #e6e6e6);
+    background-image: linear-gradient(top, white, #e6e6e6);
+    text-decoration: none; }
+
+.action-link a {
+  color: #993333; }
+  .action-link a:hover {
+    color: #4d1919;
+    text-decoration: none; }
+
+.content, div.course-wrapper section.course-content {
+  -webkit-box-shadow: inset 0 0 2px 3px #f3f3f3;
+  -moz-box-shadow: inset 0 0 2px 3px #f3f3f3;
+  box-shadow: inset 0 0 2px 3px #f3f3f3;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  display: table-cell;
+  padding: lh();
+  vertical-align: top;
+  width: 76.518%;
+  overflow: hidden; }
+  @media print {
+    .content, div.course-wrapper section.course-content {
+      -webkit-box-shadow: none;
+      -moz-box-shadow: none;
+      box-shadow: none; } }
+
+.sidebar, section.course-index {
+  background: #e3e3e3;
+  -webkit-border-radius: 4px 0 0 4px;
+  -moz-border-radius: 4px 0 0 4px;
+  -ms-border-radius: 4px 0 0 4px;
+  -o-border-radius: 4px 0 0 4px;
+  border-radius: 4px 0 0 4px;
+  border-right: 1px solid #d3d3d3;
+  -webkit-box-shadow: inset 0 0 0 1px #f6f6f6;
+  -moz-box-shadow: inset 0 0 0 1px #f6f6f6;
+  box-shadow: inset 0 0 0 1px #f6f6f6;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  display: table-cell;
+  font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+  position: relative;
+  text-shadow: 0 1px 0 #f1f1f1;
+  vertical-align: top;
+  width: 23.482%; }
+  .sidebar h1, section.course-index h1, .sidebar h2, section.course-index h2 {
+    font-size: 18px;
+    font-weight: bold;
+    letter-spacing: 0;
+    text-transform: none; }
+  .sidebar a, section.course-index a {
+    border: none;
+    font-style: normal; }
+  .sidebar .bottom-border, section.course-index .bottom-border {
+    border-bottom: 1px solid #d3d3d3;
+    -webkit-box-shadow: 0 1px 0 #eeeeee;
+    -moz-box-shadow: 0 1px 0 #eeeeee;
+    box-shadow: 0 1px 0 #eeeeee; }
+  @media print {
+    .sidebar, section.course-index {
+      display: none; } }
+  .sidebar h3, section.course-index h3 {
+    background: none;
+    border: none;
+    color: #000;
+    font-weight: normal;
+    margin: 0;
+    overflow: hidden; }
+    .sidebar h3 a, section.course-index h3 a {
+      color: #4d4d4d;
+      display: block;
+      font-size: 14px;
+      padding: 7px 7px 7px 30px;
+      text-decoration: none;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: ease-out;
+      -moz-transition-timing-function: ease-out;
+      -ms-transition-timing-function: ease-out;
+      -o-transition-timing-function: ease-out;
+      transition-timing-function: ease-out;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0; }
+    .sidebar h3 span.ui-icon, section.course-index h3 span.ui-icon {
+      background-image: url(../images/ui-icons_454545_256x240.png); }
+    .sidebar h3.active, section.course-index h3.active, .sidebar section.course-index div#accordion h3.ui-accordion-header.ui-state-active, section.course-index div#accordion .sidebar h3.ui-accordion-header.ui-state-active, section.course-index div#accordion h3.ui-accordion-header.ui-state-active {
+      background: none;
+      background-image: -webkit-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -moz-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -ms-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -o-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      border-bottom: 1px solid #d3d3d3;
+      -webkit-box-shadow: inset 0 1px 0 0 #eeeeee;
+      -moz-box-shadow: inset 0 1px 0 0 #eeeeee;
+      box-shadow: inset 0 1px 0 0 #eeeeee;
+      color: #000;
+      font-weight: bold; }
+      .sidebar h3.active a, section.course-index h3.active a, .sidebar section.course-index div#accordion h3.ui-accordion-header.ui-state-active a, section.course-index div#accordion .sidebar h3.ui-accordion-header.ui-state-active a, section.course-index div#accordion h3.ui-accordion-header.ui-state-active a {
+        color: #000; }
+  .sidebar header#open_close_accordion, section.course-index header#open_close_accordion {
+    border-bottom: 1px solid #d3d3d3;
+    -webkit-box-shadow: 0 1px 0 #eeeeee;
+    -moz-box-shadow: 0 1px 0 #eeeeee;
+    box-shadow: 0 1px 0 #eeeeee;
+    padding: lh(0.5) lh();
+    position: relative; }
+    .sidebar header#open_close_accordion h2, section.course-index header#open_close_accordion h2 {
+      margin: 0;
+      padding-right: 20px; }
+    .sidebar header#open_close_accordion a, section.course-index header#open_close_accordion a {
+      background: #eeeeee url("../images/slide-left-icon.png") center center no-repeat;
+      border: 1px solid #D3D3D3;
+      -webkit-border-radius: 3px 0 0 3px;
+      -moz-border-radius: 3px 0 0 3px;
+      -ms-border-radius: 3px 0 0 3px;
+      -o-border-radius: 3px 0 0 3px;
+      border-radius: 3px 0 0 3px;
+      height: 16px;
+      padding: 8px;
+      position: absolute;
+      right: -1px;
+      text-indent: -9999px;
+      top: 6px;
+      width: 16px; }
+      .sidebar header#open_close_accordion a:hover, section.course-index header#open_close_accordion a:hover {
+        background-color: white; }
+  .sidebar a.button, section.course-index a.button {
+    text-decoration: none; }
+
+.topbar, nav.sequence-nav {
+  background: #f6efd4;
+  border-bottom: 1px solid #eddfaa;
+  border-top: 1px solid #fff;
+  font-size: 12px;
+  line-height: 46px;
+  text-shadow: 0 1px 0 #fff; }
+  @media print {
+    .topbar, nav.sequence-nav {
+      display: none; } }
+  .topbar a, nav.sequence-nav a {
+    line-height: 46px;
+    border-bottom: 0;
+    color: #292309; }
+    .topbar a:hover, nav.sequence-nav a:hover {
+      color: #7e691a;
+      text-decoration: none; }
+    .topbar a.block-link, nav.sequence-nav a.block-link, .topbar nav.sequence-nav ol a, nav.sequence-nav ol .topbar a, nav.sequence-nav ol a {
+      border-left: 1px solid #e4d080;
+      -webkit-box-shadow: inset 1px 0 0 #faf7e9;
+      -moz-box-shadow: inset 1px 0 0 #faf7e9;
+      box-shadow: inset 1px 0 0 #faf7e9;
+      display: block;
+      text-transform: uppercase; }
+      .topbar a.block-link:hover, nav.sequence-nav a.block-link:hover, .topbar nav.sequence-nav ol a:hover, nav.sequence-nav ol .topbar a:hover, nav.sequence-nav ol a:hover {
+        background: none; }
+
+.tran, section.course-index {
+  -webkit-transition-property: all;
+  -moz-transition-property: all;
+  -ms-transition-property: all;
+  -o-transition-property: all;
+  transition-property: all;
+  -webkit-transition-duration: 0.2s;
+  -moz-transition-duration: 0.2s;
+  -ms-transition-duration: 0.2s;
+  -o-transition-duration: 0.2s;
+  transition-duration: 0.2s;
+  -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+  -moz-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+  -ms-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+  -o-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+  -webkit-transition-delay: 0;
+  -moz-transition-delay: 0;
+  -ms-transition-delay: 0;
+  -o-transition-delay: 0;
+  transition-delay: 0; }
+
+p.ie-warning {
+  background: yellow;
+  display: block !important;
+  line-height: 1.3em;
+  margin-bottom: 0;
+  padding: lh();
+  text-align: left; }
+
+form {
+  font-size: 1em; }
+  form label {
+    color: #3c3c3c;
+    font: italic 300 1rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
+    margin-bottom: 5px;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.4);
+    -webkit-font-smoothing: antialiased; }
+  form input[type="text"],
+  form input[type="email"],
+  form input[type="password"] {
+    background: #fafafa;
+    border: 1px solid #c8c8c8;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    -ms-border-radius: 3px;
+    -o-border-radius: 3px;
+    border-radius: 3px;
+    -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
+    -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
+    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    font: italic 300 1rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
+    height: 35px;
+    padding: 5px 12px;
+    vertical-align: top;
+    -webkit-font-smoothing: antialiased; }
+    form input[type="text"]:last-child,
+    form input[type="email"]:last-child,
+    form input[type="password"]:last-child {
+      margin-right: 0px; }
+    form input[type="text"]:focus,
+    form input[type="email"]:focus,
+    form input[type="password"]:focus {
+      border-color: #70c4ec;
+      -webkit-box-shadow: 0 0 6px 0 rgba(29, 157, 217, 0.4), inset 0 0 4px 0 rgba(0, 0, 0, 0.15);
+      -moz-box-shadow: 0 0 6px 0 rgba(29, 157, 217, 0.4), inset 0 0 4px 0 rgba(0, 0, 0, 0.15);
+      box-shadow: 0 0 6px 0 rgba(29, 157, 217, 0.4), inset 0 0 4px 0 rgba(0, 0, 0, 0.15);
+      outline: none; }
+  form input[type="submit"] {
+    border: 1px solid #002e88;
+    border-bottom: 1px solid #001e5f;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    -ms-border-radius: 5px;
+    -o-border-radius: 5px;
+    border-radius: 5px;
+    -webkit-box-shadow: inset 0 1px 0 0 #42bae5;
+    -moz-box-shadow: inset 0 1px 0 0 #42bae5;
+    box-shadow: inset 0 1px 0 0 #42bae5;
+    color: white;
+    display: inline;
+    font-size: 14px;
+    font-weight: bold;
+    background-color: #1d9dd9;
+    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d9dd9), color-stop(50%, #006bb8), color-stop(50%, #0052a9), color-stop(100%, #0057ab));
+    background-image: -webkit-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+    background-image: -moz-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+    background-image: -ms-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+    background-image: -o-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+    background-image: linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+    padding: 7px 20px 8px;
+    text-align: center;
+    text-decoration: none;
+    text-shadow: 0 -1px 1px #001067;
+    -webkit-border-radius: 3px;
+    -moz-border-radius: 3px;
+    -ms-border-radius: 3px;
+    -o-border-radius: 3px;
+    border-radius: 3px;
+    font: normal 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
+    height: 35px;
+    letter-spacing: 1px;
+    text-transform: uppercase;
+    vertical-align: top;
+    -webkit-font-smoothing: antialiased; }
+    form input[type="submit"]:hover {
+      cursor: pointer;
+      background-color: #108ec7;
+      background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #108ec7), color-stop(50%, #005fa6), color-stop(50%, #004897), color-stop(100%, #004d9a));
+      background-image: -webkit-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+      background-image: -moz-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+      background-image: -ms-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+      background-image: -o-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+      background-image: linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%); }
+    form input[type="submit"]:active {
+      -webkit-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+      -moz-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+      box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white; }
+
+footer {
+  background: transparent;
+  border-top: 1px solid #c8c8c8;
+  -webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  margin: 0 auto;
+  width: 100%; }
+  footer.fixed-bottom {
+    bottom: 0px;
+    max-width: 100%;
+    position: absolute; }
+  footer nav {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 30px 10px 0;
+    width: 1180px; }
+    footer nav .top {
+      border-bottom: 1px solid #c8c8c8;
+      zoom: 1;
+      padding-bottom: 30px;
+      width: 100%;
+      text-align: center; }
+      footer nav .top:before, footer nav .top:after {
+        content: "";
+        display: table; }
+      footer nav .top:after {
+        clear: both; }
+      footer nav .top ol {
+        float: right; }
+        footer nav .top ol li {
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          list-style: none;
+          padding: 0px 15px;
+          position: relative;
+          vertical-align: middle; }
+          footer nav .top ol li::after {
+            content: "";
+            display: block;
+            height: 30px;
+            right: 0px;
+            position: absolute;
+            top: -5px;
+            width: 1px; }
+          footer nav .top ol li a:link, footer nav .top ol li a:visited {
+            color: #a0a0a0;
+            letter-spacing: 1px;
+            padding: 6px 0px; }
+      footer nav .top .primary {
+        zoom: 1;
+        float: left; }
+        footer nav .top .primary:before, footer nav .top .primary:after {
+          content: "";
+          display: table; }
+        footer nav .top .primary:after {
+          clear: both; }
+        footer nav .top .primary a.logo {
+          background-image: url("/static/images/logo.png");
+          background-image: url("/static/images/logo.png");
+          background-image: url("/static/images/logo.png");
+          background-image: url("/static/images/logo.png");
+          background-image: url("/static/images/logo.png");
+          background-position: 0 -24px;
+          background-repeat: no-repeat;
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          height: 22px;
+          margin-right: 15px;
+          margin-top: 2px;
+          padding-right: 15px;
+          position: relative;
+          width: 47px;
+          vertical-align: middle; }
+          footer nav .top .primary a.logo:hover {
+            background-position: 0 0; }
+          footer nav .top .primary a.logo::after {
+            content: "";
+            display: block;
+            height: 30px;
+            right: 0px;
+            position: absolute;
+            top: -3px;
+            width: 1px; }
+        footer nav .top .primary a {
+          color: #a0a0a0;
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          letter-spacing: 1px;
+          margin-right: 20px;
+          padding-top: 2px;
+          vertical-align: middle; }
+          footer nav .top .primary a:hover {
+            color: #3c3c3c;
+            text-decoration: none; }
+      footer nav .top .social {
+        float: right; }
+        footer nav .top .social.social {
+          border: none;
+          margin: 0 0 0 5px;
+          padding: 0; }
+          footer nav .top .social.social a {
+            opacity: 0.7;
+            padding: 0 0 0 10px;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.1s;
+            -moz-transition-duration: 0.1s;
+            -ms-transition-duration: 0.1s;
+            -o-transition-duration: 0.1s;
+            transition-duration: 0.1s;
+            -webkit-transition-timing-function: linear;
+            -moz-transition-timing-function: linear;
+            -ms-transition-timing-function: linear;
+            -o-transition-timing-function: linear;
+            transition-timing-function: linear;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0; }
+            footer nav .top .social.social a:hover {
+              opacity: 1; }
+    footer nav .bottom {
+      zoom: 1;
+      opacity: 0.8;
+      padding: 10px 0px 30px;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0;
+      width: 100%; }
+      footer nav .bottom:before, footer nav .bottom:after {
+        content: "";
+        display: table; }
+      footer nav .bottom:after {
+        clear: both; }
+      footer nav .bottom:hover {
+        opacity: 1; }
+      footer nav .bottom .copyright {
+        float: left; }
+        footer nav .bottom .copyright p {
+          color: #a0a0a0;
+          font-style: italic;
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          margin: 0 auto;
+          padding-top: 1px;
+          text-align: center;
+          vertical-align: middle; }
+          footer nav .bottom .copyright p a {
+            color: #a0a0a0;
+            font-style: italic;
+            margin-left: 5px; }
+            footer nav .bottom .copyright p a:hover {
+              color: #1d9dd9; }
+      footer nav .bottom .secondary {
+        float: right;
+        text-align: left; }
+        footer nav .bottom .secondary a {
+          color: #a0a0a0;
+          font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+          font-style: italic;
+          letter-spacing: 1px;
+          line-height: 1.6em;
+          margin-left: 20px;
+          text-transform: lowercase; }
+          footer nav .bottom .secondary a:hover {
+            color: #1d9dd9; }
+
+header.global {
+  border-bottom: 1px solid #bebebe;
+  -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  background-image: -webkit-linear-gradient(-90deg, white, rgba(230, 230, 230, 0.9));
+  background-image: -moz-linear-gradient(-90deg, white, rgba(230, 230, 230, 0.9));
+  background-image: -ms-linear-gradient(-90deg, white, rgba(230, 230, 230, 0.9));
+  background-image: -o-linear-gradient(-90deg, white, rgba(230, 230, 230, 0.9));
+  background-image: linear-gradient(-90deg, white, rgba(230, 230, 230, 0.9));
+  height: 68px;
+  position: relative;
+  width: 100%;
+  z-index: 10; }
+  header.global nav {
+    zoom: 1;
+    height: 40px;
+    margin: 0 auto;
+    max-width: 1200px;
+    padding: 14px 10px 0px;
+    width: 1180px; }
+    header.global nav:before, header.global nav:after {
+      content: "";
+      display: table; }
+    header.global nav:after {
+      clear: both; }
+  header.global h1.logo {
+    float: left;
+    margin: 6px 15px 0px 0px;
+    padding-right: 20px;
+    position: relative; }
+    header.global h1.logo::before {
+      content: "";
+      display: block;
+      height: 50px;
+      position: absolute;
+      right: 1px;
+      top: -8px;
+      width: 1px; }
+    header.global h1.logo::after {
+      content: "";
+      display: block;
+      height: 50px;
+      position: absolute;
+      right: 0px;
+      top: -12px;
+      width: 1px; }
+    header.global h1.logo a {
+      background-image: url("/static/images/header-logo.png");
+      background-image: url("/static/images/header-logo.png");
+      background-image: url("/static/images/header-logo.png");
+      background-image: url("/static/images/header-logo.png");
+      background-image: url("/static/images/header-logo.png");
+      background-position: 0 0;
+      background-repeat: no-repeat;
+      display: block;
+      height: 31px;
+      width: 64px; }
+  header.global ol.left {
+    float: left; }
+  header.global ol.guest {
+    float: right; }
+  header.global ol > li {
+    display: -moz-inline-box;
+    -moz-box-orient: vertical;
+    display: inline-block;
+    vertical-align: baseline;
+    zoom: 1;
+    *display: inline;
+    *vertical-align: auto;
+    margin-right: 20px;
+    position: relative;
+    vertical-align: middle; }
+    header.global ol > li:last-child {
+      margin-right: 0px; }
+    header.global ol > li a {
+      letter-spacing: 1px;
+      vertical-align: middle; }
+  header.global ol li.secondary > a {
+    color: #a0a0a0;
+    color: #1d9dd9;
+    display: block;
+    font-family: "Open Sans", Verdana, Geneva, sans-serif;
+    display: -moz-inline-box;
+    -moz-box-orient: vertical;
+    display: inline-block;
+    vertical-align: baseline;
+    zoom: 1;
+    *display: inline;
+    *vertical-align: auto;
+    margin: 0px 30px 0px 0px;
+    text-decoration: none;
+    text-transform: uppercase;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+    header.global ol li.secondary > a:last-child {
+      margin-right: 0px; }
+    header.global ol li.secondary > a:hover {
+      color: #3c3c3c; }
+  header.global ol li.primary {
+    margin-right: 5px; }
+    header.global ol li.primary > a {
+      background-image: -webkit-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+      background-image: -moz-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+      background-image: -ms-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+      background-image: -o-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+      background-image: linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+      border: 1px solid transparent;
+      border-color: #c8c8c8;
+      -webkit-border-radius: 3px;
+      -moz-border-radius: 3px;
+      -ms-border-radius: 3px;
+      -o-border-radius: 3px;
+      border-radius: 3px;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+      -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+      box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+      color: #3c3c3c;
+      display: inline-block;
+      font-family: "Open Sans", Verdana, Geneva, sans-serif;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      line-height: 1em;
+      margin: 1px 5px;
+      padding: 10px 12px;
+      text-decoration: none;
+      text-transform: uppercase;
+      text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+      vertical-align: middle; }
+      header.global ol li.primary > a:last-child {
+        margin-right: 0px; }
+  header.global ol.user {
+    float: right; }
+    header.global ol.user > li.primary {
+      display: block;
+      float: left;
+      margin: 0px; }
+      header.global ol.user > li.primary > a {
+        margin: 0px;
+        -webkit-border-top-right-radius: 0px;
+        -moz-border-top-right-radius: 0px;
+        -moz-border-radius-topright: 0px;
+        -ms-border-top-right-radius: 0px;
+        -o-border-top-right-radius: 0px;
+        border-top-right-radius: 0px;
+        -webkit-border-bottom-right-radius: 0px;
+        -moz-border-bottom-right-radius: 0px;
+        -moz-border-radius-bottomright: 0px;
+        -ms-border-bottom-right-radius: 0px;
+        -o-border-bottom-right-radius: 0px;
+        border-bottom-right-radius: 0px; }
+      header.global ol.user > li.primary:last-child > a {
+        -webkit-border-radius: 0 4px 4px 0;
+        -moz-border-radius: 0 4px 4px 0;
+        -ms-border-radius: 0 4px 4px 0;
+        -o-border-radius: 0 4px 4px 0;
+        border-radius: 0 4px 4px 0;
+        border-left: none; }
+    header.global ol.user a.user-link {
+      padding: 10px 12px 10px 42px;
+      position: relative;
+      text-transform: none; }
+      header.global ol.user a.user-link .avatar {
+        background-image: url("/static/images/portal-icons/home-icon.png");
+        background-image: url("/static/images/portal-icons/home-icon.png");
+        background-image: url("/static/images/portal-icons/home-icon.png");
+        background-image: url("/static/images/portal-icons/home-icon.png");
+        background-image: url("/static/images/portal-icons/home-icon.png");
+        background-size: cover;
+        height: 26px;
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        left: 8px;
+        opacity: 0.5;
+        overflow: hidden;
+        position: absolute;
+        top: 4px;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 26px; }
+      header.global ol.user a.user-link:hover .avatar {
+        opacity: 0.8; }
+    header.global ol.user ul.dropdown-menu {
+      background: #fcfcfc;
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      -webkit-box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.3);
+      -moz-box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.3);
+      box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.3);
+      border: 1px solid #646464;
+      display: none;
+      padding: 5px 10px;
+      position: absolute;
+      right: 0px;
+      top: 50px;
+      width: 170px;
+      z-index: 3; }
+      header.global ol.user ul.dropdown-menu.expanded {
+        display: block; }
+      header.global ol.user ul.dropdown-menu::before {
+        background: transparent;
+        border-top: 6px solid #fcfcfc;
+        border-right: 6px solid #fcfcfc;
+        border-bottom: 6px solid transparent;
+        border-left: 6px solid transparent;
+        -webkit-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        -moz-box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        box-shadow: 1px 0 0 0 black, 0 -1px 0 0 black;
+        content: "";
+        display: block;
+        height: 0px;
+        position: absolute;
+        -webkit-transform: rotate(-45deg);
+        -moz-transform: rotate(-45deg);
+        -ms-transform: rotate(-45deg);
+        -o-transform: rotate(-45deg);
+        transform: rotate(-45deg);
+        right: 12px;
+        top: -6px;
+        width: 0px; }
+      header.global ol.user ul.dropdown-menu li {
+        display: block;
+        border-top: 1px dotted #c8c8c8;
+        -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
+        -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05);
+        box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.05); }
+        header.global ol.user ul.dropdown-menu li:first-child {
+          border: none;
+          -webkit-box-shadow: none;
+          -moz-box-shadow: none;
+          box-shadow: none; }
+        header.global ol.user ul.dropdown-menu li > a {
+          border: 1px solid transparent;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          -ms-border-radius: 3px;
+          -o-border-radius: 3px;
+          border-radius: 3px;
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          color: #1d9dd9;
+          cursor: pointer;
+          display: block;
+          margin: 5px 0px;
+          overflow: hidden;
+          padding: 3px 5px 4px;
+          text-overflow: ellipsis;
+          -webkit-transition-property: padding;
+          -moz-transition-property: padding;
+          -ms-transition-property: padding;
+          -o-transition-property: padding;
+          transition-property: padding;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          white-space: nowrap;
+          width: 100%; }
+          header.global ol.user ul.dropdown-menu li > a:hover {
+            color: #3c3c3c;
+            text-decoration: none; }
+
+.highlighted-courses .courses, .find-courses .courses {
+  zoom: 1;
+  padding: 40px 0px 15px; }
+  .highlighted-courses .courses:before, .highlighted-courses .courses:after, .find-courses .courses:before, .find-courses .courses:after {
+    content: "";
+    display: table; }
+  .highlighted-courses .courses:after, .find-courses .courses:after {
+    clear: both; }
+  .highlighted-courses .courses .course, .find-courses .courses .course {
+    background: #fafafa;
+    border: 1px solid #b4b4b4;
+    -webkit-border-radius: 2px;
+    -moz-border-radius: 2px;
+    -ms-border-radius: 2px;
+    -o-border-radius: 2px;
+    border-radius: 2px;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
+    -moz-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
+    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.15), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
+    float: left;
+    margin-right: 2.024%;
+    margin-bottom: 30px;
+    position: relative;
+    width: 31.984%;
+    -webkit-transition-property: all;
+    -moz-transition-property: all;
+    -ms-transition-property: all;
+    -o-transition-property: all;
+    transition-property: all;
+    -webkit-transition-duration: 0.15s;
+    -moz-transition-duration: 0.15s;
+    -ms-transition-duration: 0.15s;
+    -o-transition-duration: 0.15s;
+    transition-duration: 0.15s;
+    -webkit-transition-timing-function: linear;
+    -moz-transition-timing-function: linear;
+    -ms-transition-timing-function: linear;
+    -o-transition-timing-function: linear;
+    transition-timing-function: linear;
+    -webkit-transition-delay: 0;
+    -moz-transition-delay: 0;
+    -ms-transition-delay: 0;
+    -o-transition-delay: 0;
+    transition-delay: 0; }
+    .highlighted-courses .courses .course:nth-child(3n+3), .find-courses .courses .course:nth-child(3n+3) {
+      margin-right: 0; }
+    .highlighted-courses .courses .course .meta-info, .find-courses .courses .course .meta-info {
+      background: rgba(0, 0, 0, 0.6);
+      bottom: 6px;
+      border: 1px solid rgba(0, 0, 0, 0.5);
+      -webkit-border-top-right-radius: 2px;
+      -moz-border-top-right-radius: 2px;
+      -moz-border-radius-topright: 2px;
+      -ms-border-top-right-radius: 2px;
+      -o-border-top-right-radius: 2px;
+      border-top-right-radius: 2px;
+      -webkit-border-bottom-right-radius: 2px;
+      -moz-border-bottom-right-radius: 2px;
+      -moz-border-radius-bottomright: 2px;
+      -ms-border-bottom-right-radius: 2px;
+      -o-border-bottom-right-radius: 2px;
+      border-bottom-right-radius: 2px;
+      -webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      -moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.15);
+      zoom: 1;
+      position: absolute;
+      right: -3px;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0; }
+      .highlighted-courses .courses .course .meta-info:before, .highlighted-courses .courses .course .meta-info:after, .find-courses .courses .course .meta-info:before, .find-courses .courses .course .meta-info:after {
+        content: "";
+        display: table; }
+      .highlighted-courses .courses .course .meta-info:after, .find-courses .courses .course .meta-info:after {
+        clear: both; }
+      .highlighted-courses .courses .course .meta-info p, .find-courses .courses .course .meta-info p {
+        color: white;
+        font-style: italic;
+        line-height: 1.2em;
+        padding: 4px 12px 5px; }
+    .highlighted-courses .courses .course .inner-wrapper, .find-courses .courses .course .inner-wrapper {
+      border: 1px solid white;
+      height: 100%;
+      height: 180px;
+      overflow: hidden;
+      position: relative; }
+    .highlighted-courses .courses .course header.course-preview, .find-courses .courses .course header.course-preview {
+      left: 0px;
+      position: absolute;
+      top: 0px;
+      width: 100%;
+      z-index: 3; }
+      .highlighted-courses .courses .course header.course-preview > a, .find-courses .courses .course header.course-preview > a {
+        background-image: -webkit-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.85));
+        background-image: -moz-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.85));
+        background-image: -ms-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.85));
+        background-image: -o-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.85));
+        background-image: linear-gradient(-90deg, white, rgba(255, 255, 255, 0.85));
+        -webkit-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.2);
+        -moz-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.2);
+        box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.2);
+        border-bottom: 1px solid rgba(150, 150, 150, 0.7);
+        display: block;
+        height: 50px; }
+        .highlighted-courses .courses .course header.course-preview > a hgroup, .find-courses .courses .course header.course-preview > a hgroup {
+          left: 0px;
+          padding: 5px 10px;
+          position: absolute;
+          right: 60px;
+          top: 0px; }
+          .highlighted-courses .courses .course header.course-preview > a hgroup h2, .find-courses .courses .course header.course-preview > a hgroup h2 {
+            color: #3c3c3c;
+            font-family: "Open Sans", Verdana, Geneva, sans-serif;
+            font-size: 1em;
+            font-weight: 700;
+            margin-bottom: 0px;
+            overflow: hidden;
+            padding-top: 9px;
+            text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+            text-overflow: ellipsis;
+            white-space: nowrap; }
+        .highlighted-courses .courses .course header.course-preview > a .info-link, .find-courses .courses .course header.course-preview > a .info-link {
+          border-left: 1px solid rgba(150, 150, 150, 0.5);
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          color: #3c3c3c;
+          display: block;
+          font: bold 1.6em/1.2em "Open Sans", Verdana, Geneva, sans-serif;
+          height: 100%;
+          opacity: 0.6;
+          padding-top: 10px;
+          position: absolute;
+          right: 0px;
+          text-align: center;
+          text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+          top: 0px;
+          width: 60px; }
+        .highlighted-courses .courses .course header.course-preview > a:hover, .find-courses .courses .course header.course-preview > a:hover {
+          background-image: -webkit-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.8));
+          background-image: -moz-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.8));
+          background-image: -ms-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.8));
+          background-image: -o-linear-gradient(-90deg, white, rgba(255, 255, 255, 0.8));
+          background-image: linear-gradient(-90deg, white, rgba(255, 255, 255, 0.8)); }
+          .highlighted-courses .courses .course header.course-preview > a:hover h2, .highlighted-courses .courses .course header.course-preview > a:hover .info-link, .find-courses .courses .course header.course-preview > a:hover h2, .find-courses .courses .course header.course-preview > a:hover .info-link {
+            color: #1d9dd9;
+            opacity: 1; }
+          .highlighted-courses .courses .course header.course-preview > a:hover h2, .find-courses .courses .course header.course-preview > a:hover h2 {
+            text-decoration: underline; }
+    .highlighted-courses .courses .course .info, .find-courses .courses .course .info {
+      background: white;
+      height: 310px;
+      left: 0px;
+      position: absolute;
+      top: 0px;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0;
+      width: 100%; }
+      .highlighted-courses .courses .course .info .cover-image, .find-courses .courses .course .info .cover-image {
+        height: 180px;
+        overflow: hidden;
+        width: 100%; }
+        .highlighted-courses .courses .course .info .cover-image img, .find-courses .courses .course .info .cover-image img {
+          display: block;
+          min-height: 100%;
+          width: 100%; }
+      .highlighted-courses .courses .course .info .desc, .find-courses .courses .course .info .desc {
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        height: 100px;
+        overflow: hidden;
+        padding: 10px 10px 12px 10px;
+        position: relative;
+        width: 100%; }
+        .highlighted-courses .courses .course .info .desc p, .find-courses .courses .course .info .desc p {
+          height: 100%;
+          overflow: hidden;
+          text-overflow: ellipsis; }
+      .highlighted-courses .courses .course .info .bottom, .find-courses .courses .course .info .bottom {
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        padding: 0px 10px 10px 10px;
+        width: 100%; }
+        .highlighted-courses .courses .course .info .bottom .university, .find-courses .courses .course .info .bottom .university {
+          border-right: 1px solid #c8c8c8;
+          color: #a0a0a0;
+          letter-spacing: 1px;
+          margin-right: 10px;
+          padding-right: 10px; }
+          .highlighted-courses .courses .course .info .bottom .university:hover, .find-courses .courses .course .info .bottom .university:hover {
+            color: #1d9dd9; }
+        .highlighted-courses .courses .course .info .bottom .start-date, .find-courses .courses .course .info .bottom .start-date {
+          color: #a0a0a0;
+          letter-spacing: 1px; }
+    .highlighted-courses .courses .course:hover, .find-courses .courses .course:hover {
+      background: #f5f5f5;
+      border-color: #aaaaaa;
+      -webkit-box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.4);
+      -moz-box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.4);
+      box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.4); }
+      .highlighted-courses .courses .course:hover .info, .find-courses .courses .course:hover .info {
+        top: -130px; }
+      .highlighted-courses .courses .course:hover .meta-info, .find-courses .courses .course:hover .meta-info {
+        opacity: 0; }
+
+.filter {
+  height: 60px; }
+  .filter nav {
+    background-image: -webkit-linear-gradient(-90deg, #fafafa, #e6e6e6);
+    background-image: -moz-linear-gradient(-90deg, #fafafa, #e6e6e6);
+    background-image: -ms-linear-gradient(-90deg, #fafafa, #e6e6e6);
+    background-image: -o-linear-gradient(-90deg, #fafafa, #e6e6e6);
+    background-image: linear-gradient(-90deg, #fafafa, #e6e6e6);
+    -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), inset 0 0 0 -1px rgba(255, 255, 255, 0.4);
+    -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), inset 0 0 0 -1px rgba(255, 255, 255, 0.4);
+    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), inset 0 0 0 -1px rgba(255, 255, 255, 0.4);
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    border: 1px solid #bebebe;
+    border-bottom-color: #c8c8c8;
+    border-top: none;
+    -webkit-border-bottom-left-radius: 4px;
+    -moz-border-bottom-left-radius: 4px;
+    -moz-border-radius-bottomleft: 4px;
+    -ms-border-bottom-left-radius: 4px;
+    -o-border-bottom-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    -webkit-border-bottom-right-radius: 4px;
+    -moz-border-bottom-right-radius: 4px;
+    -moz-border-radius-bottomright: 4px;
+    -ms-border-bottom-right-radius: 4px;
+    -o-border-bottom-right-radius: 4px;
+    border-bottom-right-radius: 4px;
+    zoom: 1;
+    height: 60px;
+    padding: 12px 10px;
+    position: relative;
+    z-index: 9; }
+    .filter nav:before, .filter nav:after {
+      content: "";
+      display: table; }
+    .filter nav:after {
+      clear: both; }
+    .filter nav.fixed-top {
+      -webkit-box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      -moz-box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
+      max-width: 1200px;
+      position: fixed;
+      top: 0px;
+      width: 100%; }
+    .filter nav .dropdown {
+      float: left;
+      margin-right: 15px;
+      position: relative; }
+      .filter nav .dropdown .filter-heading {
+        background-image: -webkit-linear-gradient(-90deg, #fafafa 0%, #f5f5f5 50%, #ebebeb 50%, #e6e6e6 100%);
+        background-image: -moz-linear-gradient(-90deg, #fafafa 0%, #f5f5f5 50%, #ebebeb 50%, #e6e6e6 100%);
+        background-image: -ms-linear-gradient(-90deg, #fafafa 0%, #f5f5f5 50%, #ebebeb 50%, #e6e6e6 100%);
+        background-image: -o-linear-gradient(-90deg, #fafafa 0%, #f5f5f5 50%, #ebebeb 50%, #e6e6e6 100%);
+        background-image: linear-gradient(-90deg, #fafafa 0%, #f5f5f5 50%, #ebebeb 50%, #e6e6e6 100%);
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        -ms-border-radius: 4px;
+        -o-border-radius: 4px;
+        border-radius: 4px;
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.4), inset 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.4), inset 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.4), inset 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        border: 1px solid #c8c8c8;
+        color: #3c3c3c;
+        cursor: pointer;
+        height: 36px;
+        padding: 9px;
+        position: relative;
+        text-align: center;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.8);
+        width: 150px;
+        z-index: 11; }
+      .filter nav .dropdown ul {
+        background: white;
+        -webkit-border-radius: 0px 4px 4px 4px;
+        -moz-border-radius: 0px 4px 4px 4px;
+        -ms-border-radius: 0px 4px 4px 4px;
+        -o-border-radius: 0px 4px 4px 4px;
+        border-radius: 0px 4px 4px 4px;
+        border: 1px solid #c8c8c8;
+        -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.2);
+        -moz-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.2);
+        box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.2);
+        padding: 20px 0px 5px 20px;
+        position: absolute;
+        visibility: hidden;
+        width: 200px;
+        z-index: 10; }
+        .filter nav .dropdown ul li {
+          list-style: none;
+          margin-bottom: 15px; }
+      .filter nav .dropdown:hover .filter-heading {
+        background: white;
+        background-image: -webkit-linear-gradient(-90deg, #fafafa, white);
+        background-image: -moz-linear-gradient(-90deg, #fafafa, white);
+        background-image: -ms-linear-gradient(-90deg, #fafafa, white);
+        background-image: -o-linear-gradient(-90deg, #fafafa, white);
+        background-image: linear-gradient(-90deg, #fafafa, white);
+        -webkit-border-radius: 4px 4px 0px 0px;
+        -moz-border-radius: 4px 4px 0px 0px;
+        -ms-border-radius: 4px 4px 0px 0px;
+        -o-border-radius: 4px 4px 0px 0px;
+        border-radius: 4px 4px 0px 0px;
+        border-bottom: 1px dotted #c8c8c8;
+        -webkit-box-shadow: 0 2px 0 -1px white;
+        -moz-box-shadow: 0 2px 0 -1px white;
+        box-shadow: 0 2px 0 -1px white;
+        color: #3c3c3c;
+        height: 40px; }
+      .filter nav .dropdown:hover ul {
+        visibility: visible; }
+    .filter nav form.search {
+      float: right; }
+      .filter nav form.search input[type="text"] {
+        -webkit-border-radius: 3px 0px 0px 3px;
+        -moz-border-radius: 3px 0px 0px 3px;
+        -ms-border-radius: 3px 0px 0px 3px;
+        -o-border-radius: 3px 0px 0px 3px;
+        border-radius: 3px 0px 0px 3px;
+        float: left;
+        height: 36px;
+        width: 200px; }
+      .filter nav form.search input[type="submit"] {
+        -webkit-border-radius: 0px 3px 3px 0px;
+        -moz-border-radius: 0px 3px 3px 0px;
+        -ms-border-radius: 0px 3px 3px 0px;
+        -o-border-radius: 0px 3px 3px 0px;
+        border-radius: 0px 3px 3px 0px;
+        float: left;
+        height: 36px;
+        padding: 2px 20px; }
+
+#lean_overlay {
+  background: transparent;
+  background-image: -webkit-radial-gradient(50% 30%, circle cover, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
+  background-image: -moz-radial-gradient(50% 30%, circle cover, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
+  background-image: -ms-radial-gradient(50% 30%, circle cover, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
+  background-image: -o-radial-gradient(50% 30%, circle cover, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
+  background-image: radial-gradient(50% 30%, circle cover, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.8));
+  display: none;
+  height: 100%;
+  left: 0px;
+  position: fixed;
+  top: 0px;
+  width: 100%;
+  z-index: 100; }
+
+.modal {
+  background: rgba(0, 0, 0, 0.6);
+  border: 1px solid rgba(0, 0, 0, 0.9);
+  -webkit-border-radius: 0px;
+  -moz-border-radius: 0px;
+  -ms-border-radius: 0px;
+  -o-border-radius: 0px;
+  border-radius: 0px;
+  -webkit-box-shadow: 0 15px 80px 15px rgba(0, 0, 0, 0.5);
+  -moz-box-shadow: 0 15px 80px 15px rgba(0, 0, 0, 0.5);
+  box-shadow: 0 15px 80px 15px rgba(0, 0, 0, 0.5);
+  color: #fff;
+  display: none;
+  left: 50%;
+  padding: 8px;
+  position: absolute;
+  width: 480px;
+  z-index: 12; }
+  .modal.video-modal {
+    left: 50%;
+    padding: 10px;
+    width: 582px; }
+    .modal.video-modal .inner-wrapper {
+      background: #000;
+      -webkit-box-shadow: none;
+      -moz-box-shadow: none;
+      box-shadow: none;
+      height: 315px;
+      padding: 10px;
+      width: 560px; }
+  .modal.home-page-video-modal {
+    left: 50%;
+    padding: 10px;
+    width: 662px; }
+    .modal.home-page-video-modal .inner-wrapper {
+      background: #000;
+      -webkit-box-shadow: none;
+      -moz-box-shadow: none;
+      box-shadow: none;
+      height: 360px;
+      padding: 10px;
+      width: 640px; }
+  .modal .inner-wrapper {
+    background: #f5f5f5;
+    -webkit-border-radius: 0px;
+    -moz-border-radius: 0px;
+    -ms-border-radius: 0px;
+    -o-border-radius: 0px;
+    border-radius: 0px;
+    border: 1px solid rgba(0, 0, 0, 0.9);
+    -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
+    -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
+    box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
+    overflow: hidden;
+    padding-bottom: 30px;
+    position: relative;
+    z-index: 2; }
+    .modal .inner-wrapper header {
+      margin-bottom: 30px;
+      overflow: hidden;
+      padding: 28px 20px 0px;
+      position: relative;
+      z-index: 2; }
+      .modal .inner-wrapper header::before {
+        background-image: -webkit-radial-gradient(50% 50%, circle closest-side, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -moz-radial-gradient(50% 50%, circle closest-side, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -ms-radial-gradient(50% 50%, circle closest-side, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -o-radial-gradient(50% 50%, circle closest-side, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: radial-gradient(50% 50%, circle closest-side, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 100%);
+        content: "";
+        display: block;
+        height: 400px;
+        left: 0px;
+        margin: 0 auto;
+        position: absolute;
+        top: -140px;
+        width: 100%;
+        z-index: 1; }
+      .modal .inner-wrapper header hr {
+        border: none;
+        margin: 0px;
+        position: relative;
+        z-index: 2; }
+        .modal .inner-wrapper header hr::after {
+          bottom: 0px;
+          content: "";
+          display: block;
+          position: absolute;
+          top: -1px; }
+      .modal .inner-wrapper header h2 {
+        position: relative;
+        text-align: center;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.4);
+        z-index: 2; }
+    .modal .inner-wrapper #enroll_error, .modal .inner-wrapper #login_error {
+      background: #fd5757;
+      border: 1px solid #ca1111;
+      color: #8f0e0e;
+      display: none;
+      margin-bottom: 20px;
+      padding: 12px; }
+    .modal .inner-wrapper .activation-message {
+      padding: 0 40px 10px; }
+    .modal .inner-wrapper form {
+      margin-bottom: 12px;
+      padding: 0px 40px;
+      position: relative;
+      z-index: 2; }
+      .modal .inner-wrapper form label {
+        display: none; }
+      .modal .inner-wrapper form input[type="checkbox"] {
+        margin-right: 5px; }
+      .modal .inner-wrapper form input[type="email"],
+      .modal .inner-wrapper form input[type="text"],
+      .modal .inner-wrapper form input[type="password"] {
+        background: white;
+        display: block;
+        height: 45px;
+        margin-bottom: 20px;
+        width: 100%; }
+      .modal .inner-wrapper form label.remember-me,
+      .modal .inner-wrapper form label.terms-of-service,
+      .modal .inner-wrapper form label.honor-code {
+        background: #e9e9e9;
+        border: 1px solid #c8c8c8;
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        -ms-border-radius: 3px;
+        -o-border-radius: 3px;
+        border-radius: 3px;
+        -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        display: block;
+        margin-bottom: 20px;
+        padding: 8px 10px; }
+        .modal .inner-wrapper form label.remember-me:hover,
+        .modal .inner-wrapper form label.terms-of-service:hover,
+        .modal .inner-wrapper form label.honor-code:hover {
+          background: #e6e6e6; }
+        .modal .inner-wrapper form label.remember-me a,
+        .modal .inner-wrapper form label.terms-of-service a,
+        .modal .inner-wrapper form label.honor-code a {
+          font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+          font-style: italic; }
+      .modal .inner-wrapper form .honor-code-summary {
+        margin-bottom: 20px;
+        padding: 0px;
+        position: relative; }
+        .modal .inner-wrapper form .honor-code-summary p {
+          color: #a0a0a0;
+          font-family: "Open Sans", Verdana, Geneva, sans-serif; }
+        .modal .inner-wrapper form .honor-code-summary hr {
+          border: none;
+          margin-top: 30px;
+          position: relative;
+          z-index: 2; }
+          .modal .inner-wrapper form .honor-code-summary hr::after {
+            bottom: 0px;
+            content: "";
+            display: block;
+            position: absolute;
+            top: -1px; }
+        .modal .inner-wrapper form .honor-code-summary ul {
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          margin: 0;
+          padding: 0 0 0 20px;
+          width: 100%; }
+          .modal .inner-wrapper form .honor-code-summary ul li {
+            color: #a0a0a0;
+            font: 300 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
+            margin-bottom: 10px; }
+            .modal .inner-wrapper form .honor-code-summary ul li:last-child {
+              margin-bottom: 0px; }
+      .modal .inner-wrapper form .submit {
+        padding-top: 10px; }
+        .modal .inner-wrapper form .submit input[type="submit"] {
+          display: block;
+          height: 45px;
+          margin: 0 auto;
+          width: 100%; }
+    .modal .inner-wrapper .login-extra {
+      position: relative;
+      z-index: 2; }
+      .modal .inner-wrapper .login-extra p {
+        color: #a0a0a0;
+        font-style: italic;
+        text-align: center; }
+        .modal .inner-wrapper .login-extra p span {
+          color: #a0a0a0;
+          font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+          font-style: italic; }
+        .modal .inner-wrapper .login-extra p a {
+          color: #a0a0a0;
+          font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+          font-style: italic;
+          text-decoration: underline; }
+          .modal .inner-wrapper .login-extra p a:hover {
+            color: #3c3c3c; }
+        .modal .inner-wrapper .login-extra p span + a {
+          margin-left: 15px; }
+    .modal .inner-wrapper .close-modal {
+      -webkit-border-radius: 2px;
+      -moz-border-radius: 2px;
+      -ms-border-radius: 2px;
+      -o-border-radius: 2px;
+      border-radius: 2px;
+      cursor: pointer;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      padding: 10px;
+      position: absolute;
+      right: 2px;
+      top: 0px;
+      z-index: 3; }
+      .modal .inner-wrapper .close-modal .inner p {
+        color: #a0a0a0;
+        font: normal 1.2rem/1.2rem "Open Sans", Verdana, Geneva, sans-serif;
+        text-align: center;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.8);
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: ease-out;
+        -moz-transition-timing-function: ease-out;
+        -ms-transition-timing-function: ease-out;
+        -o-transition-timing-function: ease-out;
+        transition-timing-function: ease-out;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0; }
+      .modal .inner-wrapper .close-modal:hover p {
+        color: #3c3c3c; }
+
+.container.activation {
+  padding: 60px 0px 120px; }
+  .container.activation h1 {
+    margin-bottom: 20px;
+    padding: 10px; }
+  .container.activation h1 + hr {
+    margin-bottom: 30px; }
+  .container.activation .message {
+    background: #fcfcfc;
+    border: 1px solid #c8c8c8;
+    -webkit-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.2);
+    -moz-box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.2);
+    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.2);
+    -webkit-border-radius: 4px;
+    -moz-border-radius: 4px;
+    -ms-border-radius: 4px;
+    -o-border-radius: 4px;
+    border-radius: 4px;
+    margin: 0 auto;
+    padding: 40px;
+    width: 48.988%; }
+
+.home {
+  padding: 0px; }
+  .home > header {
+    background: white;
+    background-image: url("/static/images/shot-2-large.jpg");
+    background-image: url("/static/images/shot-2-large.jpg");
+    background-image: url("/static/images/shot-2-large.jpg");
+    background-image: url("/static/images/shot-2-large.jpg");
+    background-image: url("/static/images/shot-2-large.jpg");
+    background-size: cover;
+    border-bottom: 1px solid #505050;
+    -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.9), inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+    -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.9), inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+    box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.9), inset 0 -1px 5px 0 rgba(0, 0, 0, 0.1);
+    zoom: 1;
+    margin-top: -69px;
+    overflow: hidden;
+    padding: 149px 0px 90px;
+    width: 100%; }
+    .home > header:before, .home > header:after {
+      content: "";
+      display: table; }
+    .home > header:after {
+      clear: both; }
+    .home > header .outer-wrapper {
+      max-width: 1200px;
+      margin: 0 auto;
+      padding: 0 10px;
+      position: relative;
+      text-align: center; }
+      .home > header .outer-wrapper:hover .main-cta {
+        -webkit-box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.35);
+        -moz-box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.35);
+        box-shadow: 0 1px 16px 0 rgba(29, 157, 217, 0.35); }
+    .home > header .inner-wrapper {
+      background: rgba(255, 255, 255, 0.9);
+      border: 1px solid #646464;
+      -webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+      -moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+      box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      padding: 20px 30px 30px;
+      position: relative;
+      text-align: center;
+      z-index: 1; }
+    .home > header .title {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      position: relative;
+      text-align: left;
+      vertical-align: middle; }
+      .home > header .title::after {
+        content: "";
+        display: block;
+        height: 170px;
+        position: absolute;
+        right: -1px;
+        top: -20px; }
+      .home > header .title h1 {
+        border-bottom: 1px solid #c8c8c8;
+        margin-bottom: 25px;
+        padding-bottom: 15px;
+        text-align: left;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+      .home > header .title .main-cta {
+        zoom: 1;
+        float: left;
+        margin-right: 2.024%;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 48.988%; }
+        .home > header .title .main-cta:before, .home > header .title .main-cta:after {
+          content: "";
+          display: table; }
+        .home > header .title .main-cta:after {
+          clear: both; }
+        .home > header .title .main-cta > a.find-courses {
+          border: 1px solid #002e88;
+          border-bottom: 1px solid #001e5f;
+          -webkit-border-radius: 5px;
+          -moz-border-radius: 5px;
+          -ms-border-radius: 5px;
+          -o-border-radius: 5px;
+          border-radius: 5px;
+          -webkit-box-shadow: inset 0 1px 0 0 #42bae5;
+          -moz-box-shadow: inset 0 1px 0 0 #42bae5;
+          box-shadow: inset 0 1px 0 0 #42bae5;
+          color: white;
+          display: inline;
+          font-size: 14px;
+          font-weight: bold;
+          background-color: #1d9dd9;
+          background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d9dd9), color-stop(50%, #006bb8), color-stop(50%, #0052a9), color-stop(100%, #0057ab));
+          background-image: -webkit-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -moz-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -ms-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -o-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          padding: 7px 20px 8px;
+          text-align: center;
+          text-decoration: none;
+          text-shadow: 0 -1px 1px #001067;
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          -ms-border-radius: 3px;
+          -o-border-radius: 3px;
+          border-radius: 3px;
+          display: block;
+          font: normal 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
+          letter-spacing: 1px;
+          padding: 10px 0px;
+          text-transform: uppercase;
+          text-align: center;
+          width: 100%; }
+          .home > header .title .main-cta > a.find-courses:hover {
+            cursor: pointer;
+            background-color: #108ec7;
+            background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #108ec7), color-stop(50%, #005fa6), color-stop(50%, #004897), color-stop(100%, #004d9a));
+            background-image: -webkit-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -moz-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -ms-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -o-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%); }
+          .home > header .title .main-cta > a.find-courses:active {
+            -webkit-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+            -moz-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+            box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white; }
+          .home > header .title .main-cta > a.find-courses:hover {
+            color: white; }
+      .home > header .title .secondary-actions {
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        zoom: 1;
+        float: left;
+        height: 47px;
+        width: 48.988%; }
+        .home > header .title .secondary-actions:before, .home > header .title .secondary-actions:after {
+          content: "";
+          display: table; }
+        .home > header .title .secondary-actions:after {
+          clear: both; }
+        .home > header .title .secondary-actions a.intro-video {
+          background: #f5f5f5;
+          background-image: -webkit-linear-gradient(-90deg, #fafafa, #ebebeb);
+          background-image: -moz-linear-gradient(-90deg, #fafafa, #ebebeb);
+          background-image: -ms-linear-gradient(-90deg, #fafafa, #ebebeb);
+          background-image: -o-linear-gradient(-90deg, #fafafa, #ebebeb);
+          background-image: linear-gradient(-90deg, #fafafa, #ebebeb);
+          border: 1px solid #c8c8c8;
+          -webkit-border-radius: 30px;
+          -moz-border-radius: 30px;
+          -ms-border-radius: 30px;
+          -o-border-radius: 30px;
+          border-radius: 30px;
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          -webkit-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+          -moz-box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+          box-shadow: inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+          zoom: 1;
+          display: block;
+          float: left;
+          height: 100%;
+          overflow: hidden;
+          text-align: middle;
+          width: 48.988%; }
+          .home > header .title .secondary-actions a.intro-video:before, .home > header .title .secondary-actions a.intro-video:after {
+            content: "";
+            display: table; }
+          .home > header .title .secondary-actions a.intro-video:after {
+            clear: both; }
+          .home > header .title .secondary-actions a.intro-video:hover {
+            text-decoration: none; }
+            .home > header .title .secondary-actions a.intro-video:hover p {
+              color: #3c3c3c; }
+            .home > header .title .secondary-actions a.intro-video:hover .video {
+              opacity: 1; }
+          .home > header .title .secondary-actions a.intro-video .video {
+            background-image: url("/static/images/shot-2-large.jpg");
+            background-image: url("/static/images/shot-2-large.jpg");
+            background-image: url("/static/images/shot-2-large.jpg");
+            background-image: url("/static/images/shot-2-large.jpg");
+            background-image: url("/static/images/shot-2-large.jpg");
+            background-size: cover;
+            border-right: 1px solid #c8c8c8;
+            -webkit-border-top-left-radius: 30px;
+            -moz-border-top-left-radius: 30px;
+            -moz-border-radius-topleft: 30px;
+            -ms-border-top-left-radius: 30px;
+            -o-border-top-left-radius: 30px;
+            border-top-left-radius: 30px;
+            -webkit-border-bottom-left-radius: 30px;
+            -moz-border-bottom-left-radius: 30px;
+            -moz-border-radius-bottomleft: 30px;
+            -ms-border-bottom-left-radius: 30px;
+            -o-border-bottom-left-radius: 30px;
+            border-bottom-left-radius: 30px;
+            -webkit-box-shadow: 1px 0 0 0 rgba(255, 255, 255, 0.6), inset 1px 0 0 0 rgba(255, 255, 255, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.7);
+            -moz-box-shadow: 1px 0 0 0 rgba(255, 255, 255, 0.6), inset 1px 0 0 0 rgba(255, 255, 255, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.7);
+            box-shadow: 1px 0 0 0 rgba(255, 255, 255, 0.6), inset 1px 0 0 0 rgba(255, 255, 255, 0.8), inset 0 0 0 1px rgba(255, 255, 255, 0.7);
+            float: left;
+            height: 100%;
+            opacity: 0.8;
+            position: relative;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: linear;
+            -moz-transition-timing-function: linear;
+            -ms-transition-timing-function: linear;
+            -o-transition-timing-function: linear;
+            transition-timing-function: linear;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            width: 60px;
+            vertical-align: middle; }
+            .home > header .title .secondary-actions a.intro-video .video .play {
+              background-image: url("/static/images/portal-icons/video-play-icon.png");
+              background-image: url("/static/images/portal-icons/video-play-icon.png");
+              background-image: url("/static/images/portal-icons/video-play-icon.png");
+              background-image: url("/static/images/portal-icons/video-play-icon.png");
+              background-image: url("/static/images/portal-icons/video-play-icon.png");
+              background-size: cover;
+              height: 31px;
+              margin-left: -13px;
+              margin-top: -15px;
+              left: 50%;
+              position: absolute;
+              top: 50%;
+              width: 31px; }
+          .home > header .title .secondary-actions a.intro-video p {
+            color: #a0a0a0;
+            font-style: italic;
+            padding-top: 10px;
+            text-align: center;
+            text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: linear;
+            -moz-transition-timing-function: linear;
+            -ms-transition-timing-function: linear;
+            -o-transition-timing-function: linear;
+            transition-timing-function: linear;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            vertical-align: middle; }
+        .home > header .title .secondary-actions .social-sharing {
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          float: left;
+          height: 44px;
+          margin-right: 2.024%;
+          position: relative;
+          text-align: center;
+          width: 48.988%; }
+          .home > header .title .secondary-actions .social-sharing:hover .sharing-message {
+            opacity: 1;
+            top: 56px; }
+          .home > header .title .secondary-actions .social-sharing .sharing-message {
+            background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+            background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+            background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+            background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+            background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+            border: 1px solid rgba(0, 0, 0, 0.5);
+            -webkit-border-radius: 4px;
+            -moz-border-radius: 4px;
+            -ms-border-radius: 4px;
+            -o-border-radius: 4px;
+            border-radius: 4px;
+            -webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+            -moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+            box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+            -webkit-box-sizing: border-box;
+            -moz-box-sizing: border-box;
+            box-sizing: border-box;
+            color: white;
+            float: right;
+            font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+            font-size: 0.9em;
+            font-style: italic;
+            left: 50%;
+            margin-left: -110px;
+            opacity: 0;
+            padding: 6px 10px;
+            position: absolute;
+            text-align: center;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            top: 65px;
+            width: 220px; }
+            .home > header .title .secondary-actions .social-sharing .sharing-message:hover {
+              opacity: 0; }
+          .home > header .title .secondary-actions .social-sharing .share {
+            height: 44px;
+            display: -moz-inline-box;
+            -moz-box-orient: vertical;
+            display: inline-block;
+            vertical-align: baseline;
+            zoom: 1;
+            *display: inline;
+            *vertical-align: auto;
+            margin-right: 10px;
+            opacity: 0.5;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: linear;
+            -moz-transition-timing-function: linear;
+            -ms-transition-timing-function: linear;
+            -o-transition-timing-function: linear;
+            transition-timing-function: linear;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            width: 44px; }
+            .home > header .title .secondary-actions .social-sharing .share:hover {
+              opacity: 1; }
+            .home > header .title .secondary-actions .social-sharing .share img {
+              width: 100%; }
+            .home > header .title .secondary-actions .social-sharing .share:last-child {
+              margin-right: 0px; }
+    .home > header .media {
+      background: #fff;
+      border: 1px solid #c8c8c8;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      float: left;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      padding: 1px;
+      position: relative;
+      vertical-align: middle;
+      width: 23.482%;
+      z-index: 2; }
+      .home > header .media .hero {
+        height: 100%;
+        overflow: hidden;
+        position: relative; }
+        .home > header .media .hero .play-intro {
+          background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          -webkit-border-radius: 4px;
+          -moz-border-radius: 4px;
+          -ms-border-radius: 4px;
+          -o-border-radius: 4px;
+          border-radius: 4px;
+          -webkit-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          -moz-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          border: 2px solid rgba(255, 255, 255, 0.8);
+          height: 80px;
+          left: 50%;
+          margin-top: -40px;
+          margin-left: -40px;
+          position: absolute;
+          top: 50%;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 80px; }
+          .home > header .media .hero .play-intro::after {
+            color: rgba(255, 255, 255, 0.8);
+            content: "\25B6";
+            display: block;
+            font: normal 2em/1em "Open Sans", Verdana, Geneva, sans-serif;
+            left: 50%;
+            margin-left: -11px;
+            margin-top: -16px;
+            position: absolute;
+            text-shadow: 0 -1px rgba(0, 0, 0, 0.8);
+            top: 50%; }
+        .home > header .media .hero img {
+          display: block;
+          width: 100%; }
+      .home > header .media:hover {
+        cursor: pointer; }
+        .home > header .media:hover .play-intro {
+          background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          -webkit-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          -moz-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          border-color: rgba(255, 255, 255, 0.9); }
+          .home > header .media:hover .play-intro::after {
+            color: white; }
+  .home .highlighted-courses {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    margin-bottom: 40px;
+    position: relative;
+    width: 100%;
+    z-index: 1; }
+    .home .highlighted-courses > h2 {
+      background-image: -webkit-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -moz-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -ms-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -o-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: linear-gradient(-90deg, #fafafa, #e6e6e6);
+      border: 1px solid #c8c8c8;
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      border-top-color: #bebebe;
+      -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 0px 12px 0 rgba(0, 0, 0, 0.2);
+      -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 0px 12px 0 rgba(0, 0, 0, 0.2);
+      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4), 0 0px 12px 0 rgba(0, 0, 0, 0.2);
+      color: #a0a0a0;
+      letter-spacing: 1px;
+      margin-bottom: 0px;
+      margin-top: -15px;
+      padding: 10px 10px 8px;
+      text-align: center;
+      text-transform: uppercase;
+      text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+      .home .highlighted-courses > h2 .lowercase {
+        color: #a0a0a0;
+        font-family: inherit;
+        font-size: inherit;
+        font-style: inherit;
+        text-transform: none; }
+  .home .university-partners {
+    background-image: -webkit-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
+    background-image: -moz-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
+    background-image: -ms-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
+    background-image: -o-linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
+    background-image: linear-gradient(180deg, rgba(245, 245, 245, 0) 0%, #f5f5f5 50%, rgba(245, 245, 245, 0) 100%);
+    border-bottom: 1px solid #d2d2d2;
+    margin-bottom: 0px;
+    overflow: hidden;
+    position: relative;
+    width: 100%; }
+    .home .university-partners::before {
+      content: "";
+      display: block; }
+    .home .university-partners::after {
+      content: "";
+      display: block; }
+    .home .university-partners .partners {
+      margin: 0 auto;
+      padding: 20px 0px;
+      text-align: center; }
+      .home .university-partners .partners li.partner {
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        padding: 0px 30px;
+        position: relative;
+        vertical-align: middle; }
+        .home .university-partners .partners li.partner::before {
+          content: "";
+          display: block;
+          height: 80px;
+          right: 0px;
+          position: absolute;
+          top: -5px;
+          width: 1px; }
+        .home .university-partners .partners li.partner::after {
+          content: "";
+          display: block;
+          height: 80px;
+          right: 1px;
+          position: absolute;
+          top: -5px;
+          width: 1px; }
+        .home .university-partners .partners li.partner:last-child::before {
+          display: none; }
+        .home .university-partners .partners li.partner:last-child::after {
+          display: none; }
+      .home .university-partners .partners a {
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.25s;
+        -moz-transition-duration: 0.25s;
+        -ms-transition-duration: 0.25s;
+        -o-transition-duration: 0.25s;
+        transition-duration: 0.25s;
+        -webkit-transition-timing-function: ease-in-out;
+        -moz-transition-timing-function: ease-in-out;
+        -ms-transition-timing-function: ease-in-out;
+        -o-transition-timing-function: ease-in-out;
+        transition-timing-function: ease-in-out;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0; }
+        .home .university-partners .partners a::before {
+          background-image: -webkit-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+          background-image: -moz-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+          background-image: -ms-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+          background-image: -o-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+          background-image: radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+          content: "";
+          display: block;
+          height: 200px;
+          left: 50%;
+          margin-left: -100px;
+          margin-top: -100px;
+          opacity: 0;
+          width: 200px;
+          position: absolute;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.25s;
+          -moz-transition-duration: 0.25s;
+          -ms-transition-duration: 0.25s;
+          -o-transition-duration: 0.25s;
+          transition-duration: 0.25s;
+          -webkit-transition-timing-function: ease-in-out;
+          -moz-transition-timing-function: ease-in-out;
+          -ms-transition-timing-function: ease-in-out;
+          -o-transition-timing-function: ease-in-out;
+          transition-timing-function: ease-in-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          top: 50%;
+          z-index: 1; }
+        .home .university-partners .partners a .name {
+          bottom: -60px;
+          left: 0px;
+          position: absolute;
+          text-align: center;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.25s;
+          -moz-transition-duration: 0.25s;
+          -ms-transition-duration: 0.25s;
+          -o-transition-duration: 0.25s;
+          transition-duration: 0.25s;
+          -webkit-transition-timing-function: ease-in-out;
+          -moz-transition-timing-function: ease-in-out;
+          -ms-transition-timing-function: ease-in-out;
+          -o-transition-timing-function: ease-in-out;
+          transition-timing-function: ease-in-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 100%;
+          z-index: 2; }
+          .home .university-partners .partners a .name > span {
+            color: #3c3c3c;
+            font: 800 italic 1.4em/1.4em "Open Sans", Verdana, Geneva, sans-serif;
+            text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-in-out;
+            -moz-transition-timing-function: ease-in-out;
+            -ms-transition-timing-function: ease-in-out;
+            -o-transition-timing-function: ease-in-out;
+            transition-timing-function: ease-in-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0; }
+            .home .university-partners .partners a .name > span:hover {
+              color: #a0a0a0; }
+        .home .university-partners .partners a img {
+          max-width: 160px;
+          position: relative;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.25s;
+          -moz-transition-duration: 0.25s;
+          -ms-transition-duration: 0.25s;
+          -o-transition-duration: 0.25s;
+          transition-duration: 0.25s;
+          -webkit-transition-timing-function: ease-in-out;
+          -moz-transition-timing-function: ease-in-out;
+          -ms-transition-timing-function: ease-in-out;
+          -o-transition-timing-function: ease-in-out;
+          transition-timing-function: ease-in-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          vertical-align: middle;
+          z-index: 2; }
+        .home .university-partners .partners a:hover::before {
+          opacity: 1; }
+        .home .university-partners .partners a:hover .name {
+          bottom: 20px; }
+        .home .university-partners .partners a:hover img {
+          top: -100px; }
+  .home .more-info {
+    border: 1px solid #c8c8c8;
+    margin-bottom: 80px;
+    width: 100%; }
+    .home .more-info header {
+      background-image: -webkit-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -moz-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -ms-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: -o-linear-gradient(-90deg, #fafafa, #e6e6e6);
+      background-image: linear-gradient(-90deg, #fafafa, #e6e6e6);
+      border-bottom: 1px solid #c8c8c8;
+      zoom: 1;
+      padding: 10px 20px 8px; }
+      .home .more-info header:before, .home .more-info header:after {
+        content: "";
+        display: table; }
+      .home .more-info header:after {
+        clear: both; }
+      .home .more-info header h2 {
+        float: left;
+        margin: 0px;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+      .home .more-info header a {
+        color: #a0a0a0;
+        float: right;
+        font-style: italic;
+        font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+        padding-top: 3px;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+        .home .more-info header a:hover {
+          color: #3c3c3c; }
+    .home .more-info .news {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      padding: 20px;
+      width: 100%; }
+      .home .more-info .news .blog-posts {
+        zoom: 1; }
+        .home .more-info .news .blog-posts:before, .home .more-info .news .blog-posts:after {
+          content: "";
+          display: table; }
+        .home .more-info .news .blog-posts:after {
+          clear: both; }
+        .home .more-info .news .blog-posts > article {
+          border: 1px dotted transparent;
+          border-color: #dcdcdc;
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          zoom: 1;
+          float: left;
+          margin-right: 2.024%;
+          padding: 10px;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 31.984%; }
+          .home .more-info .news .blog-posts > article:before, .home .more-info .news .blog-posts > article:after {
+            content: "";
+            display: table; }
+          .home .more-info .news .blog-posts > article:after {
+            clear: both; }
+          .home .more-info .news .blog-posts > article:hover {
+            background: #f8f8f8;
+            border: 1px solid #dcdcdc;
+            -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
+            -moz-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
+            box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.1); }
+          .home .more-info .news .blog-posts > article:last-child {
+            margin-right: 0px; }
+          .home .more-info .news .blog-posts > article .post-graphics {
+            border: 1px solid #bebebe;
+            -webkit-box-sizing: border-box;
+            -moz-box-sizing: border-box;
+            box-sizing: border-box;
+            display: block;
+            float: left;
+            height: 65px;
+            margin-right: 2.024%;
+            overflow: hidden;
+            width: 31.984%;
+            vertical-align: top; }
+            .home .more-info .news .blog-posts > article .post-graphics img {
+              min-height: 100%;
+              max-width: 100%; }
+          .home .more-info .news .blog-posts > article .post-name {
+            float: left;
+            width: 65.992%;
+            vertical-align: top; }
+            .home .more-info .news .blog-posts > article .post-name a {
+              color: #3c3c3c;
+              font: 700 1em/1.2em "Open Sans", Verdana, Geneva, sans-serif; }
+              .home .more-info .news .blog-posts > article .post-name a:hover {
+                color: #1d9dd9;
+                text-decoration: underline; }
+            .home .more-info .news .blog-posts > article .post-name .post-date {
+              color: #a0a0a0;
+              letter-spacing: 1px; }
+
+.dashboard {
+  zoom: 1;
+  padding: 60px 0px 120px; }
+  .dashboard:before, .dashboard:after {
+    content: "";
+    display: table; }
+  .dashboard:after {
+    clear: both; }
+  .dashboard .profile-sidebar {
+    background: transparent;
+    float: left;
+    margin-right: 2.024%;
+    width: 23.482%; }
+    .dashboard .profile-sidebar header.profile h1.user-name {
+      border: 1px solid #c8c8c8;
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      color: #3c3c3c;
+      font: 700 1.2em/1.2em "Open Sans", Verdana, Geneva, sans-serif;
+      margin: 0px;
+      overflow: hidden;
+      padding: 15px 10px 17px;
+      text-wrap: nowrap;
+      text-overflow: ellipsis;
+      text-transform: none;
+      width: 100%; }
+    .dashboard .profile-sidebar header.profile .user-info {
+      zoom: 1;
+      padding: 0px 10px; }
+      .dashboard .profile-sidebar header.profile .user-info:before, .dashboard .profile-sidebar header.profile .user-info:after {
+        content: "";
+        display: table; }
+      .dashboard .profile-sidebar header.profile .user-info:after {
+        clear: both; }
+      .dashboard .profile-sidebar header.profile .user-info > ul {
+        background: #fafafa;
+        border: 1px solid #c8c8c8;
+        border-top: none;
+        -webkit-border-bottom-left-radius: 4px;
+        -moz-border-bottom-left-radius: 4px;
+        -moz-border-radius-bottomleft: 4px;
+        -ms-border-bottom-left-radius: 4px;
+        -o-border-bottom-left-radius: 4px;
+        border-bottom-left-radius: 4px;
+        -webkit-border-bottom-right-radius: 4px;
+        -moz-border-bottom-right-radius: 4px;
+        -moz-border-radius-bottomright: 4px;
+        -ms-border-bottom-right-radius: 4px;
+        -o-border-bottom-right-radius: 4px;
+        border-bottom-right-radius: 4px;
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+        -moz-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+        box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+        zoom: 1;
+        margin: 0px;
+        padding: 20px 10px 10px;
+        width: 100%; }
+        .dashboard .profile-sidebar header.profile .user-info > ul:before, .dashboard .profile-sidebar header.profile .user-info > ul:after {
+          content: "";
+          display: table; }
+        .dashboard .profile-sidebar header.profile .user-info > ul:after {
+          clear: both; }
+        .dashboard .profile-sidebar header.profile .user-info > ul li {
+          zoom: 1;
+          border-bottom: 1px dotted #dcdcdc;
+          list-style: none;
+          margin-bottom: 20px;
+          padding-bottom: 10px; }
+          .dashboard .profile-sidebar header.profile .user-info > ul li:before, .dashboard .profile-sidebar header.profile .user-info > ul li:after {
+            content: "";
+            display: table; }
+          .dashboard .profile-sidebar header.profile .user-info > ul li:after {
+            clear: both; }
+          .dashboard .profile-sidebar header.profile .user-info > ul li:hover .title .icon {
+            opacity: 1; }
+          .dashboard .profile-sidebar header.profile .user-info > ul li span.title {
+            color: #a0a0a0;
+            float: left;
+            font-family: "Open Sans", Verdana, Geneva, sans-serif; }
+            .dashboard .profile-sidebar header.profile .user-info > ul li span.title .icon {
+              background-size: cover;
+              float: left;
+              height: 19px;
+              margin: 2px 8px 0 0;
+              opacity: 0.6;
+              -webkit-transition-property: all;
+              -moz-transition-property: all;
+              -ms-transition-property: all;
+              -o-transition-property: all;
+              transition-property: all;
+              -webkit-transition-duration: 0.15s;
+              -moz-transition-duration: 0.15s;
+              -ms-transition-duration: 0.15s;
+              -o-transition-duration: 0.15s;
+              transition-duration: 0.15s;
+              -webkit-transition-timing-function: linear;
+              -moz-transition-timing-function: linear;
+              -ms-transition-timing-function: linear;
+              -o-transition-timing-function: linear;
+              transition-timing-function: linear;
+              -webkit-transition-delay: 0;
+              -moz-transition-delay: 0;
+              -ms-transition-delay: 0;
+              -o-transition-delay: 0;
+              transition-delay: 0;
+              width: 19px; }
+              .dashboard .profile-sidebar header.profile .user-info > ul li span.title .icon.email-icon {
+                background-image: url("/static/images/portal-icons/email-icon.png");
+                background-image: url("/static/images/portal-icons/email-icon.png");
+                background-image: url("/static/images/portal-icons/email-icon.png");
+                background-image: url("/static/images/portal-icons/email-icon.png");
+                background-image: url("/static/images/portal-icons/email-icon.png"); }
+              .dashboard .profile-sidebar header.profile .user-info > ul li span.title .icon.location-icon {
+                background-image: url("/static/images/portal-icons/home-icon.png");
+                background-image: url("/static/images/portal-icons/home-icon.png");
+                background-image: url("/static/images/portal-icons/home-icon.png");
+                background-image: url("/static/images/portal-icons/home-icon.png");
+                background-image: url("/static/images/portal-icons/home-icon.png"); }
+              .dashboard .profile-sidebar header.profile .user-info > ul li span.title .icon.language-icon {
+                background-image: url("/static/images/portal-icons/language-icon.png");
+                background-image: url("/static/images/portal-icons/language-icon.png");
+                background-image: url("/static/images/portal-icons/language-icon.png");
+                background-image: url("/static/images/portal-icons/language-icon.png");
+                background-image: url("/static/images/portal-icons/language-icon.png"); }
+          .dashboard .profile-sidebar header.profile .user-info > ul li span.data {
+            color: #a0a0a0;
+            font-weight: 700;
+            margin-left: 12px; }
+  .dashboard .my-courses {
+    float: left;
+    margin: 0px;
+    width: 74.494%; }
+    .dashboard .my-courses > header {
+      border-bottom: 1px solid #d2d2d2;
+      margin-bottom: 30px; }
+    .dashboard .my-courses .empty-dashboard-message {
+      padding: 80px 0px;
+      text-align: center; }
+      .dashboard .my-courses .empty-dashboard-message p {
+        color: #a0a0a0;
+        font-style: italic;
+        margin-bottom: 20px;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+      .dashboard .my-courses .empty-dashboard-message a {
+        background: #f0f0f0;
+        background-image: -webkit-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+        background-image: -moz-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+        background-image: -ms-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+        background-image: -o-linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+        background-image: linear-gradient(-90deg, #f5f5f5 0%, #f3f3f3 50%, #ededed 50%, #ebebeb 100%);
+        border: 1px solid #dcdcdc;
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        -ms-border-radius: 4px;
+        -o-border-radius: 4px;
+        border-radius: 4px;
+        -webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
+        -moz-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
+        box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        color: #3c3c3c;
+        font-family: "Open Sans", Verdana, Geneva, sans-serif;
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        letter-spacing: 1px;
+        margin-left: 5px;
+        padding: 5px 10px;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+        .dashboard .my-courses .empty-dashboard-message a:hover {
+          color: #1d9dd9;
+          text-decoration: none; }
+    .dashboard .my-courses .my-course {
+      background: #fafafa;
+      background-image: -webkit-linear-gradient(-90deg, #fdfdfd, #f0f0f0);
+      background-image: -moz-linear-gradient(-90deg, #fdfdfd, #f0f0f0);
+      background-image: -ms-linear-gradient(-90deg, #fdfdfd, #f0f0f0);
+      background-image: -o-linear-gradient(-90deg, #fdfdfd, #f0f0f0);
+      background-image: linear-gradient(-90deg, #fdfdfd, #f0f0f0);
+      border: 1px solid #bebebe;
+      -webkit-border-radius: 3px;
+      -moz-border-radius: 3px;
+      -ms-border-radius: 3px;
+      -o-border-radius: 3px;
+      border-radius: 3px;
+      -webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+      -moz-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+      box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 -1px 0 0 rgba(255, 255, 255, 0.8), inset 0 1px 0 0 rgba(255, 255, 255, 0.8);
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      zoom: 1;
+      margin-right: 2.024%;
+      margin-bottom: 25px;
+      overflow: hidden;
+      position: relative;
+      width: 100%;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0; }
+      .dashboard .my-courses .my-course:before, .dashboard .my-courses .my-course:after {
+        content: "";
+        display: table; }
+      .dashboard .my-courses .my-course:after {
+        clear: both; }
+      .dashboard .my-courses .my-course:last-child {
+        margin-bottom: none; }
+      .dashboard .my-courses .my-course .cover {
+        background: #e1e1e1;
+        background-size: cover;
+        background-position: center center;
+        border-right: 1px solid #969696;
+        -webkit-border-top-left-radius: 3px;
+        -moz-border-top-left-radius: 3px;
+        -moz-border-radius-topleft: 3px;
+        -ms-border-top-left-radius: 3px;
+        -o-border-top-left-radius: 3px;
+        border-top-left-radius: 3px;
+        -webkit-border-bottom-left-radius: 3px;
+        -moz-border-bottom-left-radius: 3px;
+        -moz-border-radius-bottomleft: 3px;
+        -ms-border-bottom-left-radius: 3px;
+        -o-border-bottom-left-radius: 3px;
+        border-bottom-left-radius: 3px;
+        -webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), 1px 0 0 0 rgba(255, 255, 255, 0.8);
+        -moz-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), 1px 0 0 0 rgba(255, 255, 255, 0.8);
+        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6), 1px 0 0 0 rgba(255, 255, 255, 0.8);
+        float: left;
+        height: 120px;
+        margin: 0px;
+        position: relative;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 200px; }
+        .dashboard .my-courses .my-course .cover .shade {
+          background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          -webkit-border-radius: 4px;
+          -moz-border-radius: 4px;
+          -ms-border-radius: 4px;
+          -o-border-radius: 4px;
+          border-radius: 4px;
+          bottom: 0px;
+          content: "";
+          display: block;
+          left: 0px;
+          position: absolute;
+          top: 0px;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          right: 0px; }
+        .dashboard .my-courses .my-course .cover .arrow {
+          border-top: 8px solid;
+          border-left: 8px solid;
+          border-color: rgba(0, 0, 0, 0.7);
+          -webkit-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.8), -1px 0 1px 0 rgba(255, 255, 255, 0.8);
+          -moz-box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.8), -1px 0 1px 0 rgba(255, 255, 255, 0.8);
+          box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.8), -1px 0 1px 0 rgba(255, 255, 255, 0.8);
+          content: "";
+          display: block;
+          height: 55px;
+          left: 50%;
+          margin-left: -10px;
+          margin-top: -30px;
+          opacity: 0;
+          position: absolute;
+          top: 50%;
+          -webkit-transform: rotate(-45deg);
+          -moz-transform: rotate(-45deg);
+          -ms-transform: rotate(-45deg);
+          -o-transform: rotate(-45deg);
+          transform: rotate(-45deg);
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 55px; }
+        .dashboard .my-courses .my-course .cover:hover .shade {
+          background: rgba(255, 255, 255, 0.3);
+          background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+          background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); }
+      .dashboard .my-courses .my-course .info {
+        left: 201px;
+        padding: 0px 10px;
+        position: absolute;
+        right: 0px;
+        top: 0px;
+        z-index: 2; }
+        .dashboard .my-courses .my-course .info > hgroup {
+          border-bottom: 1px solid #d2d2d2;
+          -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          padding: 12px 0px;
+          width: 100%; }
+          .dashboard .my-courses .my-course .info > hgroup a.university {
+            background: white;
+            border: 1px solid #b4b4b4;
+            -webkit-border-radius: 3px;
+            -moz-border-radius: 3px;
+            -ms-border-radius: 3px;
+            -o-border-radius: 3px;
+            border-radius: 3px;
+            -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2), 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            -moz-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2), 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.2), 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            color: #a0a0a0;
+            display: block;
+            font-style: italic;
+            font-weight: 800;
+            display: -moz-inline-box;
+            -moz-box-orient: vertical;
+            display: inline-block;
+            vertical-align: baseline;
+            zoom: 1;
+            *display: inline;
+            *vertical-align: auto;
+            margin-right: 10px;
+            padding: 5px 10px;
+            vertical-align: middle; }
+            .dashboard .my-courses .my-course .info > hgroup a.university:hover {
+              color: #1d9dd9;
+              text-decoration: none; }
+          .dashboard .my-courses .my-course .info > hgroup h3 {
+            display: -moz-inline-box;
+            -moz-box-orient: vertical;
+            display: inline-block;
+            vertical-align: baseline;
+            zoom: 1;
+            *display: inline;
+            *vertical-align: auto;
+            margin-bottom: 0px;
+            vertical-align: middle; }
+            .dashboard .my-courses .my-course .info > hgroup h3 a {
+              color: #3c3c3c;
+              font-weight: 700;
+              text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+              text-overflow: ellipsis;
+              white-space: nowrap; }
+              .dashboard .my-courses .my-course .info > hgroup h3 a:hover {
+                text-decoration: underline; }
+        .dashboard .my-courses .my-course .info .course-status {
+          background: #fffcdd;
+          border: 1px solid #c8c8c8;
+          -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+          margin-top: 16px;
+          padding: 5px; }
+          .dashboard .my-courses .my-course .info .course-status p {
+            color: #a0a0a0;
+            font-style: italic;
+            letter-spacing: 1px;
+            text-align: center; }
+        .dashboard .my-courses .my-course .info .meta {
+          zoom: 1;
+          margin-top: 22px;
+          position: relative;
+          -webkit-transition-property: opacity;
+          -moz-transition-property: opacity;
+          -ms-transition-property: opacity;
+          -o-transition-property: opacity;
+          transition-property: opacity;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 100%; }
+          .dashboard .my-courses .my-course .info .meta:before, .dashboard .my-courses .my-course .info .meta:after {
+            content: "";
+            display: table; }
+          .dashboard .my-courses .my-course .info .meta:after {
+            clear: both; }
+          .dashboard .my-courses .my-course .info .meta .course-work-icon {
+            background-image: url("/static/images/portal-icons/pencil-icon.png");
+            background-image: url("/static/images/portal-icons/pencil-icon.png");
+            background-image: url("/static/images/portal-icons/pencil-icon.png");
+            background-image: url("/static/images/portal-icons/pencil-icon.png");
+            background-image: url("/static/images/portal-icons/pencil-icon.png");
+            background-size: cover;
+            float: left;
+            height: 22px;
+            opacity: 0.7;
+            width: 22px; }
+          .dashboard .my-courses .my-course .info .meta .complete {
+            float: right; }
+            .dashboard .my-courses .my-course .info .meta .complete p {
+              color: #a0a0a0;
+              font-style: italic;
+              display: -moz-inline-box;
+              -moz-box-orient: vertical;
+              display: inline-block;
+              vertical-align: baseline;
+              zoom: 1;
+              *display: inline;
+              *vertical-align: auto;
+              text-align: right;
+              text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+              .dashboard .my-courses .my-course .info .meta .complete p .completeness {
+                color: #3c3c3c;
+                font-weight: 700;
+                margin-right: 5px; }
+          .dashboard .my-courses .my-course .info .meta .progress, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-none, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-none, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-some, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-some, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-done, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-done {
+            -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+            left: 35px;
+            position: absolute;
+            right: 130px; }
+            .dashboard .my-courses .my-course .info .meta .progress .meter, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-none .meter, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-none .meter, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-some .meter, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-some .meter, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-done .meter, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-done .meter {
+              background: #f5f5f5;
+              border: 1px solid #a0a0a0;
+              -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+              -moz-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+              box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+              -webkit-box-sizing: border-box;
+              -moz-box-sizing: border-box;
+              box-sizing: border-box;
+              -webkit-border-radius: 4px;
+              -moz-border-radius: 4px;
+              -ms-border-radius: 4px;
+              -o-border-radius: 4px;
+              border-radius: 4px;
+              height: 22px;
+              margin: 0 auto;
+              padding: 2px;
+              width: 100%; }
+              .dashboard .my-courses .my-course .info .meta .progress .meter .meter-fill, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-none .meter .meter-fill, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-none .meter .meter-fill, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-some .meter .meter-fill, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-some .meter .meter-fill, .dashboard .my-courses .my-course .info .meta nav.sequence-nav ol li a.progress-done .meter .meter-fill, nav.sequence-nav ol li .dashboard .my-courses .my-course .info .meta a.progress-done .meter .meter-fill {
+                background: #1d9dd9;
+                background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%);
+                background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%);
+                background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%);
+                background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%);
+                background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%);
+                background-size: 40px 40px;
+                background-repeat: repeat-x;
+                border: 1px solid #737373;
+                -webkit-border-radius: 4px;
+                -moz-border-radius: 4px;
+                -ms-border-radius: 4px;
+                -o-border-radius: 4px;
+                border-radius: 4px;
+                -webkit-box-sizing: border-box;
+                -moz-box-sizing: border-box;
+                box-sizing: border-box;
+                content: "";
+                display: block;
+                height: 100%;
+                width: 60%; }
+      .dashboard .my-courses .my-course:hover .cover .shade {
+        background: rgba(255, 255, 255, 0.1);
+        background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+        background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+        background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+        background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%);
+        background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.3) 0%, rgba(0, 0, 0, 0.3) 100%); }
+      .dashboard .my-courses .my-course:hover .cover .arrow {
+        opacity: 1; }
+
+nav.course-material {
+  background: #d2d2d2;
+  zoom: 1;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.05);
+  -moz-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.05);
+  box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.05);
+  border-bottom: 1px solid #bebebe;
+  margin: 0px auto 0px;
+  padding: 0px;
+  width: 100%; }
+  nav.course-material:before, nav.course-material:after {
+    content: "";
+    display: table; }
+  nav.course-material:after {
+    clear: both; }
+  nav.course-material .inner-wrapper {
+    margin: 0 auto;
+    max-width: 1200px;
+    width: 100%; }
+  nav.course-material ol.course-tabs {
+    -webkit-border-top-left-radius: 4px;
+    -moz-border-top-left-radius: 4px;
+    -moz-border-radius-topleft: 4px;
+    -ms-border-top-left-radius: 4px;
+    -o-border-top-left-radius: 4px;
+    border-top-left-radius: 4px;
+    -webkit-border-top-right-radius: 4px;
+    -moz-border-top-right-radius: 4px;
+    -moz-border-radius-topright: 4px;
+    -ms-border-top-right-radius: 4px;
+    -o-border-top-right-radius: 4px;
+    border-top-right-radius: 4px;
+    zoom: 1;
+    padding: 10px 0 0 0; }
+    nav.course-material ol.course-tabs:before, nav.course-material ol.course-tabs:after {
+      content: "";
+      display: table; }
+    nav.course-material ol.course-tabs:after {
+      clear: both; }
+    nav.course-material ol.course-tabs li {
+      float: left;
+      list-style: none; }
+      nav.course-material ol.course-tabs li a {
+        color: #a0a0a0;
+        display: block;
+        text-align: center;
+        padding: 5px 13px;
+        text-decoration: none;
+        text-shadow: 0 1px rgba(255, 255, 255, 0.4); }
+        nav.course-material ol.course-tabs li a:hover {
+          color: #3c3c3c; }
+        nav.course-material ol.course-tabs li a.active, nav.course-material nav.sequence-nav ol.course-tabs li a.seq_video_active, nav.sequence-nav nav.course-material ol.course-tabs li a.seq_video_active, nav.course-material nav.sequence-nav ol.course-tabs li a.seq_other_active, nav.sequence-nav nav.course-material ol.course-tabs li a.seq_other_active, nav.course-material nav.sequence-nav ol.course-tabs li a.seq_vertical_active, nav.sequence-nav nav.course-material ol.course-tabs li a.seq_vertical_active, nav.course-material nav.sequence-nav ol.course-tabs li a.seq_problem_active, nav.sequence-nav nav.course-material ol.course-tabs li a.seq_problem_active {
+          background: white;
+          border: 1px solid #c8c8c8;
+          border-bottom: 0px;
+          -webkit-border-top-left-radius: 4px;
+          -moz-border-top-left-radius: 4px;
+          -moz-border-radius-topleft: 4px;
+          -ms-border-top-left-radius: 4px;
+          -o-border-top-left-radius: 4px;
+          border-top-left-radius: 4px;
+          -webkit-border-top-right-radius: 4px;
+          -moz-border-top-right-radius: 4px;
+          -moz-border-radius-topright: 4px;
+          -ms-border-top-right-radius: 4px;
+          -o-border-top-right-radius: 4px;
+          border-top-right-radius: 4px;
+          -webkit-box-shadow: 0 2px 0 0 white;
+          -moz-box-shadow: 0 2px 0 0 white;
+          box-shadow: 0 2px 0 0 white;
+          color: #3c3c3c; }
+
+.course-content {
+  margin-top: 30px; }
+  .course-content .courseware {
+    background: #f0f0f0;
+    height: 600px; }
+
+.find-courses, .university-profile {
+  background: #fcfcfc;
+  padding-bottom: 60px; }
+  .find-courses header.search, .university-profile header.search {
+    background: #f0f0f0;
+    background-size: cover;
+    border-bottom: 1px solid #646464;
+    -webkit-box-shadow: inset 0 -1px 8px 0 rgba(0, 0, 0, 0.2), inset 0 1px 12px 0 rgba(0, 0, 0, 0.3);
+    -moz-box-shadow: inset 0 -1px 8px 0 rgba(0, 0, 0, 0.2), inset 0 1px 12px 0 rgba(0, 0, 0, 0.3);
+    box-shadow: inset 0 -1px 8px 0 rgba(0, 0, 0, 0.2), inset 0 1px 12px 0 rgba(0, 0, 0, 0.3);
+    margin-top: -69px;
+    width: 100%; }
+    .find-courses header.search .inner-wrapper, .university-profile header.search .inner-wrapper {
+      height: 120px;
+      margin: 0 auto;
+      max-width: 1200px;
+      overflow: hidden;
+      padding: 154px 0px 80px;
+      position: relative;
+      text-align: center;
+      width: 100%; }
+      .find-courses header.search .inner-wrapper::before, .university-profile header.search .inner-wrapper::before {
+        background-image: -webkit-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -moz-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -ms-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: -o-radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+        background-image: radial-gradient(50% 50%, circle closest-side, white 0%, rgba(255, 255, 255, 0) 100%);
+        bottom: -300px;
+        content: "";
+        display: none;
+        height: 600px;
+        margin: 0 auto;
+        position: absolute;
+        width: 100%;
+        z-index: 1; }
+      .find-courses header.search .inner-wrapper > hgroup, .university-profile header.search .inner-wrapper > hgroup {
+        background: rgba(255, 255, 255, 0.9);
+        border: 1px solid #646464;
+        -webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        -moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        padding: 20px 30px;
+        position: relative;
+        z-index: 2; }
+      .find-courses header.search .inner-wrapper.main-search, .find-courses header.search .inner-wrapper.university-search, .university-profile header.search .inner-wrapper.main-search, .university-profile header.search .inner-wrapper.university-search {
+        text-align: center; }
+        .find-courses header.search .inner-wrapper.main-search hgroup, .find-courses header.search .inner-wrapper.university-search hgroup, .university-profile header.search .inner-wrapper.main-search hgroup, .university-profile header.search .inner-wrapper.university-search hgroup {
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto; }
+        .find-courses header.search .inner-wrapper.main-search .logo, .find-courses header.search .inner-wrapper.university-search .logo, .university-profile header.search .inner-wrapper.main-search .logo, .university-profile header.search .inner-wrapper.university-search .logo {
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          height: 80px;
+          margin-right: 30px;
+          padding-right: 30px;
+          position: relative;
+          vertical-align: middle; }
+          .find-courses header.search .inner-wrapper.main-search .logo::after, .find-courses header.search .inner-wrapper.university-search .logo::after, .university-profile header.search .inner-wrapper.main-search .logo::after, .university-profile header.search .inner-wrapper.university-search .logo::after {
+            content: "";
+            display: block;
+            height: 80px;
+            position: absolute;
+            right: 0px;
+            top: 0px; }
+          .find-courses header.search .inner-wrapper.main-search .logo img, .find-courses header.search .inner-wrapper.university-search .logo img, .university-profile header.search .inner-wrapper.main-search .logo img, .university-profile header.search .inner-wrapper.university-search .logo img {
+            height: 100%; }
+        .find-courses header.search .inner-wrapper.main-search h1, .find-courses header.search .inner-wrapper.university-search h1, .university-profile header.search .inner-wrapper.main-search h1, .university-profile header.search .inner-wrapper.university-search h1 {
+          color: #3c3c3c;
+          font-family: "Open Sans", Verdana, Geneva, sans-serif;
+          font-style: italic;
+          font-weight: 800;
+          letter-spacing: 0px;
+          text-transform: none; }
+        .find-courses header.search .inner-wrapper.main-search h1, .find-courses header.search .inner-wrapper.main-search h2, .find-courses header.search .inner-wrapper.university-search h1, .find-courses header.search .inner-wrapper.university-search h2, .university-profile header.search .inner-wrapper.main-search h1, .university-profile header.search .inner-wrapper.main-search h2, .university-profile header.search .inner-wrapper.university-search h1, .university-profile header.search .inner-wrapper.university-search h2 {
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          letter-spacing: 1px;
+          margin-bottom: 0px;
+          text-shadow: 0 1px rgba(255, 255, 255, 0.8);
+          vertical-align: middle; }
+
+.course-info .container {
+  padding-bottom: 120px; }
+.course-info header.course-profile {
+  background: #f5f5f5;
+  background-image: url("/static/images/shot-2-large.jpg");
+  background-image: url("/static/images/shot-2-large.jpg");
+  background-image: url("/static/images/shot-2-large.jpg");
+  background-image: url("/static/images/shot-2-large.jpg");
+  background-image: url("/static/images/shot-2-large.jpg");
+  background-size: cover;
+  -webkit-box-shadow: 0 1px 80px 0 rgba(0, 0, 0, 0.5);
+  -moz-box-shadow: 0 1px 80px 0 rgba(0, 0, 0, 0.5);
+  box-shadow: 0 1px 80px 0 rgba(0, 0, 0, 0.5);
+  border-bottom: 1px solid #646464;
+  -webkit-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 1px 5px 0 rgba(0, 0, 0, 0.1);
+  margin-top: -69px;
+  overflow: hidden;
+  padding: 134px 0px 60px;
+  position: relative;
+  width: 100%; }
+  .course-info header.course-profile .intro-inner-wrapper {
+    background: rgba(255, 255, 255, 0.9);
+    border: 1px solid #646464;
+    -webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+    -moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+    box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    zoom: 1;
+    margin: 0 auto;
+    max-width: 1200px;
+    padding: 0px 10px;
+    position: relative;
+    width: 1180px;
+    z-index: 2; }
+    .course-info header.course-profile .intro-inner-wrapper:before, .course-info header.course-profile .intro-inner-wrapper:after {
+      content: "";
+      display: table; }
+    .course-info header.course-profile .intro-inner-wrapper:after {
+      clear: both; }
+    .course-info header.course-profile .intro-inner-wrapper .intro {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      zoom: 1;
+      float: left;
+      padding: 20px 20px;
+      position: relative;
+      width: 68.016%;
+      z-index: 2; }
+      .course-info header.course-profile .intro-inner-wrapper .intro:before, .course-info header.course-profile .intro-inner-wrapper .intro:after {
+        content: "";
+        display: table; }
+      .course-info header.course-profile .intro-inner-wrapper .intro:after {
+        clear: both; }
+      .course-info header.course-profile .intro-inner-wrapper .intro > hgroup {
+        border-bottom: 1px solid #d2d2d2;
+        -webkit-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        -moz-box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6);
+        margin-bottom: 30px;
+        padding-bottom: 15px;
+        width: 100%; }
+        .course-info header.course-profile .intro-inner-wrapper .intro > hgroup h1 {
+          color: #3c3c3c;
+          font-weight: 700;
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          margin: 0 10px 0 0;
+          letter-spacing: 0px;
+          text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
+        .course-info header.course-profile .intro-inner-wrapper .intro > hgroup h2 {
+          display: -moz-inline-box;
+          -moz-box-orient: vertical;
+          display: inline-block;
+          vertical-align: baseline;
+          zoom: 1;
+          *display: inline;
+          *vertical-align: auto;
+          margin: 0; }
+          .course-info header.course-profile .intro-inner-wrapper .intro > hgroup h2 a {
+            color: #a0a0a0;
+            font: italic 800 1em/1em "Open Sans", Verdana, Geneva, sans-serif;
+            letter-spacing: 0px;
+            text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+            text-transform: none; }
+            .course-info header.course-profile .intro-inner-wrapper .intro > hgroup h2 a:hover {
+              color: #1d9dd9; }
+      .course-info header.course-profile .intro-inner-wrapper .intro .main-cta {
+        zoom: 1;
+        float: left;
+        margin-right: 2.024%;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 48.988%; }
+        .course-info header.course-profile .intro-inner-wrapper .intro .main-cta:before, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta:after {
+          content: "";
+          display: table; }
+        .course-info header.course-profile .intro-inner-wrapper .intro .main-cta:after {
+          clear: both; }
+        .course-info header.course-profile .intro-inner-wrapper .intro .main-cta > a.find-courses, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register {
+          border: 1px solid #002e88;
+          border-bottom: 1px solid #001e5f;
+          -webkit-border-radius: 5px;
+          -moz-border-radius: 5px;
+          -ms-border-radius: 5px;
+          -o-border-radius: 5px;
+          border-radius: 5px;
+          -webkit-box-shadow: inset 0 1px 0 0 #42bae5;
+          -moz-box-shadow: inset 0 1px 0 0 #42bae5;
+          box-shadow: inset 0 1px 0 0 #42bae5;
+          color: white;
+          display: inline;
+          font-size: 14px;
+          font-weight: bold;
+          background-color: #1d9dd9;
+          background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d9dd9), color-stop(50%, #006bb8), color-stop(50%, #0052a9), color-stop(100%, #0057ab));
+          background-image: -webkit-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -moz-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -ms-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: -o-linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          background-image: linear-gradient(top, #1d9dd9 0%, #006bb8 50%, #0052a9 50%, #0057ab 100%);
+          padding: 7px 20px 8px;
+          text-align: center;
+          text-decoration: none;
+          text-shadow: 0 -1px 1px #001067;
+          -webkit-box-sizing: border-box;
+          -moz-box-sizing: border-box;
+          box-sizing: border-box;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          -ms-border-radius: 3px;
+          -o-border-radius: 3px;
+          border-radius: 3px;
+          display: block;
+          font: normal 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
+          letter-spacing: 1px;
+          padding: 10px 0px;
+          text-transform: uppercase;
+          text-align: center;
+          width: 100%; }
+          .course-info header.course-profile .intro-inner-wrapper .intro .main-cta > a.find-courses:hover, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register:hover {
+            cursor: pointer;
+            background-color: #108ec7;
+            background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #108ec7), color-stop(50%, #005fa6), color-stop(50%, #004897), color-stop(100%, #004d9a));
+            background-image: -webkit-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -moz-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -ms-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: -o-linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%);
+            background-image: linear-gradient(top, #108ec7 0%, #005fa6 50%, #004897 50%, #004d9a 100%); }
+          .course-info header.course-profile .intro-inner-wrapper .intro .main-cta > a.find-courses:active, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register:active {
+            -webkit-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+            -moz-box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white;
+            box-shadow: inset 0 0 20px 0 #00295f, 0 1px 0 white; }
+          .course-info header.course-profile .intro-inner-wrapper .intro .main-cta > a.find-courses:hover, .course-info header.course-profile .intro-inner-wrapper .intro .main-cta a.register:hover {
+            color: white; }
+    .course-info header.course-profile .intro-inner-wrapper .media {
+      background: #fff;
+      border-left: 1px solid #646464;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      display: block;
+      float: right;
+      padding: 1px;
+      position: relative;
+      width: 31.984%;
+      z-index: 2; }
+      .course-info header.course-profile .intro-inner-wrapper .media .hero {
+        height: 180px;
+        overflow: hidden;
+        position: relative; }
+        .course-info header.course-profile .intro-inner-wrapper .media .hero .play-intro {
+          background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.75));
+          -webkit-border-radius: 4px;
+          -moz-border-radius: 4px;
+          -ms-border-radius: 4px;
+          -o-border-radius: 4px;
+          border-radius: 4px;
+          -webkit-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          -moz-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.4);
+          border: 2px solid rgba(255, 255, 255, 0.8);
+          height: 80px;
+          left: 50%;
+          margin-top: -40px;
+          margin-left: -40px;
+          position: absolute;
+          top: 50%;
+          width: 80px; }
+          .course-info header.course-profile .intro-inner-wrapper .media .hero .play-intro::after {
+            color: rgba(255, 255, 255, 0.8);
+            content: "\25B6";
+            display: block;
+            font: normal 2em/1em "Open Sans", Verdana, Geneva, sans-serif;
+            left: 50%;
+            margin-left: -11px;
+            margin-top: -16px;
+            position: absolute;
+            text-shadow: 0 -1px rgba(0, 0, 0, 0.8);
+            top: 50%; }
+        .course-info header.course-profile .intro-inner-wrapper .media .hero img {
+          display: block;
+          width: 100%; }
+      .course-info header.course-profile .intro-inner-wrapper .media:hover {
+        cursor: pointer; }
+        .course-info header.course-profile .intro-inner-wrapper .media:hover .play-intro {
+          background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.8));
+          -webkit-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          -moz-box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          box-shadow: 0 1px 12px 0 rgba(0, 0, 0, 0.5);
+          border-color: rgba(255, 255, 255, 0.9); }
+          .course-info header.course-profile .intro-inner-wrapper .media:hover .play-intro::after {
+            color: white; }
+.course-info .container {
+  zoom: 1; }
+  .course-info .container:before, .course-info .container:after {
+    content: "";
+    display: table; }
+  .course-info .container:after {
+    clear: both; }
+  .course-info .container nav {
+    border-bottom: 1px solid #dcdcdc;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    zoom: 1;
+    margin: 40px 0;
+    width: 100%; }
+    .course-info .container nav:before, .course-info .container nav:after {
+      content: "";
+      display: table; }
+    .course-info .container nav:after {
+      clear: both; }
+    .course-info .container nav::after {
+      content: "";
+      display: none; }
+    .course-info .container nav a {
+      border-bottom: 3px solid transparent;
+      color: #a0a0a0;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      letter-spacing: 1px;
+      margin: 0 15px;
+      padding: 0px 5px 15px;
+      text-align: center;
+      text-transform: lowercase; }
+      .course-info .container nav a:first-child {
+        margin-left: 0px; }
+      .course-info .container nav a:hover, .course-info .container nav a.active, .course-info .container nav.sequence-nav ol li a.seq_video_active, .course-info .container nav.sequence-nav ol li a.seq_other_active, .course-info .container nav.sequence-nav ol li a.seq_vertical_active, .course-info .container nav.sequence-nav ol li a.seq_problem_active {
+        border-color: #c8c8c8;
+        color: #3c3c3c;
+        text-decoration: none; }
+.course-info .details {
+  float: left;
+  margin-right: 2.024%;
+  width: 65.992%; }
+  .course-info .details .inner-wrapper > section {
+    margin-bottom: 40px; }
+  .course-info .details .inner-wrapper .course-staff .teacher {
+    margin-bottom: 40px; }
+    .course-info .details .inner-wrapper .course-staff .teacher h3 {
+      color: #3c3c3c;
+      font-family: "Open Sans", Verdana, Geneva, sans-serif;
+      font-weight: 700;
+      margin-bottom: 15px;
+      text-transform: none; }
+    .course-info .details .inner-wrapper .course-staff .teacher .teacher-image {
+      background: white;
+      border: 1px solid #c8c8c8;
+      float: left;
+      margin: 0 15px 15px 0;
+      padding: 1px; }
+.course-info .course-sidebar {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+  -moz-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+  box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.15);
+  border: 1px solid #c8c8c8;
+  border-top: none;
+  float: left;
+  padding: 16px 20px 30px;
+  width: 31.984%; }
+  .course-info .course-sidebar header {
+    margin-bottom: 30px;
+    padding-bottom: 16px;
+    position: relative;
+    text-align: center; }
+    .course-info .course-sidebar header::after {
+      content: "";
+      display: block;
+      height: 1px;
+      position: absolute;
+      bottom: 0px;
+      width: 100%;
+      z-index: 1; }
+    .course-info .course-sidebar header a.university-name {
+      border-right: 1px solid #c8c8c8;
+      color: #3c3c3c;
+      font-family: "Open Sans", Verdana, Geneva, sans-serif;
+      font-style: italic;
+      font-weight: 800;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      letter-spacing: 0px;
+      margin-right: 15px;
+      padding-right: 15px; }
+      .course-info .course-sidebar header a.university-name:hover {
+        color: #a0a0a0; }
+    .course-info .course-sidebar header .social-sharing {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      float: left;
+      height: 44px;
+      position: relative;
+      text-align: center;
+      width: 100%;
+      z-index: 2;
+      float: none; }
+      .course-info .course-sidebar header .social-sharing:hover .sharing-message {
+        opacity: 1;
+        top: 56px; }
+      .course-info .course-sidebar header .social-sharing .sharing-message {
+        background-image: -webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+        background-image: -moz-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+        background-image: -ms-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+        background-image: -o-linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+        background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 100%);
+        border: 1px solid rgba(0, 0, 0, 0.5);
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        -ms-border-radius: 4px;
+        -o-border-radius: 4px;
+        border-radius: 4px;
+        -webkit-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        -moz-box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        box-shadow: 0 4px 25px 0 rgba(0, 0, 0, 0.5);
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        color: white;
+        float: right;
+        font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+        font-size: 0.9em;
+        font-style: italic;
+        left: 50%;
+        margin-left: -110px;
+        opacity: 0;
+        padding: 6px 10px;
+        position: absolute;
+        text-align: center;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: ease-out;
+        -moz-transition-timing-function: ease-out;
+        -ms-transition-timing-function: ease-out;
+        -o-transition-timing-function: ease-out;
+        transition-timing-function: ease-out;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        top: 65px;
+        width: 220px; }
+        .course-info .course-sidebar header .social-sharing .sharing-message:hover {
+          opacity: 0; }
+      .course-info .course-sidebar header .social-sharing .share {
+        height: 44px;
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        margin-right: 10px;
+        opacity: 0.5;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 44px; }
+        .course-info .course-sidebar header .social-sharing .share:hover {
+          opacity: 1; }
+        .course-info .course-sidebar header .social-sharing .share img {
+          width: 100%; }
+        .course-info .course-sidebar header .social-sharing .share:last-child {
+          margin-right: 0px; }
+  .course-info .course-sidebar .important-dates {
+    list-style: none;
+    margin: 0px;
+    padding: 0px 10px; }
+    .course-info .course-sidebar .important-dates li {
+      zoom: 1;
+      border-bottom: 1px dotted #dcdcdc;
+      margin-bottom: 20px;
+      padding-bottom: 10px; }
+      .course-info .course-sidebar .important-dates li:before, .course-info .course-sidebar .important-dates li:after {
+        content: "";
+        display: table; }
+      .course-info .course-sidebar .important-dates li:after {
+        clear: both; }
+      .course-info .course-sidebar .important-dates li:hover .icon {
+        opacity: 1; }
+      .course-info .course-sidebar .important-dates li p {
+        color: #a0a0a0;
+        float: left;
+        font-family: "Open Sans", Verdana, Geneva, sans-serif; }
+      .course-info .course-sidebar .important-dates li .icon {
+        background-size: cover;
+        float: left;
+        height: 19px;
+        margin: 2px 10px 0 0;
+        opacity: 0.6;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: linear;
+        -moz-transition-timing-function: linear;
+        -ms-transition-timing-function: linear;
+        -o-transition-timing-function: linear;
+        transition-timing-function: linear;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 19px; }
+        .course-info .course-sidebar .important-dates li .icon.start-icon {
+          background-image: url("/static/images/portal-icons/calendar-icon.png");
+          background-image: url("/static/images/portal-icons/calendar-icon.png");
+          background-image: url("/static/images/portal-icons/calendar-icon.png");
+          background-image: url("/static/images/portal-icons/calendar-icon.png");
+          background-image: url("/static/images/portal-icons/calendar-icon.png"); }
+        .course-info .course-sidebar .important-dates li .icon.final-icon {
+          background-image: url("/static/images/portal-icons/pencil-icon.png");
+          background-image: url("/static/images/portal-icons/pencil-icon.png");
+          background-image: url("/static/images/portal-icons/pencil-icon.png");
+          background-image: url("/static/images/portal-icons/pencil-icon.png");
+          background-image: url("/static/images/portal-icons/pencil-icon.png"); }
+        .course-info .course-sidebar .important-dates li .icon.length-icon {
+          background-image: url("/static/images/portal-icons/chart-icon.png");
+          background-image: url("/static/images/portal-icons/chart-icon.png");
+          background-image: url("/static/images/portal-icons/chart-icon.png");
+          background-image: url("/static/images/portal-icons/chart-icon.png");
+          background-image: url("/static/images/portal-icons/chart-icon.png"); }
+        .course-info .course-sidebar .important-dates li .icon.number-icon {
+          background-image: url("/static/images/portal-icons/course-info-icon.png");
+          background-image: url("/static/images/portal-icons/course-info-icon.png");
+          background-image: url("/static/images/portal-icons/course-info-icon.png");
+          background-image: url("/static/images/portal-icons/course-info-icon.png");
+          background-image: url("/static/images/portal-icons/course-info-icon.png"); }
+      .course-info .course-sidebar .important-dates li span {
+        float: right;
+        font-weight: 700; }
+
+.container.jobs {
+  padding: 60px 0 120px; }
+  .container.jobs h1 + hr {
+    margin-bottom: 80px; }
+  .container.jobs .message {
+    zoom: 1;
+    margin-bottom: 80px;
+    position: relative; }
+    .container.jobs .message:before, .container.jobs .message:after {
+      content: "";
+      display: table; }
+    .container.jobs .message:after {
+      clear: both; }
+    .container.jobs .message .photo {
+      background: white;
+      border: 1px solid #d2d2d2;
+      float: left;
+      margin-right: 2.024%;
+      padding: 1px;
+      width: 31.984%; }
+      .container.jobs .message .photo img {
+        background: #f5f5f5;
+        display: block;
+        height: 200px;
+        width: 100%; }
+  .container.jobs .jobs-wrapper {
+    zoom: 1;
+    float: left;
+    padding-top: 80px;
+    width: 100%; }
+    .container.jobs .jobs-wrapper:before, .container.jobs .jobs-wrapper:after {
+      content: "";
+      display: table; }
+    .container.jobs .jobs-wrapper:after {
+      clear: both; }
+    .container.jobs .jobs-wrapper > h2 {
+      display: none;
+      margin-bottom: 60px;
+      padding-bottom: 20px; }
+    .container.jobs .jobs-wrapper .jobs-sidebar {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      border: 1px solid #dcdcdc;
+      float: left;
+      padding: 20px;
+      width: 23.482%; }
+      .container.jobs .jobs-wrapper .jobs-sidebar nav {
+        margin-bottom: 40px; }
+        .container.jobs .jobs-wrapper .jobs-sidebar nav a {
+          display: block;
+          letter-spacing: 1px;
+          margin: 0px -20px;
+          padding: 12px 0px 12px 20px;
+          text-align: left; }
+          .container.jobs .jobs-wrapper .jobs-sidebar nav a:hover {
+            background: #f5f5f5;
+            text-decoration: none; }
+      .container.jobs .jobs-wrapper .jobs-sidebar p + h2 {
+        margin-top: 40px; }
+    .container.jobs .jobs-wrapper .jobs-listing {
+      float: left;
+      margin-right: 2.024%;
+      width: 74.494%; }
+      .container.jobs .jobs-wrapper .jobs-listing .job {
+        border-bottom: 1px solid #dcdcdc;
+        padding: 40px 0px; }
+        .container.jobs .jobs-wrapper .jobs-listing .job:first-child {
+          padding-top: 0px; }
+        .container.jobs .jobs-wrapper .jobs-listing .job:last-child {
+          border: none;
+          padding-bottom: 0px; }
+        .container.jobs .jobs-wrapper .jobs-listing .job h3 {
+          font-family: "Open Sans", Verdana, Geneva, sans-serif;
+          font-weight: 700;
+          margin-bottom: 15px; }
+
+.container.about {
+  padding: 20px 10px 120px; }
+  .container.about > nav {
+    margin-bottom: 80px;
+    text-align: center;
+    width: 100%; }
+    .container.about > nav::after {
+      content: "";
+      display: block; }
+    .container.about > nav a {
+      border-bottom: 3px solid transparent;
+      color: #a0a0a0;
+      font-family: Georgia, Cambria, "Times New Roman", Times, serif;
+      font-style: italic;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      letter-spacing: 1px;
+      margin: 0px 15px;
+      padding: 20px 10px;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: linear;
+      -moz-transition-timing-function: linear;
+      -ms-transition-timing-function: linear;
+      -o-transition-timing-function: linear;
+      transition-timing-function: linear;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0;
+      text-transform: lowercase; }
+      .container.about > nav a:hover, .container.about > nav a.active, .container.about > nav nav.sequence-nav ol li a.seq_video_active, nav.sequence-nav ol li .container.about > nav a.seq_video_active, .container.about > nav nav.sequence-nav ol li a.seq_other_active, nav.sequence-nav ol li .container.about > nav a.seq_other_active, .container.about > nav nav.sequence-nav ol li a.seq_vertical_active, nav.sequence-nav ol li .container.about > nav a.seq_vertical_active, .container.about > nav nav.sequence-nav ol li a.seq_problem_active, nav.sequence-nav ol li .container.about > nav a.seq_problem_active {
+        border-color: #c8c8c8;
+        color: #3c3c3c;
+        text-decoration: none; }
+  .container.about .vision h1 + hr {
+    margin-bottom: 80px; }
+  .container.about .vision .message {
+    zoom: 1;
+    margin-bottom: 60px;
+    padding-bottom: 60px;
+    position: relative; }
+    .container.about .vision .message:before, .container.about .vision .message:after {
+      content: "";
+      display: table; }
+    .container.about .vision .message:after {
+      clear: both; }
+    .container.about .vision .message hr {
+      bottom: 0px;
+      margin: 0px;
+      position: absolute;
+      width: 100%; }
+    .container.about .vision .message .photo {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      background: white;
+      border: 1px solid #d2d2d2;
+      padding: 1px;
+      width: 31.984%; }
+      .container.about .vision .message .photo img {
+        background: #f5f5f5;
+        display: block;
+        height: 200px;
+        width: 100%; }
+    .container.about .vision .message > article {
+      float: left;
+      width: 65.992%; }
+    .container.about .vision .message.left .photo {
+      float: left;
+      margin-right: 2.024%; }
+    .container.about .vision .message.right .photo {
+      float: right;
+      margin-left: 2.024%; }
+    .container.about .vision .message:last-child {
+      margin-bottom: 0px; }
+  .container.about .faq {
+    zoom: 1; }
+    .container.about .faq:before, .container.about .faq:after {
+      content: "";
+      display: table; }
+    .container.about .faq:after {
+      clear: both; }
+    .container.about .faq nav.categories {
+      border: 1px solid #dcdcdc;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      float: left;
+      margin-left: 2.024%;
+      padding: 20px;
+      width: 23.482%; }
+      .container.about .faq nav.categories a {
+        display: block;
+        letter-spacing: 1px;
+        margin: 0px -20px;
+        padding: 12px 0px 12px 20px;
+        text-align: left; }
+        .container.about .faq nav.categories a:hover {
+          background: #f5f5f5;
+          text-decoration: none; }
+    .container.about .faq .responses {
+      float: left;
+      width: 74.494%; }
+      .container.about .faq .responses .category {
+        padding-top: 40px; }
+        .container.about .faq .responses .category:first-child {
+          padding-top: 0px; }
+        .container.about .faq .responses .category > h2 {
+          border-bottom: 1px solid #dcdcdc;
+          margin-bottom: 40px;
+          padding-bottom: 20px; }
+      .container.about .faq .responses .response {
+        margin-bottom: 40px; }
+        .container.about .faq .responses .response h3 {
+          font-family: "Open Sans", Verdana, Geneva, sans-serif;
+          font-weight: 700;
+          margin-bottom: 15px; }
+  .container.about .press .press-resources {
+    zoom: 1;
+    margin-bottom: 60px; }
+    .container.about .press .press-resources:before, .container.about .press .press-resources:after {
+      content: "";
+      display: table; }
+    .container.about .press .press-resources:after {
+      clear: both; }
+    .container.about .press .press-resources .pressreleases, .container.about .press .press-resources .identity-assets {
+      background: #f5f5f5;
+      border: 1px solid #c8c8c8;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      float: left;
+      padding: 20px 30px;
+      text-align: center;
+      width: 48.988%; }
+    .container.about .press .press-resources .pressreleases {
+      margin-right: 2.024%; }
+  .container.about .press .press-story {
+    border-bottom: 1px solid #dcdcdc;
+    zoom: 1;
+    margin-bottom: 40px;
+    padding-bottom: 40px; }
+    .container.about .press .press-story:before, .container.about .press .press-story:after {
+      content: "";
+      display: table; }
+    .container.about .press .press-story:after {
+      clear: both; }
+    .container.about .press .press-story:last-child {
+      border: none;
+      margin: 0px;
+      padding: 0px; }
+    .container.about .press .press-story .article-cover {
+      background: white;
+      border: 1px solid #787878;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      float: left;
+      height: 120px;
+      margin-right: 2.024%;
+      overflow: hidden;
+      width: 14.98%; }
+      .container.about .press .press-story .article-cover img {
+        display: block;
+        min-height: 100%;
+        width: 100%; }
+    .container.about .press .press-story .press-info {
+      float: left;
+      width: 82.996%; }
+      .container.about .press .press-story .press-info header {
+        margin-bottom: 10px; }
+        .container.about .press .press-story .press-info header h3 {
+          font-family: "Open Sans", Verdana, Geneva, sans-serif;
+          font-weight: 700;
+          margin-bottom: 5px; }
+        .container.about .press .press-story .press-info header span.post-date {
+          color: #a0a0a0;
+          margin-right: 10px; }
+  .container.about .contact {
+    zoom: 1;
+    margin: 0 auto;
+    width: 82.996%; }
+    .container.about .contact:before, .container.about .contact:after {
+      content: "";
+      display: table; }
+    .container.about .contact:after {
+      clear: both; }
+    .container.about .contact .map {
+      background: #f5f5f5;
+      float: left;
+      height: 280px;
+      margin-right: 2.024%;
+      overflow: hidden;
+      width: 48.988%; }
+      .container.about .contact .map img {
+        min-height: 100%;
+        max-width: 100%; }
+    .container.about .contact .contacts {
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      float: left;
+      padding-left: 40px;
+      width: 48.988%; }
+      .container.about .contact .contacts ul {
+        list-style: none;
+        margin: 0px;
+        padding: 0px; }
+        .container.about .contact .contacts ul li {
+          margin-bottom: 10px; }
+
+.pressrelease {
+  background: #fafafa; }
+  .pressrelease .container {
+    padding: 60px 0 120px; }
+    .pressrelease .container h1 + hr {
+      margin-bottom: 60px; }
+    .pressrelease .container h3 + hr {
+      margin-bottom: 60px; }
+    .pressrelease .container h3 {
+      color: #a0a0a0;
+      font-style: italic;
+      margin-bottom: 30px;
+      text-align: center; }
+    .pressrelease .container > article {
+      border: 1px solid #dcdcdc;
+      -webkit-border-radius: 10px;
+      -moz-border-radius: 10px;
+      -ms-border-radius: 10px;
+      -o-border-radius: 10px;
+      border-radius: 10px;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      -webkit-box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.1);
+      -moz-box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.1);
+      box-shadow: 0 2px 16px 0 rgba(0, 0, 0, 0.1);
+      margin: 0 auto;
+      padding: 80px 80px 40px 80px;
+      width: 82.996%; }
+      .pressrelease .container > article .footer hr {
+        margin: 80px 0px 40px; }
+    .pressrelease .container p + h2 {
+      margin-top: 60px; }
+    .pressrelease .container h2 + p {
+      margin-top: 30px; }
+
+html {
+  height: 100%;
+  max-height: 100%; }
+
+body.courseware {
+  height: 100%;
+  max-height: 100%; }
+  body.courseware .container {
+    margin-bottom: 40px;
+    margin-top: 20px; }
+  body.courseware footer.fixed-bottom {
+    Position: static; }
+
+div.course-wrapper ul, div.course-wrapper ol {
+  list-style: none; }
+div.course-wrapper section.course-content {
+  -webkit-border-radius: 0 4px 4px 0;
+  -moz-border-radius: 0 4px 4px 0;
+  -ms-border-radius: 0 4px 4px 0;
+  -o-border-radius: 0 4px 4px 0;
+  border-radius: 0 4px 4px 0; }
+  div.course-wrapper section.course-content h1 {
+    margin: 0 0 22.652px; }
+  div.course-wrapper section.course-content p {
+    margin-bottom: 22.652px; }
+    div.course-wrapper section.course-content p:empty {
+      display: none;
+      margin-bottom: 0; }
+  div.course-wrapper section.course-content ul li {
+    margin-bottom: 11.326px; }
+  div.course-wrapper section.course-content .problem-set, div.course-wrapper section.course-content section.problems-wrapper, div.course-wrapper section.course-content div#seq_content, div.course-wrapper section.course-content ol.vert-mod > li, div.course-wrapper section.course-content section.problems-wrapper, div.course-wrapper section.course-content div#seq_content {
+    position: relative; }
+    div.course-wrapper section.course-content .problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2, div.course-wrapper section.course-content ol.vert-mod > li h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2 {
+      margin-top: 0;
+      margin-bottom: 15px;
+      width: 20.109%;
+      padding-right: 2.717%;
+      border-right: 1px dashed #ddd;
+      -webkit-box-sizing: border-box;
+      -moz-box-sizing: border-box;
+      box-sizing: border-box;
+      display: table-cell;
+      vertical-align: top; }
+      div.course-wrapper section.course-content .problem-set h2.problem-header section.staff, div.course-wrapper section.course-content section.problems-wrapper h2.problem-header section.staff, div.course-wrapper section.course-content div#seq_content h2.problem-header section.staff, div.course-wrapper section.course-content ol.vert-mod > li h2.problem-header section.staff, div.course-wrapper section.course-content section.problems-wrapper h2.problem-header section.staff, div.course-wrapper section.course-content div#seq_content h2.problem-header section.staff {
+        margin-top: 30px;
+        font-size: 80%; }
+      @media screen and (max-width:1120px) {
+        div.course-wrapper section.course-content .problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2, div.course-wrapper section.course-content ol.vert-mod > li h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2 {
+          display: block;
+          width: auto;
+          border-right: 0; } }
+      @media print {
+        div.course-wrapper section.course-content .problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2, div.course-wrapper section.course-content ol.vert-mod > li h2, div.course-wrapper section.course-content section.problems-wrapper h2, div.course-wrapper section.course-content div#seq_content h2 {
+          display: block;
+          width: auto;
+          border-right: 0; } }
+    div.course-wrapper section.course-content .problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem, div.course-wrapper section.course-content ol.vert-mod > li section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem {
+      display: table-cell;
+      width: 77.174%;
+      padding-left: 2.717%; }
+      @media screen and (max-width:1120px) {
+        div.course-wrapper section.course-content .problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem, div.course-wrapper section.course-content ol.vert-mod > li section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem {
+          display: block;
+          width: auto;
+          padding: 0; } }
+      @media print {
+        div.course-wrapper section.course-content .problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem, div.course-wrapper section.course-content ol.vert-mod > li section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, div.course-wrapper section.course-content div#seq_content section.problem {
+          display: block;
+          width: auto;
+          padding: 0; }
+          div.course-wrapper section.course-content .problem-set section.problem canvas, div.course-wrapper section.course-content section.problems-wrapper section.problem canvas, div.course-wrapper section.course-content div#seq_content section.problem canvas, div.course-wrapper section.course-content ol.vert-mod > li section.problem canvas, div.course-wrapper section.course-content section.problems-wrapper section.problem canvas, div.course-wrapper section.course-content div#seq_content section.problem canvas, div.course-wrapper section.course-content .problem-set section.problem img, div.course-wrapper section.course-content section.problems-wrapper section.problem img, div.course-wrapper section.course-content div#seq_content section.problem img, div.course-wrapper section.course-content ol.vert-mod > li section.problem img, div.course-wrapper section.course-content section.problems-wrapper section.problem img, div.course-wrapper section.course-content div#seq_content section.problem img {
+            page-break-inside: avoid; } }
+      div.course-wrapper section.course-content .problem-set section.problem span.unanswered, div.course-wrapper section.course-content section.problems-wrapper section.problem span.unanswered, div.course-wrapper section.course-content div#seq_content section.problem span.unanswered, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.unanswered, div.course-wrapper section.course-content section.problems-wrapper section.problem span.unanswered, div.course-wrapper section.course-content div#seq_content section.problem span.unanswered, div.course-wrapper section.course-content .problem-set section.problem span.ui-icon-bullet, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-bullet, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-bullet, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.ui-icon-bullet, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-bullet, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-bullet {
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        background: url("../images/unanswered-icon.png") center center no-repeat;
+        height: 14px;
+        position: relative;
+        top: 4px;
+        width: 14px; }
+      div.course-wrapper section.course-content .problem-set section.problem span.correct, div.course-wrapper section.course-content section.problems-wrapper section.problem span.correct, div.course-wrapper section.course-content div#seq_content section.problem span.correct, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.correct, div.course-wrapper section.course-content section.problems-wrapper section.problem span.correct, div.course-wrapper section.course-content div#seq_content section.problem span.correct, div.course-wrapper section.course-content .problem-set section.problem span.ui-icon-check, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-check, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-check, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.ui-icon-check, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-check, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-check {
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        background: url("../images/correct-icon.png") center center no-repeat;
+        height: 20px;
+        position: relative;
+        top: 6px;
+        width: 25px; }
+      div.course-wrapper section.course-content .problem-set section.problem span.incorrect, div.course-wrapper section.course-content section.problems-wrapper section.problem span.incorrect, div.course-wrapper section.course-content div#seq_content section.problem span.incorrect, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.incorrect, div.course-wrapper section.course-content section.problems-wrapper section.problem span.incorrect, div.course-wrapper section.course-content div#seq_content section.problem span.incorrect, div.course-wrapper section.course-content .problem-set section.problem span.ui-icon-close, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-close, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-close, div.course-wrapper section.course-content ol.vert-mod > li section.problem span.ui-icon-close, div.course-wrapper section.course-content section.problems-wrapper section.problem span.ui-icon-close, div.course-wrapper section.course-content div#seq_content section.problem span.ui-icon-close {
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        background: url("../images/incorrect-icon.png") center center no-repeat;
+        height: 20px;
+        width: 20px;
+        position: relative;
+        top: 6px; }
+    div.course-wrapper section.course-content .problem-set div > span, div.course-wrapper section.course-content section.problems-wrapper div > span, div.course-wrapper section.course-content div#seq_content div > span, div.course-wrapper section.course-content ol.vert-mod > li div > span, div.course-wrapper section.course-content section.problems-wrapper div > span, div.course-wrapper section.course-content div#seq_content div > span {
+      display: block;
+      margin-bottom: 11.326px; }
+      div.course-wrapper section.course-content .problem-set div > span[answer], div.course-wrapper section.course-content section.problems-wrapper div > span[answer], div.course-wrapper section.course-content div#seq_content div > span[answer], div.course-wrapper section.course-content ol.vert-mod > li div > span[answer], div.course-wrapper section.course-content section.problems-wrapper div > span[answer], div.course-wrapper section.course-content div#seq_content div > span[answer] {
+        border-top: 1px solid #ededed;
+        border-bottom: 1px solid #ededed;
+        background: #f3f3f3;
+        margin: 0 -22.652px;
+        padding: 11.326px 22.652px; }
+    div.course-wrapper section.course-content .problem-set input[type="text"], div.course-wrapper section.course-content section.problems-wrapper input[type="text"], div.course-wrapper section.course-content div#seq_content input[type="text"], div.course-wrapper section.course-content ol.vert-mod > li input[type="text"], div.course-wrapper section.course-content section.problems-wrapper input[type="text"], div.course-wrapper section.course-content div#seq_content input[type="text"] {
+      display: inline-block;
+      width: 50%; }
+    div.course-wrapper section.course-content .problem-set center, div.course-wrapper section.course-content section.problems-wrapper center, div.course-wrapper section.course-content div#seq_content center, div.course-wrapper section.course-content ol.vert-mod > li center, div.course-wrapper section.course-content section.problems-wrapper center, div.course-wrapper section.course-content div#seq_content center {
+      display: block;
+      margin: 22.652px 0;
+      border: 1px solid #ccc;
+      padding: 22.652px; }
+    div.course-wrapper section.course-content .problem-set section.action, div.course-wrapper section.course-content section.problems-wrapper section.action, div.course-wrapper section.course-content div#seq_content section.action, div.course-wrapper section.course-content ol.vert-mod > li section.action, div.course-wrapper section.course-content section.problems-wrapper section.action, div.course-wrapper section.course-content div#seq_content section.action {
+      margin-top: 22.652px; }
+      div.course-wrapper section.course-content .problem-set section.action input[type="button"], div.course-wrapper section.course-content section.problems-wrapper section.action input[type="button"], div.course-wrapper section.course-content div#seq_content section.action input[type="button"], div.course-wrapper section.course-content ol.vert-mod > li section.action input[type="button"], div.course-wrapper section.course-content section.problems-wrapper section.action input[type="button"], div.course-wrapper section.course-content div#seq_content section.action input[type="button"] {
+        padding: 9.061px 22.652px;
+        text-shadow: 0 -1px 0 #666666; }
+  div.course-wrapper section.course-content section.problems-wrapper {
+    display: table;
+    width: 100%; }
+    @media screen and (max-width:1120px) {
+      div.course-wrapper section.course-content section.problems-wrapper {
+        display: block;
+        width: auto; } }
+  div.course-wrapper section.course-content div#seq_content h1 {
+    background: none;
+    margin-bottom: 22.652px;
+    padding-bottom: 0;
+    border-bottom: none; }
+  div.course-wrapper section.course-content ol.vert-mod > li {
+    border-bottom: 1px solid #ddd;
+    margin-bottom: 15px;
+    padding: 0 0 15px; }
+    div.course-wrapper section.course-content ol.vert-mod > li header {
+      -webkit-border-radius: 0 4px 0 0;
+      -moz-border-radius: 0 4px 0 0;
+      -ms-border-radius: 0 4px 0 0;
+      -o-border-radius: 0 4px 0 0;
+      border-radius: 0 4px 0 0;
+      margin-bottom: -16px; }
+      div.course-wrapper section.course-content ol.vert-mod > li header h1 {
+        margin: 0; }
+      div.course-wrapper section.course-content ol.vert-mod > li header h2 {
+        float: right;
+        margin-right: 0;
+        margin-top: 8px;
+        text-align: right;
+        padding-right: 0;
+        border-right: 0; }
+    div.course-wrapper section.course-content ol.vert-mod > li:last-child {
+      border-bottom: none;
+      margin-bottom: 0;
+      padding-bottom: 0; }
+    div.course-wrapper section.course-content ol.vert-mod > li .histogram {
+      width: 200px;
+      height: 150px; }
+    div.course-wrapper section.course-content ol.vert-mod > li ul {
+      list-style: disc outside none;
+      padding-left: 1em; }
+    div.course-wrapper section.course-content ol.vert-mod > li nav.sequence-bottom ul {
+      list-style: none;
+      padding: 0; }
+  div.course-wrapper section.course-content section.tutorials h2 {
+    margin-bottom: 22.652px; }
+  div.course-wrapper section.course-content section.tutorials ul {
+    margin: 0;
+    zoom: 1; }
+    div.course-wrapper section.course-content section.tutorials ul:before, div.course-wrapper section.course-content section.tutorials ul:after {
+      content: "";
+      display: table; }
+    div.course-wrapper section.course-content section.tutorials ul:after {
+      clear: both; }
+    div.course-wrapper section.course-content section.tutorials ul li {
+      width: 31.522%;
+      float: left;
+      margin-right: 2.717%;
+      margin-bottom: 22.652px; }
+      div.course-wrapper section.course-content section.tutorials ul li:nth-child(3n) {
+        margin-right: 0; }
+      div.course-wrapper section.course-content section.tutorials ul li:nth-child(3n+1) {
+        clear: both; }
+      div.course-wrapper section.course-content section.tutorials ul li a {
+        font-weight: bold; }
+  div.course-wrapper section.course-content div.staff_info {
+    zoom: 1;
+    white-space: pre-wrap;
+    border-top: 1px solid #ccc;
+    padding-top: 22.652px;
+    margin-top: 22.652px;
+    line-height: 22.652px;
+    font-family: Consolas, "Lucida Console", Monaco, "Courier New", Courier, monospace; }
+    div.course-wrapper section.course-content div.staff_info:before, div.course-wrapper section.course-content div.staff_info:after {
+      content: "";
+      display: table; }
+    div.course-wrapper section.course-content div.staff_info:after {
+      clear: both; }
+  div.course-wrapper section.course-content div.ui-slider {
+    border: 1px solid #aaa;
+    background: #ddd;
+    -webkit-box-shadow: inset 0 1px 0 #eeeeee;
+    -moz-box-shadow: inset 0 1px 0 #eeeeee;
+    box-shadow: inset 0 1px 0 #eeeeee;
+    -webkit-border-radius: 0;
+    -moz-border-radius: 0;
+    -ms-border-radius: 0;
+    -o-border-radius: 0;
+    border-radius: 0; }
+    div.course-wrapper section.course-content div.ui-slider a.ui-slider-handle {
+      -webkit-box-shadow: inset 0 1px 0 #bf4040;
+      -moz-box-shadow: inset 0 1px 0 #bf4040;
+      box-shadow: inset 0 1px 0 #bf4040;
+      background: #993333 url(../images/slider-bars.png) center center no-repeat;
+      border: 1px solid #4d1919;
+      cursor: pointer; }
+      div.course-wrapper section.course-content div.ui-slider a.ui-slider-handle:hover, div.course-wrapper section.course-content div.ui-slider a.ui-slider-handle:focus {
+        background-color: #bf4040;
+        outline: none; }
+  div.course-wrapper section.course-content div.ui-tabs {
+    border: 0;
+    -webkit-border-radius: 0;
+    -moz-border-radius: 0;
+    -ms-border-radius: 0;
+    -o-border-radius: 0;
+    border-radius: 0;
+    margin: 0;
+    padding: 0; }
+    div.course-wrapper section.course-content div.ui-tabs .ui-tabs-nav {
+      background: none;
+      border: 0;
+      margin-bottom: 11.326px; }
+    div.course-wrapper section.course-content div.ui-tabs .ui-tabs-panel {
+      -webkit-border-radius: 0;
+      -moz-border-radius: 0;
+      -ms-border-radius: 0;
+      -o-border-radius: 0;
+      border-radius: 0;
+      padding: 0; }
+div.course-wrapper.closed section.course-index {
+  width: 3.077%;
+  overflow: hidden; }
+  div.course-wrapper.closed section.course-index header#open_close_accordion {
+    padding: 0;
+    min-height: 47px; }
+    div.course-wrapper.closed section.course-index header#open_close_accordion a {
+      background-image: url("../images/slide-right-icon.png"); }
+    div.course-wrapper.closed section.course-index header#open_close_accordion h2 {
+      visibility: hidden;
+      width: 10px; }
+  div.course-wrapper.closed section.course-index div#accordion {
+    visibility: hidden;
+    width: 10px;
+    padding: 0; }
+    div.course-wrapper.closed section.course-index div#accordion nav {
+      white-space: pre;
+      overflow: hidden; }
+      div.course-wrapper.closed section.course-index div#accordion nav ul {
+        overflow: hidden;
+        white-space: nowrap; }
+div.course-wrapper.closed section.course-content {
+  width: 97.773%; }
+
+nav.sequence-nav {
+  border-bottom: 1px solid #e4d080;
+  margin-bottom: 22.652px;
+  position: relative;
+  -webkit-border-top-right-radius: 4px;
+  -moz-border-top-right-radius: 4px;
+  -moz-border-radius-topright: 4px;
+  -ms-border-top-right-radius: 4px;
+  -o-border-top-right-radius: 4px;
+  border-top-right-radius: 4px; }
+  nav.sequence-nav ol {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table;
+    height: 100%;
+    padding-right: 8.696%;
+    width: 100%; }
+    nav.sequence-nav ol li {
+      border-left: 1px solid #e4d080;
+      display: table-cell;
+      min-width: 20px; }
+      nav.sequence-nav ol li:first-child {
+        border-left: none; }
+      nav.sequence-nav ol li .inactive, nav.sequence-nav ol li a.seq_video_inactive, nav.sequence-nav ol li a.seq_other_inactive, nav.sequence-nav ol li a.seq_vertical_inactive, nav.sequence-nav ol li a.seq_problem_inactive {
+        background-repeat: no-repeat; }
+        nav.sequence-nav ol li .inactive:hover, nav.sequence-nav ol li a.seq_video_inactive:hover, nav.sequence-nav ol li a.seq_other_inactive:hover, nav.sequence-nav ol li a.seq_vertical_inactive:hover, nav.sequence-nav ol li a.seq_problem_inactive:hover {
+          background-color: #f9f4e1; }
+      nav.sequence-nav ol li .visited, nav.sequence-nav ol li a.seq_video_visited, nav.sequence-nav ol li a.seq_other_visited, nav.sequence-nav ol li a.seq_vertical_visited, nav.sequence-nav ol li a.seq_problem_visited {
+        background-color: #DCCDA2;
+        background-repeat: no-repeat;
+        -webkit-box-shadow: inset 0 0 3px #ceb97d;
+        -moz-box-shadow: inset 0 0 3px #ceb97d;
+        box-shadow: inset 0 0 3px #ceb97d; }
+        nav.sequence-nav ol li .visited:hover, nav.sequence-nav ol li a.seq_video_visited:hover, nav.sequence-nav ol li a.seq_other_visited:hover, nav.sequence-nav ol li a.seq_vertical_visited:hover, nav.sequence-nav ol li a.seq_problem_visited:hover {
+          background-color: #f6efd4;
+          background-position: center center; }
+      nav.sequence-nav ol li .active, nav.sequence-nav ol li a.seq_video_active, nav.sequence-nav ol li a.seq_other_active, nav.sequence-nav ol li a.seq_vertical_active, nav.sequence-nav ol li a.seq_problem_active, nav.sequence-nav ol li section.course-index div#accordion h3.ui-accordion-header.ui-state-active, section.course-index div#accordion nav.sequence-nav ol li h3.ui-accordion-header.ui-state-active {
+        background-color: #fff;
+        background-repeat: no-repeat;
+        -webkit-box-shadow: 0 1px 0 white;
+        -moz-box-shadow: 0 1px 0 white;
+        box-shadow: 0 1px 0 white; }
+        nav.sequence-nav ol li .active:hover, nav.sequence-nav ol li a.seq_video_active:hover, nav.sequence-nav ol li a.seq_other_active:hover, nav.sequence-nav ol li a.seq_vertical_active:hover, nav.sequence-nav ol li a.seq_problem_active:hover, nav.sequence-nav ol li section.course-index div#accordion h3.ui-accordion-header.ui-state-active:hover, section.course-index div#accordion nav.sequence-nav ol li h3.ui-accordion-header.ui-state-active:hover {
+          background-color: #fff;
+          background-position: center; }
+      nav.sequence-nav ol li a {
+        background-position: center center;
+        border: none;
+        cursor: pointer;
+        display: block;
+        height: 17px;
+        padding: 15px 0 14px;
+        position: relative;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.4s;
+        -moz-transition-duration: 0.4s;
+        -ms-transition-duration: 0.4s;
+        -o-transition-duration: 0.4s;
+        transition-duration: 0.4s;
+        -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -moz-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -ms-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -o-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0;
+        width: 100%; }
+        nav.sequence-nav ol li a.progress, nav.sequence-nav ol li a.progress-none, nav.sequence-nav ol li a.progress-some, nav.sequence-nav ol li a.progress-done {
+          border-bottom-style: solid;
+          border-bottom-width: 4px; }
+        nav.sequence-nav ol li a.progress-none {
+          border-bottom-color: red; }
+        nav.sequence-nav ol li a.progress-some {
+          border-bottom-color: yellow; }
+        nav.sequence-nav ol li a.progress-done {
+          border-bottom-color: green; }
+        nav.sequence-nav ol li a.seq_video_inactive {
+          background-image: url("../images/sequence-nav/video-icon-normal.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_video_visited {
+          background-image: url("../images/sequence-nav/video-icon-visited.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_video_active {
+          background-image: url("../images/sequence-nav/video-icon-current.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_other_inactive {
+          background-image: url("../images/sequence-nav/document-icon-normal.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_other_visited {
+          background-image: url("../images/sequence-nav/document-icon-visited.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_other_active {
+          background-image: url("../images/sequence-nav/document-icon-current.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_vertical_inactive, nav.sequence-nav ol li a.seq_problem_inactive {
+          background-image: url("../images/sequence-nav/list-icon-normal.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_vertical_visited, nav.sequence-nav ol li a.seq_problem_visited {
+          background-image: url("../images/sequence-nav/list-icon-visited.png");
+          background-position: center; }
+        nav.sequence-nav ol li a.seq_vertical_active, nav.sequence-nav ol li a.seq_problem_active {
+          background-image: url("../images/sequence-nav/list-icon-current.png");
+          background-position: center; }
+        nav.sequence-nav ol li a p {
+          background: #333;
+          color: #fff;
+          display: none;
+          line-height: 22.652px;
+          left: 0px;
+          opacity: 0;
+          padding: 6px;
+          position: absolute;
+          top: 48px;
+          text-shadow: 0 -1px 0 black;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.1s;
+          -moz-transition-duration: 0.1s;
+          -ms-transition-duration: 0.1s;
+          -o-transition-duration: 0.1s;
+          transition-duration: 0.1s;
+          -webkit-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
+          -moz-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
+          -ms-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
+          -o-transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
+          transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          white-space: pre;
+          z-index: 99; }
+          nav.sequence-nav ol li a p:empty {
+            background: none; }
+            nav.sequence-nav ol li a p:empty::after {
+              display: none; }
+          nav.sequence-nav ol li a p::after {
+            background: #333;
+            content: " ";
+            display: block;
+            height: 10px;
+            left: 18px;
+            position: absolute;
+            top: -5px;
+            -webkit-transform: rotate(45deg);
+            -moz-transform: rotate(45deg);
+            -ms-transform: rotate(45deg);
+            -o-transform: rotate(45deg);
+            transform: rotate(45deg);
+            width: 10px; }
+        nav.sequence-nav ol li a:hover p {
+          display: block;
+          margin-top: 4px;
+          opacity: 1; }
+  nav.sequence-nav ul {
+    list-style: none;
+    height: 100%;
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 8.696%; }
+    nav.sequence-nav ul li {
+      float: left;
+      width: 50%; }
+      nav.sequence-nav ul li.prev a, nav.sequence-nav ul li.next a {
+        background-color: #f2e7bf;
+        background-position: center center;
+        background-repeat: no-repeat;
+        border-left: 1px solid #e4d080;
+        -webkit-box-shadow: inset 1px 0 0 #faf7e9;
+        -moz-box-shadow: inset 1px 0 0 #faf7e9;
+        box-shadow: inset 1px 0 0 #faf7e9;
+        -webkit-box-sizing: border-box;
+        -moz-box-sizing: border-box;
+        box-sizing: border-box;
+        cursor: pointer;
+        display: block;
+        text-indent: -9999px;
+        -webkit-transition-property: all;
+        -moz-transition-property: all;
+        -ms-transition-property: all;
+        -o-transition-property: all;
+        transition-property: all;
+        -webkit-transition-duration: 0.2s;
+        -moz-transition-duration: 0.2s;
+        -ms-transition-duration: 0.2s;
+        -o-transition-duration: 0.2s;
+        transition-duration: 0.2s;
+        -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -moz-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -ms-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -o-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0; }
+        nav.sequence-nav ul li.prev a:hover, nav.sequence-nav ul li.next a:hover {
+          opacity: .5; }
+        nav.sequence-nav ul li.prev a.disabled, nav.sequence-nav ul li.next a.disabled {
+          cursor: normal;
+          opacity: .4; }
+      nav.sequence-nav ul li.prev a {
+        background-image: url("../images/sequence-nav/previous-icon.png"); }
+        nav.sequence-nav ul li.prev a:hover {
+          background-color: #f6efd4; }
+      nav.sequence-nav ul li.next a {
+        background-image: url("../images/sequence-nav/next-icon.png"); }
+        nav.sequence-nav ul li.next a:hover {
+          background-color: #f6efd4; }
+  body.touch-based-device nav.sequence-nav ol li a:hover p {
+    display: none; }
+
+section.course-content {
+  position: relative; }
+  section.course-content ol.vert-mod nav.sequence-nav {
+    margin-top: -15px;
+    -webkit-border-radius: 0;
+    -moz-border-radius: 0;
+    -ms-border-radius: 0;
+    -o-border-radius: 0;
+    border-radius: 0; }
+  section.course-content nav.sequence-bottom {
+    margin: 45.304px 0 0;
+    text-align: center; }
+    section.course-content nav.sequence-bottom ul {
+      background-color: #f2e7bf;
+      background-color: #f2e7bf;
+      border: 1px solid #e4d080;
+      -webkit-border-radius: 3px;
+      -moz-border-radius: 3px;
+      -ms-border-radius: 3px;
+      -o-border-radius: 3px;
+      border-radius: 3px;
+      -webkit-box-shadow: inset 0 0 0 1px #faf7e9;
+      -moz-box-shadow: inset 0 0 0 1px #faf7e9;
+      box-shadow: inset 0 0 0 1px #faf7e9;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto; }
+      section.course-content nav.sequence-bottom ul li {
+        float: left; }
+        section.course-content nav.sequence-bottom ul li.prev, section.course-content nav.sequence-bottom ul li.next {
+          margin-bottom: 0; }
+          section.course-content nav.sequence-bottom ul li.prev a, section.course-content nav.sequence-bottom ul li.next a {
+            background-position: center center;
+            background-repeat: no-repeat;
+            border-bottom: none;
+            display: block;
+            padding: 11.326px 4px;
+            text-indent: -9999px;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.2s;
+            -moz-transition-duration: 0.2s;
+            -ms-transition-duration: 0.2s;
+            -o-transition-duration: 0.2s;
+            transition-duration: 0.2s;
+            -webkit-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+            -moz-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+            -ms-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+            -o-transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+            transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            width: 45px; }
+            section.course-content nav.sequence-bottom ul li.prev a:hover, section.course-content nav.sequence-bottom ul li.next a:hover {
+              background-color: #f6efd4;
+              color: #7e691a;
+              opacity: .5;
+              text-decoration: none; }
+            section.course-content nav.sequence-bottom ul li.prev a.disabled, section.course-content nav.sequence-bottom ul li.next a.disabled {
+              background-color: #fffffe;
+              opacity: .4; }
+        section.course-content nav.sequence-bottom ul li.prev a {
+          background-image: url("../images/sequence-nav/previous-icon.png");
+          border-right: 1px solid #e4d080; }
+          section.course-content nav.sequence-bottom ul li.prev a:hover {
+            background-color: none; }
+        section.course-content nav.sequence-bottom ul li.next a {
+          background-image: url("../images/sequence-nav/next-icon.png"); }
+          section.course-content nav.sequence-bottom ul li.next a:hover {
+            background-color: none; }
+
+section.course-index header {
+  max-height: 47px; }
+  section.course-index header h2 {
+    white-space: nowrap; }
+section.course-index div#accordion h3 {
+  -webkit-box-shadow: inset 0 1px 0 0 #eeeeee;
+  -moz-box-shadow: inset 0 1px 0 0 #eeeeee;
+  box-shadow: inset 0 1px 0 0 #eeeeee;
+  border-top: 1px solid #d3d3d3;
+  overflow: hidden;
+  margin: 0; }
+  section.course-index div#accordion h3:first-child {
+    border: none; }
+  section.course-index div#accordion h3:hover {
+    background-image: -webkit-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+    background-image: -moz-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+    background-image: -ms-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+    background-image: -o-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+    background-image: linear-gradient(-90deg, #f5f5f5, #e1e1e1); }
+  section.course-index div#accordion h3.ui-accordion-header {
+    color: #000; }
+    section.course-index div#accordion h3.ui-accordion-header a {
+      font-size: 14px;
+      color: #4d4d4d; }
+    section.course-index div#accordion h3.ui-accordion-header.ui-state-active {
+      background-image: -webkit-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -moz-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -ms-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: -o-linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      background-image: linear-gradient(-90deg, #f5f5f5, #e1e1e1);
+      border-bottom: 1px solid #d3d3d3; }
+section.course-index div#accordion ul.ui-accordion-content {
+  -webkit-border-radius: 0;
+  -moz-border-radius: 0;
+  -ms-border-radius: 0;
+  -o-border-radius: 0;
+  border-radius: 0;
+  -webkit-box-shadow: inset -1px 0 0 #e6e6e6;
+  -moz-box-shadow: inset -1px 0 0 #e6e6e6;
+  box-shadow: inset -1px 0 0 #e6e6e6;
+  background: #dadada;
+  border: none;
+  font-size: 12px;
+  margin: 0;
+  padding: 1em 1.5em; }
+  section.course-index div#accordion ul.ui-accordion-content li {
+    margin-bottom: 11.326px; }
+    section.course-index div#accordion ul.ui-accordion-content li a {
+      border: 1px solid transparent;
+      background: transparent;
+      -webkit-border-radius: 4px;
+      -moz-border-radius: 4px;
+      -ms-border-radius: 4px;
+      -o-border-radius: 4px;
+      border-radius: 4px;
+      position: relative;
+      padding: 5px 36px 5px 10px;
+      text-decoration: none;
+      display: block;
+      color: #666; }
+      section.course-index div#accordion ul.ui-accordion-content li a p {
+        font-weight: bold;
+        margin-bottom: 0; }
+        section.course-index div#accordion ul.ui-accordion-content li a p span.subtitle {
+          color: #666;
+          font-weight: normal;
+          display: block; }
+      section.course-index div#accordion ul.ui-accordion-content li a:after {
+        background: transparent;
+        border-top: 1px solid #b4b4b4;
+        border-right: 1px solid #b4b4b4;
+        content: "";
+        display: block;
+        height: 12px;
+        margin-top: -6px;
+        opacity: 0;
+        position: absolute;
+        top: 50%;
+        right: 30px;
+        -webkit-transform: rotate(45deg);
+        -moz-transform: rotate(45deg);
+        -ms-transform: rotate(45deg);
+        -o-transform: rotate(45deg);
+        transform: rotate(45deg);
+        width: 12px; }
+      section.course-index div#accordion ul.ui-accordion-content li a:hover {
+        background-image: -webkit-linear-gradient(-90deg, rgba(245, 245, 245, 0.4), rgba(230, 230, 230, 0.4));
+        background-image: -moz-linear-gradient(-90deg, rgba(245, 245, 245, 0.4), rgba(230, 230, 230, 0.4));
+        background-image: -ms-linear-gradient(-90deg, rgba(245, 245, 245, 0.4), rgba(230, 230, 230, 0.4));
+        background-image: -o-linear-gradient(-90deg, rgba(245, 245, 245, 0.4), rgba(230, 230, 230, 0.4));
+        background-image: linear-gradient(-90deg, rgba(245, 245, 245, 0.4), rgba(230, 230, 230, 0.4));
+        border-color: #c8c8c8; }
+        section.course-index div#accordion ul.ui-accordion-content li a:hover:after {
+          opacity: 1;
+          right: 15px;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.2s;
+          -moz-transition-duration: 0.2s;
+          -ms-transition-duration: 0.2s;
+          -o-transition-duration: 0.2s;
+          transition-duration: 0.2s;
+          -webkit-transition-timing-function: linear;
+          -moz-transition-timing-function: linear;
+          -ms-transition-timing-function: linear;
+          -o-transition-timing-function: linear;
+          transition-timing-function: linear;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0; }
+        section.course-index div#accordion ul.ui-accordion-content li a:hover > a p {
+          color: #333; }
+      section.course-index div#accordion ul.ui-accordion-content li a:active {
+        -webkit-box-shadow: inset 0 1px 14px 0 rgba(0, 0, 0, 0.1);
+        -moz-box-shadow: inset 0 1px 14px 0 rgba(0, 0, 0, 0.1);
+        box-shadow: inset 0 1px 14px 0 rgba(0, 0, 0, 0.1); }
+        section.course-index div#accordion ul.ui-accordion-content li a:active:after {
+          opacity: 1;
+          right: 15px; }
+    section.course-index div#accordion ul.ui-accordion-content li.active {
+      font-weight: bold; }
+      section.course-index div#accordion ul.ui-accordion-content li.active > a {
+        background: #f0f0f0;
+        background-image: -webkit-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
+        background-image: -moz-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
+        background-image: -ms-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
+        background-image: -o-linear-gradient(-90deg, #f5f5f5, #e6e6e6);
+        background-image: linear-gradient(-90deg, #f5f5f5, #e6e6e6);
+        border-color: #c8c8c8; }
+        section.course-index div#accordion ul.ui-accordion-content li.active > a:after {
+          opacity: 1;
+          right: 15px; }
+        section.course-index div#accordion ul.ui-accordion-content li.active > a p {
+          color: #333; }
+      section.course-index div#accordion ul.ui-accordion-content li.active span.subtitle {
+        font-weight: normal; }
+
+@-moz-document url-prefix() {
+  a.add-fullscreen {
+    display: none !important; } }
+
+section.course-content .dullify, section.course-content div.video article.video-wrapper section.video-controls ul.vcr, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls {
+  opacity: .4;
+  -webkit-transition-property: all;
+  -moz-transition-property: all;
+  -ms-transition-property: all;
+  -o-transition-property: all;
+  transition-property: all;
+  -webkit-transition-duration: 0.15s;
+  -moz-transition-duration: 0.15s;
+  -ms-transition-duration: 0.15s;
+  -o-transition-duration: 0.15s;
+  transition-duration: 0.15s;
+  -webkit-transition-timing-function: ease-out;
+  -moz-transition-timing-function: ease-out;
+  -ms-transition-timing-function: ease-out;
+  -o-transition-timing-function: ease-out;
+  transition-timing-function: ease-out;
+  -webkit-transition-delay: 0;
+  -moz-transition-delay: 0;
+  -ms-transition-delay: 0;
+  -o-transition-delay: 0;
+  transition-delay: 0; }
+  section.course-content .dullify:hover, section.course-content div.video article.video-wrapper section.video-controls ul.vcr:hover, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls:hover {
+    opacity: 1; }
+section.course-content div.video {
+  zoom: 1;
+  background: #f3f3f3;
+  border-bottom: 1px solid #e1e1e1;
+  border-top: 1px solid #e1e1e1;
+  display: block;
+  margin: 0 -22.652px;
+  padding: 6px 22.652px; }
+  section.course-content div.video:before, section.course-content div.video:after {
+    content: "";
+    display: table; }
+  section.course-content div.video:after {
+    clear: both; }
+  section.course-content div.video article.video-wrapper {
+    float: left;
+    margin-right: 2.717%;
+    width: 65.761%; }
+    section.course-content div.video article.video-wrapper section.video-player {
+      height: 0;
+      overflow: hidden;
+      padding-bottom: 56.25%;
+      padding-top: 30px;
+      position: relative; }
+      section.course-content div.video article.video-wrapper section.video-player object, section.course-content div.video article.video-wrapper section.video-player iframe {
+        border: none;
+        height: 100%;
+        left: 0;
+        position: absolute;
+        top: 0;
+        width: 100%; }
+    section.course-content div.video article.video-wrapper section.video-controls {
+      background: #333;
+      border: 1px solid #000;
+      border-top: 0;
+      color: #ccc;
+      position: relative; }
+      section.course-content div.video article.video-wrapper section.video-controls:hover ul, section.course-content div.video article.video-wrapper section.video-controls:hover div {
+        opacity: 1; }
+      section.course-content div.video article.video-wrapper section.video-controls div.slider {
+        background: #c2c2c2;
+        border: none;
+        border-bottom: 1px solid #000;
+        -webkit-border-radius: 0;
+        -moz-border-radius: 0;
+        -ms-border-radius: 0;
+        -o-border-radius: 0;
+        border-radius: 0;
+        border-top: 1px solid #000;
+        -webkit-box-shadow: inset 0 1px 0 #eeeeee, 0 1px 0 #555555;
+        -moz-box-shadow: inset 0 1px 0 #eeeeee, 0 1px 0 #555555;
+        box-shadow: inset 0 1px 0 #eeeeee, 0 1px 0 #555555;
+        height: 7px;
+        -webkit-transition-property: height, 2s, ease-in-out;
+        -moz-transition-property: height, 2s, ease-in-out;
+        -ms-transition-property: height, 2s, ease-in-out;
+        -o-transition-property: height, 2s, ease-in-out;
+        transition-property: height, 2s, ease-in-out;
+        -webkit-transition-duration: 0.15s;
+        -moz-transition-duration: 0.15s;
+        -ms-transition-duration: 0.15s;
+        -o-transition-duration: 0.15s;
+        transition-duration: 0.15s;
+        -webkit-transition-timing-function: ease-out;
+        -moz-transition-timing-function: ease-out;
+        -ms-transition-timing-function: ease-out;
+        -o-transition-timing-function: ease-out;
+        transition-timing-function: ease-out;
+        -webkit-transition-delay: 0;
+        -moz-transition-delay: 0;
+        -ms-transition-delay: 0;
+        -o-transition-delay: 0;
+        transition-delay: 0; }
+        section.course-content div.video article.video-wrapper section.video-controls div.slider div.ui-widget-header {
+          background: #777;
+          -webkit-box-shadow: inset 0 1px 0 #999999;
+          -moz-box-shadow: inset 0 1px 0 #999999;
+          box-shadow: inset 0 1px 0 #999999; }
+        section.course-content div.video article.video-wrapper section.video-controls div.slider .ui-tooltip.qtip .ui-tooltip-content {
+          background: #993333;
+          border: 1px solid #4d1919;
+          -webkit-border-radius: 2px;
+          -moz-border-radius: 2px;
+          -ms-border-radius: 2px;
+          -o-border-radius: 2px;
+          border-radius: 2px;
+          -webkit-box-shadow: inset 0 1px 0 #bf4040;
+          -moz-box-shadow: inset 0 1px 0 #bf4040;
+          box-shadow: inset 0 1px 0 #bf4040;
+          color: #fff;
+          font: bold 12px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+          margin-bottom: 6px;
+          margin-right: 0;
+          overflow: visible;
+          padding: 4px;
+          text-align: center;
+          text-shadow: 0 -1px 0 #732626;
+          -webkit-font-smoothing: antialiased; }
+          section.course-content div.video article.video-wrapper section.video-controls div.slider .ui-tooltip.qtip .ui-tooltip-content::after {
+            background: #993333;
+            border-bottom: 1px solid #4d1919;
+            border-right: 1px solid #4d1919;
+            bottom: -5px;
+            content: " ";
+            display: block;
+            height: 7px;
+            left: 50%;
+            margin-left: -3px;
+            position: absolute;
+            -webkit-transform: rotate(45deg);
+            -moz-transform: rotate(45deg);
+            -ms-transform: rotate(45deg);
+            -o-transform: rotate(45deg);
+            transform: rotate(45deg);
+            width: 7px; }
+        section.course-content div.video article.video-wrapper section.video-controls div.slider a.ui-slider-handle {
+          background: #993333 url(../images/slider-handle.png) center center no-repeat;
+          -webkit-background-size: 50%;
+          -moz-background-size: 50%;
+          -ms-background-size: 50%;
+          -o-background-size: 50%;
+          background-size: 50%;
+          border: 1px solid #4d1919;
+          -webkit-border-radius: 15px;
+          -moz-border-radius: 15px;
+          -ms-border-radius: 15px;
+          -o-border-radius: 15px;
+          border-radius: 15px;
+          -webkit-box-shadow: inset 0 1px 0 #bf4040;
+          -moz-box-shadow: inset 0 1px 0 #bf4040;
+          box-shadow: inset 0 1px 0 #bf4040;
+          cursor: pointer;
+          height: 15px;
+          margin-left: -7px;
+          top: -4px;
+          -webkit-transition-property: height, 2s, ease-in-out;
+          -moz-transition-property: height, 2s, ease-in-out;
+          -ms-transition-property: height, 2s, ease-in-out;
+          -o-transition-property: height, 2s, ease-in-out;
+          transition-property: height, 2s, ease-in-out;
+          -webkit-transition-duration: width, 2s, ease-in-out;
+          -moz-transition-duration: width, 2s, ease-in-out;
+          -ms-transition-duration: width, 2s, ease-in-out;
+          -o-transition-duration: width, 2s, ease-in-out;
+          transition-duration: width, 2s, ease-in-out;
+          -webkit-transition-timing-function: ease-out;
+          -moz-transition-timing-function: ease-out;
+          -ms-transition-timing-function: ease-out;
+          -o-transition-timing-function: ease-out;
+          transition-timing-function: ease-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 15px; }
+          section.course-content div.video article.video-wrapper section.video-controls div.slider a.ui-slider-handle:focus, section.course-content div.video article.video-wrapper section.video-controls div.slider a.ui-slider-handle:hover {
+            background-color: #bf4040;
+            outline: none; }
+      section.course-content div.video article.video-wrapper section.video-controls ul.vcr {
+        float: left;
+        list-style: none;
+        margin-right: 22.652px;
+        padding: 0; }
+        section.course-content div.video article.video-wrapper section.video-controls ul.vcr li {
+          float: left;
+          margin-bottom: 0; }
+          section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a {
+            border-bottom: none;
+            border-right: 1px solid #000;
+            -webkit-box-shadow: 1px 0 0 #555555;
+            -moz-box-shadow: 1px 0 0 #555555;
+            box-shadow: 1px 0 0 #555555;
+            cursor: pointer;
+            display: block;
+            line-height: 46px;
+            padding: 0 16.989px;
+            text-indent: -9999px;
+            -webkit-transition-property: background-color;
+            -moz-transition-property: background-color;
+            -ms-transition-property: background-color;
+            -o-transition-property: background-color;
+            transition-property: background-color;
+            -webkit-transition-duration: opacity;
+            -moz-transition-duration: opacity;
+            -ms-transition-duration: opacity;
+            -o-transition-duration: opacity;
+            transition-duration: opacity;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            width: 14px;
+            background: url("../images/vcr.png") 15px 15px no-repeat; }
+            section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a:empty {
+              height: 46px;
+              background: url("../images/vcr.png") 15px 15px no-repeat; }
+            section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a.play {
+              background-position: 17px -114px; }
+              section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a.play:hover {
+                background-color: #444; }
+            section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a.pause {
+              background-position: 16px -50px; }
+              section.course-content div.video article.video-wrapper section.video-controls ul.vcr li a.pause:hover {
+                background-color: #444; }
+          section.course-content div.video article.video-wrapper section.video-controls ul.vcr li div.vidtime {
+            padding-left: 16.989px;
+            font-weight: bold;
+            line-height: 46px;
+            padding-left: 16.989px;
+            -webkit-font-smoothing: antialiased; }
+      section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls {
+        float: right; }
+        section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds {
+          float: left;
+          position: relative; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds.open > a {
+            background: url("../images/open-arrow.png") 10px center no-repeat; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds.open ol.video_speeds {
+            display: block;
+            opacity: 1; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a {
+            background: url("../images/closed-arrow.png") 10px center no-repeat;
+            border-left: 1px solid #000;
+            border-right: 1px solid #000;
+            -webkit-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            -moz-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            zoom: 1;
+            color: #fff;
+            cursor: pointer;
+            display: block;
+            line-height: 46px;
+            margin-right: 0;
+            padding-left: 15px;
+            position: relative;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            -webkit-font-smoothing: antialiased;
+            width: 110px; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:before, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:after {
+              content: "";
+              display: table; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:after {
+              clear: both; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a h3 {
+              color: #999;
+              float: left;
+              font-size: 12px;
+              font-weight: normal;
+              letter-spacing: 1px;
+              padding: 0 5.663px 0 11.326px;
+              text-transform: uppercase; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a p.active {
+              float: left;
+              font-weight: bold;
+              margin-bottom: 0;
+              padding: 0 11.326px 0 0; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:hover, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:active, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds > a:focus {
+              opacity: 1;
+              background-color: #444; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds {
+            -webkit-box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            -moz-box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            background-color: #444;
+            border: 1px solid #000;
+            bottom: 46px;
+            display: none;
+            opacity: 0;
+            position: absolute;
+            width: 125px;
+            z-index: 10; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds li {
+              -webkit-box-shadow: 0 1px 0 #555555;
+              -moz-box-shadow: 0 1px 0 #555555;
+              box-shadow: 0 1px 0 #555555;
+              border-bottom: 1px solid #000;
+              color: #fff;
+              cursor: pointer; }
+              section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds li a {
+                border: 0;
+                color: #fff;
+                display: block;
+                padding: 11.326px; }
+                section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds li a:hover {
+                  background-color: #666;
+                  color: #aaa; }
+              section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds li.active {
+                font-weight: bold; }
+              section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.speeds ol.video_speeds li:last-child {
+                -webkit-box-shadow: none;
+                -moz-box-shadow: none;
+                box-shadow: none;
+                border-bottom: 0;
+                margin-top: 0; }
+        section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume {
+          float: left;
+          position: relative; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume.open .volume-slider-container {
+            display: block;
+            opacity: 1; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume.muted > a {
+            background: url("../images/mute.png") 10px center no-repeat; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a {
+            background: url("../images/volume.png") 10px center no-repeat;
+            border-right: 1px solid #000;
+            -webkit-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            -moz-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+            zoom: 1;
+            color: #fff;
+            cursor: pointer;
+            display: block;
+            height: 46px;
+            margin-right: 0;
+            padding-left: 15px;
+            position: relative;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            -webkit-font-smoothing: antialiased;
+            width: 30px; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:before, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:after {
+              content: "";
+              display: table; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:after {
+              clear: both; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:hover, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:active, section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume > a:focus {
+              background-color: #444; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume .volume-slider-container {
+            -webkit-box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            -moz-box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            box-shadow: inset 1px 0 0 #555555, 0 3px 0 #444444;
+            -webkit-transition-property: all;
+            -moz-transition-property: all;
+            -ms-transition-property: all;
+            -o-transition-property: all;
+            transition-property: all;
+            -webkit-transition-duration: 0.15s;
+            -moz-transition-duration: 0.15s;
+            -ms-transition-duration: 0.15s;
+            -o-transition-duration: 0.15s;
+            transition-duration: 0.15s;
+            -webkit-transition-timing-function: ease-out;
+            -moz-transition-timing-function: ease-out;
+            -ms-transition-timing-function: ease-out;
+            -o-transition-timing-function: ease-out;
+            transition-timing-function: ease-out;
+            -webkit-transition-delay: 0;
+            -moz-transition-delay: 0;
+            -ms-transition-delay: 0;
+            -o-transition-delay: 0;
+            transition-delay: 0;
+            background-color: #444;
+            border: 1px solid #000;
+            bottom: 46px;
+            display: none;
+            opacity: 0;
+            position: absolute;
+            width: 45px;
+            height: 125px;
+            margin-left: -1px;
+            z-index: 10; }
+            section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume .volume-slider-container .volume-slider {
+              height: 100px;
+              border: 0;
+              width: 5px;
+              margin: 14px auto;
+              background: #666;
+              border: 1px solid #000;
+              -webkit-box-shadow: 0 1px 0 #333333;
+              -moz-box-shadow: 0 1px 0 #333333;
+              box-shadow: 0 1px 0 #333333; }
+              section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume .volume-slider-container .volume-slider a.ui-slider-handle {
+                background: #993333 url(../images/slider-handle.png) center center no-repeat;
+                -webkit-background-size: 50%;
+                -moz-background-size: 50%;
+                -ms-background-size: 50%;
+                -o-background-size: 50%;
+                background-size: 50%;
+                border: 1px solid #4d1919;
+                -webkit-border-radius: 15px;
+                -moz-border-radius: 15px;
+                -ms-border-radius: 15px;
+                -o-border-radius: 15px;
+                border-radius: 15px;
+                -webkit-box-shadow: inset 0 1px 0 #bf4040;
+                -moz-box-shadow: inset 0 1px 0 #bf4040;
+                box-shadow: inset 0 1px 0 #bf4040;
+                cursor: pointer;
+                height: 15px;
+                left: -6px;
+                -webkit-transition-property: height, 2s, ease-in-out;
+                -moz-transition-property: height, 2s, ease-in-out;
+                -ms-transition-property: height, 2s, ease-in-out;
+                -o-transition-property: height, 2s, ease-in-out;
+                transition-property: height, 2s, ease-in-out;
+                -webkit-transition-duration: width, 2s, ease-in-out;
+                -moz-transition-duration: width, 2s, ease-in-out;
+                -ms-transition-duration: width, 2s, ease-in-out;
+                -o-transition-duration: width, 2s, ease-in-out;
+                transition-duration: width, 2s, ease-in-out;
+                -webkit-transition-timing-function: ease-out;
+                -moz-transition-timing-function: ease-out;
+                -ms-transition-timing-function: ease-out;
+                -o-transition-timing-function: ease-out;
+                transition-timing-function: ease-out;
+                -webkit-transition-delay: 0;
+                -moz-transition-delay: 0;
+                -ms-transition-delay: 0;
+                -o-transition-delay: 0;
+                transition-delay: 0;
+                width: 15px; }
+              section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls div.volume .volume-slider-container .volume-slider .ui-slider-range {
+                background: #ddd; }
+        section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls a.add-fullscreen {
+          background: url(../images/fullscreen.png) center no-repeat;
+          border-right: 1px solid #000;
+          -webkit-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+          -moz-box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+          box-shadow: 1px 0 0 #555555, inset 1px 0 0 #555555;
+          color: #797979;
+          display: block;
+          float: left;
+          line-height: 46px;
+          margin-left: 0;
+          padding: 0 11.326px;
+          text-indent: -9999px;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: ease-out;
+          -moz-transition-timing-function: ease-out;
+          -ms-transition-timing-function: ease-out;
+          -o-transition-timing-function: ease-out;
+          transition-timing-function: ease-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          width: 30px; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls a.add-fullscreen:hover {
+            background-color: #444;
+            color: #fff;
+            text-decoration: none; }
+        section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles {
+          background: url("../images/cc.png") center no-repeat;
+          color: #797979;
+          display: block;
+          float: left;
+          font-weight: 800;
+          line-height: 46px;
+          margin-left: 0;
+          opacity: 1;
+          padding: 0 11.326px;
+          position: relative;
+          text-indent: -9999px;
+          -webkit-transition-property: all;
+          -moz-transition-property: all;
+          -ms-transition-property: all;
+          -o-transition-property: all;
+          transition-property: all;
+          -webkit-transition-duration: 0.15s;
+          -moz-transition-duration: 0.15s;
+          -ms-transition-duration: 0.15s;
+          -o-transition-duration: 0.15s;
+          transition-duration: 0.15s;
+          -webkit-transition-timing-function: ease-out;
+          -moz-transition-timing-function: ease-out;
+          -ms-transition-timing-function: ease-out;
+          -o-transition-timing-function: ease-out;
+          transition-timing-function: ease-out;
+          -webkit-transition-delay: 0;
+          -moz-transition-delay: 0;
+          -ms-transition-delay: 0;
+          -o-transition-delay: 0;
+          transition-delay: 0;
+          -webkit-font-smoothing: antialiased;
+          width: 30px; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles:hover {
+            background-color: #444;
+            color: #fff;
+            text-decoration: none; }
+          section.course-content div.video article.video-wrapper section.video-controls div.secondary-controls a.hide-subtitles.off {
+            opacity: .7; }
+    section.course-content div.video article.video-wrapper:hover section.video-controls ul, section.course-content div.video article.video-wrapper:hover section.video-controls div {
+      opacity: 1; }
+    section.course-content div.video article.video-wrapper:hover section.video-controls div.slider {
+      height: 14px;
+      margin-top: -7px; }
+      section.course-content div.video article.video-wrapper:hover section.video-controls div.slider a.ui-slider-handle {
+        -webkit-border-radius: 20px;
+        -moz-border-radius: 20px;
+        -ms-border-radius: 20px;
+        -o-border-radius: 20px;
+        border-radius: 20px;
+        height: 20px;
+        margin-left: -10px;
+        top: -4px;
+        width: 20px; }
+  section.course-content div.video ol.subtitles {
+    float: left;
+    max-height: 460px;
+    overflow: auto;
+    width: 31.522%; }
+    section.course-content div.video ol.subtitles li {
+      border: 0;
+      color: #666;
+      cursor: pointer;
+      margin-bottom: 8px;
+      padding: 0; }
+      section.course-content div.video ol.subtitles li.current {
+        color: #333;
+        font-weight: 700; }
+      section.course-content div.video ol.subtitles li:hover {
+        color: #993333; }
+      section.course-content div.video ol.subtitles li:empty {
+        margin-bottom: 0px; }
+  section.course-content div.video.closed article.video-wrapper {
+    width: 100%; }
+  section.course-content div.video.closed ol.subtitles {
+    width: 0px; }
+  section.course-content div.video.fullscreen {
+    background: rgba(0, 0, 0, 0.95);
+    border: 0;
+    bottom: 0;
+    height: 100%;
+    left: 0;
+    margin: 0;
+    max-height: 100%;
+    overflow: hidden;
+    padding: 0;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 999; }
+    section.course-content div.video.fullscreen.closed ol.subtitles {
+      right: -31.984%;
+      width: auto; }
+    section.course-content div.video.fullscreen a.exit {
+      color: #aaa;
+      display: none;
+      font-style: 12px;
+      left: 20px;
+      letter-spacing: 1px;
+      position: absolute;
+      text-transform: uppercase;
+      top: 20px; }
+      section.course-content div.video.fullscreen a.exit::after {
+        content: "✖";
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        padding-left: 6px; }
+      section.course-content div.video.fullscreen a.exit:hover {
+        color: #993333; }
+    section.course-content div.video.fullscreen div.tc-wrapper article.video-wrapper {
+      width: 100%; }
+    section.course-content div.video.fullscreen div.tc-wrapper object, section.course-content div.video.fullscreen div.tc-wrapper iframe {
+      bottom: 0;
+      height: 100%;
+      left: 0;
+      overflow: hidden;
+      position: fixed;
+      top: 0; }
+    section.course-content div.video.fullscreen div.tc-wrapper section.video-controls {
+      bottom: 0;
+      left: 0;
+      position: absolute;
+      width: 100%;
+      z-index: 9999; }
+    section.course-content div.video.fullscreen ol.subtitles {
+      background: rgba(0, 0, 0, 0.8);
+      bottom: 0;
+      height: 100%;
+      max-height: 100%;
+      max-width: 23.482%;
+      padding: 22.652px;
+      position: fixed;
+      right: 0;
+      top: 0;
+      -webkit-transition-property: all;
+      -moz-transition-property: all;
+      -ms-transition-property: all;
+      -o-transition-property: all;
+      transition-property: all;
+      -webkit-transition-duration: 0.15s;
+      -moz-transition-duration: 0.15s;
+      -ms-transition-duration: 0.15s;
+      -o-transition-duration: 0.15s;
+      transition-duration: 0.15s;
+      -webkit-transition-timing-function: ease-out;
+      -moz-transition-timing-function: ease-out;
+      -ms-transition-timing-function: ease-out;
+      -o-transition-timing-function: ease-out;
+      transition-timing-function: ease-out;
+      -webkit-transition-delay: 0;
+      -moz-transition-delay: 0;
+      -ms-transition-delay: 0;
+      -o-transition-delay: 0;
+      transition-delay: 0; }
+      section.course-content div.video.fullscreen ol.subtitles li {
+        color: #aaa; }
+        section.course-content div.video.fullscreen ol.subtitles li.current {
+          color: #fff; }
+
+div.course-wrapper.closed section.course-content div.video ol.subtitles {
+  max-height: 577px; }
+
+section.tool-wrapper {
+  background: #073642;
+  border-bottom: 1px solid #000203;
+  border-top: 1px solid #000203;
+  -webkit-box-shadow: inset 0 0 0 4px #084150;
+  -moz-box-shadow: inset 0 0 0 4px #084150;
+  box-shadow: inset 0 0 0 4px #084150;
+  color: #839496;
+  display: table;
+  margin: 22.652px -22.652px 0; }
+  section.tool-wrapper div#graph-container {
+    background: none;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table-cell;
+    padding: 22.652px;
+    vertical-align: top;
+    width: 51.359%; }
+    section.tool-wrapper div#graph-container .ui-widget-content {
+      background: none;
+      border: none;
+      -webkit-border-radius: 0;
+      -moz-border-radius: 0;
+      -ms-border-radius: 0;
+      -o-border-radius: 0;
+      border-radius: 0; }
+    section.tool-wrapper div#graph-container canvas {
+      width: 100%; }
+    section.tool-wrapper div#graph-container ul.ui-tabs-nav {
+      background: #062e39;
+      border-bottom: 1px solid #03181d;
+      -webkit-border-radius: 0;
+      -moz-border-radius: 0;
+      -ms-border-radius: 0;
+      -o-border-radius: 0;
+      border-radius: 0;
+      margin: -22.652px -22.652px 0;
+      padding: 0;
+      position: relative;
+      width: 110%; }
+      section.tool-wrapper div#graph-container ul.ui-tabs-nav li {
+        background: none;
+        border: none;
+        -webkit-border-radius: 0;
+        -moz-border-radius: 0;
+        -ms-border-radius: 0;
+        -o-border-radius: 0;
+        border-radius: 0;
+        color: #fff;
+        margin-bottom: 0; }
+        section.tool-wrapper div#graph-container ul.ui-tabs-nav li.ui-tabs-selected {
+          background-color: #073642;
+          border-left: 1px solid #03181d;
+          border-right: 1px solid #03181d; }
+          section.tool-wrapper div#graph-container ul.ui-tabs-nav li.ui-tabs-selected:first-child {
+            border-left: none; }
+          section.tool-wrapper div#graph-container ul.ui-tabs-nav li.ui-tabs-selected a {
+            color: #eee8d5; }
+        section.tool-wrapper div#graph-container ul.ui-tabs-nav li a {
+          border: none;
+          color: #839496;
+          font: bold 12px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+          letter-spacing: 1px;
+          text-transform: uppercase; }
+          section.tool-wrapper div#graph-container ul.ui-tabs-nav li a:hover {
+            color: #eee8d5; }
+  section.tool-wrapper div#controlls-container {
+    background: #062e39;
+    border-right: 1px solid #001317;
+    -webkit-box-shadow: 1px 0 0 #004355, inset 0 0 0 4px #06323d;
+    -moz-box-shadow: 1px 0 0 #004355, inset 0 0 0 4px #06323d;
+    box-shadow: 1px 0 0 #004355, inset 0 0 0 4px #06323d;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table-cell;
+    padding: 22.652px;
+    vertical-align: top;
+    width: 48.641%; }
+    section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper {
+      border-bottom: 1px solid #021014;
+      -webkit-box-shadow: 0 1px 0 #083e4b;
+      -moz-box-shadow: 0 1px 0 #083e4b;
+      box-shadow: 0 1px 0 #083e4b;
+      margin-bottom: 22.652px;
+      padding: 0 0 22.652px; }
+      section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton {
+        border-color: #001317;
+        border: 1px solid #3d5962;
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        -ms-border-radius: 3px;
+        -o-border-radius: 3px;
+        border-radius: 3px;
+        -webkit-box-shadow: inset 0 1px 0 0 #939da0;
+        -moz-box-shadow: inset 0 1px 0 0 #939da0;
+        box-shadow: inset 0 1px 0 0 #939da0;
+        color: white;
+        display: inline;
+        font-size: 11px;
+        font-weight: bold;
+        background-color: #637c84;
+        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #637c84), color-stop(100%, #43626b));
+        background-image: -webkit-linear-gradient(top, #637c84, #43626b);
+        background-image: -moz-linear-gradient(top, #637c84, #43626b);
+        background-image: -ms-linear-gradient(top, #637c84, #43626b);
+        background-image: -o-linear-gradient(top, #637c84, #43626b);
+        background-image: linear-gradient(top, #637c84, #43626b);
+        padding: 6px 18px 7px;
+        text-shadow: 0 1px 0 #31505a;
+        -webkit-background-clip: padding-box;
+        display: block;
+        float: right;
+        font: bold 14px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; }
+        section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton:hover {
+          -webkit-box-shadow: inset 0 1px 0 0 #778589;
+          -moz-box-shadow: inset 0 1px 0 0 #778589;
+          box-shadow: inset 0 1px 0 0 #778589;
+          cursor: pointer;
+          background-color: #5c6c71;
+          background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5c6c71), color-stop(100%, #3e5961));
+          background-image: -webkit-linear-gradient(top, #5c6c71, #3e5961);
+          background-image: -moz-linear-gradient(top, #5c6c71, #3e5961);
+          background-image: -ms-linear-gradient(top, #5c6c71, #3e5961);
+          background-image: -o-linear-gradient(top, #5c6c71, #3e5961);
+          background-image: linear-gradient(top, #5c6c71, #3e5961); }
+        section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton:active {
+          border: 1px solid #3d5962;
+          -webkit-box-shadow: inset 0 0 8px 4px #395057, inset 0 0 8px 4px #395057, 0 1px 1px 0 #eeeeee;
+          -moz-box-shadow: inset 0 0 8px 4px #395057, inset 0 0 8px 4px #395057, 0 1px 1px 0 #eeeeee;
+          box-shadow: inset 0 0 8px 4px #395057, inset 0 0 8px 4px #395057, 0 1px 1px 0 #eeeeee; }
+        section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton:active {
+          -webkit-box-shadow: none;
+          -moz-box-shadow: none;
+          box-shadow: none; }
+        section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton[value="Stop"] {
+          border: 1px solid #030d15;
+          -webkit-border-radius: 3px;
+          -moz-border-radius: 3px;
+          -ms-border-radius: 3px;
+          -o-border-radius: 3px;
+          border-radius: 3px;
+          -webkit-box-shadow: inset 0 1px 0 0 #215f8a;
+          -moz-box-shadow: inset 0 1px 0 0 #215f8a;
+          box-shadow: inset 0 1px 0 0 #215f8a;
+          color: white;
+          display: inline;
+          font-size: 11px;
+          font-weight: bold;
+          background-color: #0f3550;
+          background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0f3550), color-stop(100%, #041623));
+          background-image: -webkit-linear-gradient(top, #0f3550, #041623);
+          background-image: -moz-linear-gradient(top, #0f3550, #041623);
+          background-image: -ms-linear-gradient(top, #0f3550, #041623);
+          background-image: -o-linear-gradient(top, #0f3550, #041623);
+          background-image: linear-gradient(top, #0f3550, #041623);
+          padding: 6px 18px 7px;
+          text-shadow: 0 1px 0 #000203;
+          -webkit-background-clip: padding-box;
+          font: bold 14px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif; }
+          section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton[value="Stop"]:hover {
+            -webkit-box-shadow: inset 0 1px 0 0 #174362;
+            -moz-box-shadow: inset 0 1px 0 0 #174362;
+            box-shadow: inset 0 1px 0 0 #174362;
+            cursor: pointer;
+            background-color: #0c2739;
+            background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0c2739), color-stop(100%, #030d15));
+            background-image: -webkit-linear-gradient(top, #0c2739, #030d15);
+            background-image: -moz-linear-gradient(top, #0c2739, #030d15);
+            background-image: -ms-linear-gradient(top, #0c2739, #030d15);
+            background-image: -o-linear-gradient(top, #0c2739, #030d15);
+            background-image: linear-gradient(top, #0c2739, #030d15); }
+          section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton[value="Stop"]:active {
+            border: 1px solid #030d15;
+            -webkit-box-shadow: inset 0 0 8px 4px #010507, inset 0 0 8px 4px #010507, 0 1px 1px 0 #eeeeee;
+            -moz-box-shadow: inset 0 0 8px 4px #010507, inset 0 0 8px 4px #010507, 0 1px 1px 0 #eeeeee;
+            box-shadow: inset 0 0 8px 4px #010507, inset 0 0 8px 4px #010507, 0 1px 1px 0 #eeeeee; }
+          section.tool-wrapper div#controlls-container div.graph-controls div.music-wrapper input#playButton[value="Stop"]:active {
+            -webkit-box-shadow: none;
+            -moz-box-shadow: none;
+            box-shadow: none; }
+    section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper {
+      border-bottom: 1px solid #021014;
+      -webkit-box-shadow: 0 1px 0 #083e4b;
+      -moz-box-shadow: 0 1px 0 #083e4b;
+      box-shadow: 0 1px 0 #083e4b;
+      zoom: 1;
+      margin-bottom: 22.652px;
+      margin-bottom: 22.652px;
+      padding: 0 0 22.652px; }
+      section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:before, section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:after {
+        content: "";
+        display: table; }
+      section.tool-wrapper div#controlls-container div.graph-controls div.inputs-wrapper:after {
+        clear: both; }
+    section.tool-wrapper div#controlls-container div.graph-controls p {
+      font-weight: bold;
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      margin: 0;
+      text-shadow: 0 -1px 0 #021014;
+      -webkit-font-smoothing: antialiased; }
+    section.tool-wrapper div#controlls-container div.graph-controls ul {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      margin-bottom: 0; }
+      section.tool-wrapper div#controlls-container div.graph-controls ul li {
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        margin-bottom: 0; }
+        section.tool-wrapper div#controlls-container div.graph-controls ul li input {
+          margin-right: 5px; }
+    section.tool-wrapper div#controlls-container div.graph-controls div#graph-listen {
+      display: block;
+      float: left;
+      margin-bottom: 0;
+      margin-right: 20px;
+      margin-top: 8px;
+      text-align: right; }
+    section.tool-wrapper div#controlls-container label {
+      -webkit-border-radius: 2px;
+      -moz-border-radius: 2px;
+      -ms-border-radius: 2px;
+      -o-border-radius: 2px;
+      border-radius: 2px;
+      color: #fff;
+      font-weight: bold;
+      padding: 3px;
+      -webkit-font-smoothing: antialiased; }
+    section.tool-wrapper div#controlls-container label[for="vinCheckbox"], section.tool-wrapper div#controlls-container label[for="vinRadioButton"] {
+      color: #409fbf; }
+    section.tool-wrapper div#controlls-container label[for="voutCheckbox"], section.tool-wrapper div#controlls-container label[for="voutRadioButton"] {
+      color: #e1a600; }
+    section.tool-wrapper div#controlls-container label[for="vrCheckbox"], section.tool-wrapper div#controlls-container label[for="vrRadioButton"] {
+      color: #49c944; }
+    section.tool-wrapper div#controlls-container label[for="vcCheckbox"], section.tool-wrapper div#controlls-container label[for="vcRadioButton"] {
+      color: #e1a600; }
+    section.tool-wrapper div#controlls-container label[for="vlCheckbox"], section.tool-wrapper div#controlls-container label[for="vlRadioButton"] {
+      color: #a26784; }
+    section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders {
+      border-bottom: 1px solid #021014;
+      -webkit-box-shadow: 0 1px 0 #083e4b;
+      -moz-box-shadow: 0 1px 0 #083e4b;
+      box-shadow: 0 1px 0 #083e4b;
+      margin-bottom: 22.652px;
+      padding: 0 0 22.652px; }
+      section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders select#musicTypeSelect {
+        font: 16px "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        margin-bottom: 0; }
+      section.tool-wrapper div#controlls-container div.schematic-sliders div.top-sliders p {
+        font-weight: bold;
+        display: -moz-inline-box;
+        -moz-box-orient: vertical;
+        display: inline-block;
+        vertical-align: baseline;
+        zoom: 1;
+        *display: inline;
+        *vertical-align: auto;
+        margin: 0 11.326px 22.652px 0;
+        text-shadow: 0 -1px 0 #021014;
+        -webkit-font-smoothing: antialiased; }
+    section.tool-wrapper div#controlls-container div.schematic-sliders div.slider-label {
+      font-weight: bold;
+      margin-bottom: 11.326px;
+      text-shadow: 0 -1px 0 #021014;
+      -webkit-font-smoothing: antialiased; }
+    section.tool-wrapper div#controlls-container div.schematic-sliders div.slider {
+      margin-bottom: 22.652px; }
+      section.tool-wrapper div#controlls-container div.schematic-sliders div.slider.ui-slider-horizontal {
+        background: #00232c;
+        border: 1px solid #000b0d;
+        -webkit-box-shadow: none;
+        -moz-box-shadow: none;
+        box-shadow: none;
+        height: 0.4em; }
+      section.tool-wrapper div#controlls-container div.schematic-sliders div.slider .ui-slider-handle {
+        background: #637c84 url("../images/amplifier-slider-handle.png") center no-repeat;
+        border: 1px solid #000b0d;
+        -webkit-box-shadow: inset 0 1px 0 #8ba1a8;
+        -moz-box-shadow: inset 0 1px 0 #8ba1a8;
+        box-shadow: inset 0 1px 0 #8ba1a8;
+        margin-top: -0.3em; }
+        section.tool-wrapper div#controlls-container div.schematic-sliders div.slider .ui-slider-handle:hover, section.tool-wrapper div#controlls-container div.schematic-sliders div.slider .ui-slider-handle:active {
+          background-color: #6e8992; }
+
+section.problem-set, div.course-wrapper section.course-content section.problems-wrapper, section.problems-wrapper {
+  position: relative; }
+  section.problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, section.problems-wrapper h2 {
+    margin-top: 0;
+    margin-bottom: 15px;
+    width: 20.109%;
+    padding-right: 2.717%;
+    border-right: 1px dashed #ddd;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table-cell;
+    vertical-align: top; }
+    section.problem-set h2.problem-header section.staff, div.course-wrapper section.course-content section.problems-wrapper h2.problem-header section.staff, section.problems-wrapper h2.problem-header section.staff {
+      margin-top: 30px;
+      font-size: 80%; }
+    @media screen and (max-width:1120px) {
+      section.problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, section.problems-wrapper h2 {
+        display: block;
+        width: auto;
+        border-right: 0; } }
+    @media print {
+      section.problem-set h2, div.course-wrapper section.course-content section.problems-wrapper h2, section.problems-wrapper h2 {
+        display: block;
+        width: auto;
+        border-right: 0; } }
+  section.problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, section.problems-wrapper section.problem {
+    display: table-cell;
+    width: 77.174%;
+    padding-left: 2.717%; }
+    @media screen and (max-width:1120px) {
+      section.problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, section.problems-wrapper section.problem {
+        display: block;
+        width: auto;
+        padding: 0; } }
+    @media print {
+      section.problem-set section.problem, div.course-wrapper section.course-content section.problems-wrapper section.problem, section.problems-wrapper section.problem {
+        display: block;
+        width: auto;
+        padding: 0; }
+        section.problem-set section.problem canvas, div.course-wrapper section.course-content section.problems-wrapper section.problem canvas, section.problems-wrapper section.problem canvas, section.problem-set section.problem img, div.course-wrapper section.course-content section.problems-wrapper section.problem img, section.problems-wrapper section.problem img {
+          page-break-inside: avoid; } }
+    section.problem-set section.problem div p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div p.status, section.problems-wrapper section.problem div p.status {
+      text-indent: -9999px;
+      margin: -1px 0 0 10px; }
+    section.problem-set section.problem div.unanswered p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div.unanswered p.status, section.problems-wrapper section.problem div.unanswered p.status {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/unanswered-icon.png") center center no-repeat;
+      height: 14px;
+      width: 14px; }
+    section.problem-set section.problem div.correct p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div.correct p.status, section.problems-wrapper section.problem div.correct p.status, section.problem-set section.problem div.ui-icon-check p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div.ui-icon-check p.status, section.problems-wrapper section.problem div.ui-icon-check p.status {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/correct-icon.png") center center no-repeat;
+      height: 20px;
+      width: 25px; }
+    section.problem-set section.problem div.correct input, div.course-wrapper section.course-content section.problems-wrapper section.problem div.correct input, section.problems-wrapper section.problem div.correct input, section.problem-set section.problem div.ui-icon-check input, div.course-wrapper section.course-content section.problems-wrapper section.problem div.ui-icon-check input, section.problems-wrapper section.problem div.ui-icon-check input {
+      border-color: green; }
+    section.problem-set section.problem div.incorrect p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div.incorrect p.status, section.problems-wrapper section.problem div.incorrect p.status, section.problem-set section.problem div.ui-icon-close p.status, div.course-wrapper section.course-content section.problems-wrapper section.problem div.ui-icon-close p.status, section.problems-wrapper section.problem div.ui-icon-close p.status {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/incorrect-icon.png") center center no-repeat;
+      height: 20px;
+      width: 20px;
+      text-indent: -9999px; }
+    section.problem-set section.problem div.incorrect input, div.course-wrapper section.course-content section.problems-wrapper section.problem div.incorrect input, section.problems-wrapper section.problem div.incorrect input, section.problem-set section.problem div.ui-icon-close input, div.course-wrapper section.course-content section.problems-wrapper section.problem div.ui-icon-close input, section.problems-wrapper section.problem div.ui-icon-close input {
+      border-color: red; }
+    section.problem-set section.problem div > span, div.course-wrapper section.course-content section.problems-wrapper section.problem div > span, section.problems-wrapper section.problem div > span {
+      display: block;
+      margin-bottom: 11.326px; }
+    section.problem-set section.problem div p.answer, div.course-wrapper section.course-content section.problems-wrapper section.problem div p.answer, section.problems-wrapper section.problem div p.answer {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      margin-bottom: 0;
+      margin-left: 10px; }
+      section.problem-set section.problem div p.answer:before, div.course-wrapper section.course-content section.problems-wrapper section.problem div p.answer:before, section.problems-wrapper section.problem div p.answer:before {
+        content: "Answer: ";
+        font-weight: bold;
+        display: inline; }
+      section.problem-set section.problem div p.answer:empty:before, div.course-wrapper section.course-content section.problems-wrapper section.problem div p.answer:empty:before, section.problems-wrapper section.problem div p.answer:empty:before {
+        display: none; }
+    section.problem-set section.problem div div.equation, div.course-wrapper section.course-content section.problems-wrapper section.problem div div.equation, section.problems-wrapper section.problem div div.equation {
+      clear: both;
+      padding: 6px;
+      background: #eee; }
+      section.problem-set section.problem div div.equation span, div.course-wrapper section.course-content section.problems-wrapper section.problem div div.equation span, section.problems-wrapper section.problem div div.equation span {
+        margin-bottom: 0; }
+    section.problem-set section.problem div span.unanswered, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.unanswered, section.problems-wrapper section.problem div span.unanswered, section.problem-set section.problem div span.ui-icon-bullet, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.ui-icon-bullet, section.problems-wrapper section.problem div span.ui-icon-bullet {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/unanswered-icon.png") center center no-repeat;
+      height: 14px;
+      position: relative;
+      top: 4px;
+      width: 14px; }
+    section.problem-set section.problem div span.correct, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.correct, section.problems-wrapper section.problem div span.correct, section.problem-set section.problem div span.ui-icon-check, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.ui-icon-check, section.problems-wrapper section.problem div span.ui-icon-check {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/correct-icon.png") center center no-repeat;
+      height: 20px;
+      position: relative;
+      top: 6px;
+      width: 25px; }
+    section.problem-set section.problem div span.incorrect, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.incorrect, section.problems-wrapper section.problem div span.incorrect, section.problem-set section.problem div span.ui-icon-close, div.course-wrapper section.course-content section.problems-wrapper section.problem div span.ui-icon-close, section.problems-wrapper section.problem div span.ui-icon-close {
+      display: -moz-inline-box;
+      -moz-box-orient: vertical;
+      display: inline-block;
+      vertical-align: baseline;
+      zoom: 1;
+      *display: inline;
+      *vertical-align: auto;
+      background: url("../images/incorrect-icon.png") center center no-repeat;
+      height: 20px;
+      width: 20px;
+      position: relative;
+      top: 6px; }
+    section.problem-set section.problem ul, div.course-wrapper section.course-content section.problems-wrapper section.problem ul, section.problems-wrapper section.problem ul {
+      list-style: disc outside none;
+      margin-bottom: 22.652px;
+      margin-left: .75em;
+      margin-left: .75rem; }
+    section.problem-set section.problem ol, div.course-wrapper section.course-content section.problems-wrapper section.problem ol, section.problems-wrapper section.problem ol {
+      list-style: decimal outside none;
+      margin-bottom: 22.652px;
+      margin-left: .75em;
+      margin-left: .75rem; }
+    section.problem-set section.problem dl, div.course-wrapper section.course-content section.problems-wrapper section.problem dl, section.problems-wrapper section.problem dl {
+      line-height: 1.4em; }
+    section.problem-set section.problem dl dt, div.course-wrapper section.course-content section.problems-wrapper section.problem dl dt, section.problems-wrapper section.problem dl dt {
+      font-weight: bold; }
+    section.problem-set section.problem dl dd, div.course-wrapper section.course-content section.problems-wrapper section.problem dl dd, section.problems-wrapper section.problem dl dd {
+      margin-bottom: 0; }
+    section.problem-set section.problem dd, div.course-wrapper section.course-content section.problems-wrapper section.problem dd, section.problems-wrapper section.problem dd {
+      margin-left: .5em;
+      margin-left: .5rem; }
+    section.problem-set section.problem li, div.course-wrapper section.course-content section.problems-wrapper section.problem li, section.problems-wrapper section.problem li {
+      line-height: 1.4em;
+      margin-bottom: 11.326px; }
+      section.problem-set section.problem li:last-child, div.course-wrapper section.course-content section.problems-wrapper section.problem li:last-child, section.problems-wrapper section.problem li:last-child {
+        margin-bottom: 0; }
+    section.problem-set section.problem p, div.course-wrapper section.course-content section.problems-wrapper section.problem p, section.problems-wrapper section.problem p {
+      margin-bottom: 22.652px; }
+    section.problem-set section.problem table, div.course-wrapper section.course-content section.problems-wrapper section.problem table, section.problems-wrapper section.problem table {
+      margin-bottom: 22.652px;
+      width: 100%;
+      border-collapse: collapse; }
+      section.problem-set section.problem table th, div.course-wrapper section.course-content section.problems-wrapper section.problem table th, section.problems-wrapper section.problem table th {
+        font-weight: bold;
+        text-align: left; }
+      section.problem-set section.problem table caption, div.course-wrapper section.course-content section.problems-wrapper section.problem table caption, section.problems-wrapper section.problem table caption, section.problem-set section.problem table th, div.course-wrapper section.course-content section.problems-wrapper section.problem table th, section.problems-wrapper section.problem table th, section.problem-set section.problem table td, div.course-wrapper section.course-content section.problems-wrapper section.problem table td, section.problems-wrapper section.problem table td {
+        padding: .25em .75em .25em 0;
+        padding: .25rem .75rem .25rem 0; }
+      section.problem-set section.problem table caption, div.course-wrapper section.course-content section.problems-wrapper section.problem table caption, section.problems-wrapper section.problem table caption {
+        background: #f1f1f1;
+        margin-bottom: .75em;
+        margin-bottom: .75rem;
+        padding: .75em 0;
+        padding: .75rem 0; }
+      section.problem-set section.problem table tr, div.course-wrapper section.course-content section.problems-wrapper section.problem table tr, section.problems-wrapper section.problem table tr, section.problem-set section.problem table td, div.course-wrapper section.course-content section.problems-wrapper section.problem table td, section.problems-wrapper section.problem table td, section.problem-set section.problem table th, div.course-wrapper section.course-content section.problems-wrapper section.problem table th, section.problems-wrapper section.problem table th {
+        vertical-align: middle; }
+    section.problem-set section.problem hr, div.course-wrapper section.course-content section.problems-wrapper section.problem hr, section.problems-wrapper section.problem hr {
+      background: #ddd;
+      border: none;
+      clear: both;
+      color: #ddd;
+      float: none;
+      height: 1px;
+      margin: 0 0 .75rem;
+      width: 100%; }
+    section.problem-set section.problem .hidden, div.course-wrapper section.course-content section.problems-wrapper section.problem .hidden, section.problems-wrapper section.problem .hidden {
+      display: none;
+      visibility: hidden; }
+    section.problem-set section.problem input[type="email"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="email"], section.problems-wrapper section.problem input[type="email"], section.problem-set section.problem input[type="number"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="number"], section.problems-wrapper section.problem input[type="number"], section.problem-set section.problem input[type="password"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="password"], section.problems-wrapper section.problem input[type="password"], section.problem-set section.problem input[type="search"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="search"], section.problems-wrapper section.problem input[type="search"], section.problem-set section.problem input[type="tel"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="tel"], section.problems-wrapper section.problem input[type="tel"], section.problem-set section.problem input[type="text"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="text"], section.problems-wrapper section.problem input[type="text"], section.problem-set section.problem input[type="url"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="url"], section.problems-wrapper section.problem input[type="url"], section.problem-set section.problem input[type="color"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="color"], section.problems-wrapper section.problem input[type="color"], section.problem-set section.problem input[type="date"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="date"], section.problems-wrapper section.problem input[type="date"], section.problem-set section.problem input[type="datetime"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="datetime"], section.problems-wrapper section.problem input[type="datetime"], section.problem-set section.problem input[type="datetime-local"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="datetime-local"], section.problems-wrapper section.problem input[type="datetime-local"], section.problem-set section.problem input[type="month"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="month"], section.problems-wrapper section.problem input[type="month"], section.problem-set section.problem input[type="time"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="time"], section.problems-wrapper section.problem input[type="time"], section.problem-set section.problem input[type="week"], div.course-wrapper section.course-content section.problems-wrapper section.problem input[type="week"], section.problems-wrapper section.problem input[type="week"] {
+      display: inline;
+      width: auto; }
+    section.problem-set section.problem center, div.course-wrapper section.course-content section.problems-wrapper section.problem center, section.problems-wrapper section.problem center {
+      display: block;
+      margin: 22.652px 0;
+      border: 1px solid #ccc;
+      padding: 22.652px; }
+  section.problem-set section.action, div.course-wrapper section.course-content section.problems-wrapper section.action, section.problems-wrapper section.action {
+    margin-top: 11.326px; }
+    section.problem-set section.action input[type="button"], div.course-wrapper section.course-content section.problems-wrapper section.action input[type="button"], section.problems-wrapper section.action input[type="button"] {
+      padding: 9.061px 22.652px;
+      text-shadow: 0 -1px 0 #666666; }
+
+section.problems-wrapper {
+  display: table;
+  width: 100%; }
+  @media screen and (max-width:1120px) {
+    section.problems-wrapper {
+      display: block;
+      width: auto; } }

lms/static/sass/application.scss

@@ -1,31 +1,40 @@
 @import 'bourbon/bourbon';
-@import 'base_styles/reset';
-@import 'base_styles/font_face';
-@import 'base_styles/base';
-@import 'base_styles/base_mixins';
-@import 'base_styles/base_extends';
-@import 'base_styles/base_animations';
 
+@import 'base/reset';
+@import 'base/font_face';
+@import 'base/variables';
+@import 'base/base';
+@import 'base/mixins';
+@import 'base/extends';
+@import 'base/animations';
+
+
+// Courseware styles
 @import 'sass_old/base/variables';
 @import 'sass_old/base/extends';
 @import 'sass_old/base/functions';
 
-@import 'shared_styles/shared_forms';
-@import 'shared_styles/shared_footer';
-@import 'shared_styles/shared_header';
-@import 'shared_styles/shared_list_of_courses';
-@import 'shared_styles/shared_course_filter';
-@import 'shared_styles/shared_modal';
+
+// Multicourse styles
+@import 'shared/forms';
+@import 'shared/footer';
+@import 'shared/header';
+@import 'shared/course_object';
+@import 'shared/course_filter';
+@import 'shared/modal';
+@import 'shared/activation_messages';
 
 @import 'home';
 @import 'dashboard';
-@import 'course_object';
+@import 'courseware_subnav';
 @import 'courses';
 @import 'course_about';
 @import 'jobs';
 @import 'about_pages';
 @import 'press_release';
 
+
+// Courseware styles
 @import 'sass_old/courseware/courseware';
 @import 'sass_old/courseware/sequence-nav';
 @import 'sass_old/courseware/sidebar';

lms/static/sass/base/_base.scss

@@ -1,26 +1,9 @@
-$gw-column: 60px;
-$gw-gutter: 25px;
-
-$fg-column: $gw-column;
-$fg-gutter: $gw-gutter;
-$fg-max-columns: 12;
-
-$sans-serif: 'Open Sans', $verdana;
-$serif: $georgia;
-
-$base-font-color: rgb(60,60,60);
-$lighter-base-font-color: rgb(160,160,160);
-
-$blue: rgb(29,157,217);
-$pink: rgb(182,37,104);
-$yellow: rgb(255, 252, 221);
-
 html, body {
   background: rgb(250,250,250);
-  //background: rgb(77, 82, 99);
   font-family: $sans-serif;
   font-size: 1em;
   line-height: 1em;
+  -webkit-font-smoothing: antialiased;
 }
 
 h1, h2, h3, h4, h5, h6 {
@@ -99,8 +82,8 @@ a:link, a:visited {
 .container {
   @include clearfix;
   margin: 0 auto 0;
-  max-width: 1200px;
-  width: flex-grid(12);
+  padding: 0px 10px;
+  width: grid-width(12);
 }
 
 .static-container {

lms/static/sass/base/_extends.scss

@@ -76,3 +76,16 @@
                                                     rgba(200,200,200, 0)));
   border: none;
 }
+
+//Styles for Error messages
+.error-message-colors {
+  background: $error-red;
+  border: 1px solid rgb(202, 17, 17);
+  color: rgb(143, 14, 14);
+}
+
+.success-message-colors {
+  background: rgb(99, 236, 137);
+  border: 1px solid rgb(17, 202, 54);
+  color: rgb(35, 143, 14);
+}

lms/static/sass/base/_variables.scss

@@ -0,0 +1,18 @@
+$gw-column: 80px;
+$gw-gutter: 20px;
+
+$fg-column: $gw-column;
+$fg-gutter: $gw-gutter;
+$fg-max-columns: 12;
+
+$sans-serif: 'Open Sans', $verdana;
+$serif: $georgia;
+
+$base-font-color: rgb(60,60,60);
+$lighter-base-font-color: rgb(160,160,160);
+
+$blue: rgb(29,157,217);
+$pink: rgb(182,37,104);
+$yellow: rgb(255, 252, 221);
+$error-red: rgb(253, 87, 87);
+

lms/static/sass/shared/_activation_messages.scss

@@ -0,0 +1,30 @@
+.container.activation {
+  padding: 60px 0px 120px;
+
+  h1 {
+    margin-bottom: 20px;
+    padding: 10px;
+
+    &.invalid {
+      @extend .error-message-colors;
+    }
+
+    &.valid {
+      @extend .success-message-colors;
+    }
+  }
+
+  h1 + hr {
+    margin-bottom: 30px;
+  }
+
+  .message {
+    background: rgb(252,252,252);
+    border: 1px solid rgb(200,200,200);
+    @include box-shadow(0 3px 20px 0 rgba(0,0,0, 0.2));
+    @include border-radius(4px);
+    margin: 0 auto;
+    padding: 40px;
+    width: flex-grid(6);
+  }
+}

lms/static/sass/shared/_course_object.scss

@@ -1,7 +1,7 @@
 .highlighted-courses, .find-courses {
   .courses {
     @include clearfix;
-    padding: 40px 15px 15px;
+    padding: 40px 0px 15px;
 
     .course {
       background: rgb(250,250,250);
@@ -33,6 +33,7 @@
 
         p {
           color: rgb(255,255,255);
+          font-style: italic;
           line-height: 1.2em;
           padding: 4px 12px 5px;
         }
@@ -69,7 +70,11 @@
 
             h2 {
               color: $base-font-color;
+              font-family: $sans-serif;
+              font-size: 1em;
+              font-weight: 700;
               margin-bottom: 0px;
+              overflow: hidden;
               padding-top: 9px;
               text-shadow: 0 1px rgba(255,255,255, 0.6);
               text-overflow: ellipsis;

lms/static/sass/shared/_footer.scss

@@ -12,11 +12,10 @@ footer {
   }
 
   nav {
-    @include box-sizing(border-box);
     max-width: 1200px;
     margin: 0 auto;
     padding: 30px 10px 0;
-    width: flex-grid(12);
+    width: grid-width(12);
 
     .top {
       border-bottom: 1px solid rgb(200,200,200);

lms/static/sass/shared/_forms.scss

@@ -42,5 +42,6 @@ form {
     letter-spacing: 1px;
     text-transform: uppercase;
     vertical-align: top;
+    -webkit-font-smoothing: antialiased;
   }
 }

lms/static/sass/shared/_header.scss

@@ -9,12 +9,11 @@ header.global {
 
   nav {
     @include clearfix;
-    @include box-sizing(border-box);
     height: 40px;
     margin: 0 auto;
     max-width: 1200px;
-    padding-top: 14px;
-    width: flex-grid(12);
+    padding: 14px 10px 0px;
+    width: grid-width(12);
   }
 
   h1.logo {
@@ -136,57 +135,65 @@ header.global {
     &.user {
       float: right;
 
+      > li.primary {
+        display: block;
+        float: left;
+        margin: 0px;
+
+        > a {
+          margin: 0px;
+          @include border-right-radius(0px);
+        }
+
+        &:last-child {
+          > a {
+            @include border-radius(0 4px 4px 0);
+            border-left: none;
+          }
+        }
+      }
+
       a.user-link {
         padding: 10px 12px 10px 42px;
         position: relative;
         text-transform: none;
 
         .avatar {
-          background: rgb(220,220,220);
-          @include border-radius(3px);
-          border: 1px solid rgb(80,80,80);
-          @include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
-          height: 21px;
+          //background: rgb(220,220,220);
+          @include background-image(url('/static/images/portal-icons/home-icon.png'));
+          background-size: cover;
+          //@include border-radius(3px);
+          //border: 1px solid rgb(80,80,80);
+          //@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6));
+          height: 26px;
           @include inline-block;
           left: 8px;
+          opacity: 0.5;
           overflow: hidden;
           position: absolute;
-          top: 7px;
-          width: 21px;
+          top: 4px;
+          @include transition(all, 0.15s, linear);
+          width: 26px;
+        }
 
-          &::after {
-            @include background-image(linear-gradient((-60deg), rgba(0,0,0, 0) 0%, rgba(0,0,0, 0.1) 50%, rgba(0,0,0, 0.2) 50%, rgba(0,0,0, 0.3) 100%));
-            content: "";
-            display: block;
-            height: 100%;
-            position: absolute;
-            right: 0px;
-            top: 0px;
-            width: 100%;
-          }
-
-          img {
-            @include border-radius(4px);
-            display: block;
-            min-height: 100%;
-            min-width: 100%;
-            height: 100%;
+        &:hover {
+          .avatar {
+            opacity: 0.8;
           }
         }
       }
 
       ul.dropdown-menu {
+        background: rgb(252,252,252);
         @include border-radius(4px);
-        @include box-shadow(0 1px 6px 0 rgba(0,0,0, 0.3));
-        border: 1px solid rgb(0,0,0);
-        @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.9) 0%,
-                                                          rgba(0,0,0, 0.7) 100%));
+        @include box-shadow(0 2px 24px 0 rgba(0,0,0, 0.3));
+        border: 1px solid rgb(100,100,100);
         display: none;
         padding: 5px 10px;
         position: absolute;
-        right: 4px;
+        right: 0px;
         top: 50px;
-        width: 150px;
+        width: 170px;
         z-index: 3;
 
         &.expanded {
@@ -196,8 +203,8 @@ header.global {
         &::before {
           background: transparent;
           border: {
-            top: 6px solid rgba(0,0,0, 1);
-            right: 6px solid rgba(0,0,0, 1);
+            top: 6px solid rgba(252,252,252, 1);
+            right: 6px solid rgba(252,252,252, 1);
             bottom: 6px solid transparent;
             left: 6px solid transparent;
           }
@@ -214,7 +221,7 @@ header.global {
 
         li {
           display: block;
-          border-top: 1px solid rgba(0,0,0, 0.4);
+          border-top: 1px dotted rgba(200,200,200, 1);
           @include box-shadow(inset 0 1px 0 0 rgba(255,255,255, 0.05));
 
           &:first-child {
@@ -223,31 +230,23 @@ header.global {
           }
 
           > a {
-            @include box-sizing(border-box);
+            border: 1px solid transparent;
             @include border-radius(3px);
-            color: rgba(255,255,255, 0.9);
+            @include box-sizing(border-box);
+            color: $blue;
+            cursor: pointer;
             display: block;
-            font-family: $serif;
-            height: auto;
-            line-height: 1em;
             margin: 5px 0px;
             overflow: hidden;
             padding: 3px 5px 4px;
-            text-shadow: none;
             text-overflow: ellipsis;
-            text-transform: none;
-            @include transition(padding, 0.1s, linear);
+            @include transition(padding, 0.15s, linear);
             white-space: nowrap;
             width: 100%;
 
             &:hover {
-              background: $blue;
-              @include background-image(linear-gradient(-90deg, lighten($blue, 15%) 0%,
-                                                                rgba($blue, 1) 100%));
-              border-color: rgba(0,0,0, 1);
-              @include box-shadow(none);
-              padding-left: 8px;
-              text-shadow: 0 -1px rgba(0,0,0, 0.2);
+              color: $base-font-color;
+              text-decoration: none;
             }
           }
         }

lms/static/sass/shared/_modal.scss

@@ -20,7 +20,7 @@
   left: 50%;
   padding: 8px;
   position: absolute;
-  width: grid-width(6);
+  width: grid-width(5);
   z-index: 12;
 
   &.video-modal {
@@ -107,7 +107,7 @@
     }
 
     #enroll_error, #login_error {
-      background: rgb(253, 87, 87);
+      background: $error-red;
       border: 1px solid rgb(202, 17, 17);
       color: rgb(143, 14, 14);
       display: none;
@@ -115,15 +115,9 @@
       padding: 12px;
     }
 
-    //#enroll {
-      //padding: 0 40px;
-
-      //h1 {
-        //font: normal 1em/1.6em $sans-serif;
-        //margin-bottom: 10px;
-        //text-align: left;
-      //}
-    //}
+    .activation-message {
+      padding: 0 40px 10px;
+    }
 
     form {
       margin-bottom: 12px;

lms/templates/about.html

@@ -12,14 +12,16 @@
 
   <section class="vision">
     <section class="company-mission message left">
-      <div class="inner-wrapper">
-        <div class="photo">
-          <img src="">
-        </div>
-        <h2>Mission: Educate 1 billion people around the world</h2>
-        <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
-        <p>Harvard President Drew Faust said, “edX gives Harvard and MIT an unprecedented opportunity to dramatically extend our collective reach by conducting groundbreaking research into effective education and by extending online access to quality higher education.”
+      <div class="photo">
+        <img src="">
       </div>
+      <article>
+        <h2>About edX</h2>
+        <p>EdX is a joint partnership between The Massachusetts Institute of Technology (MIT) and Harvard University to offer online learning to millions of people around the world. EdX offer Harvard and MIT classes online for free. Through this partnership, with other partners to follow, the institutions aim to extend their collective reach to build a global community of online students.</p>
+        <p>MIT’s Director of the Computer Science and Artificial Intelligence Laboratory Anant Agarwal serves as the first president of edX, and Harvard’s Faculty of Arts and Sciences Dean Michael D. Smith leads faculty in developing courses. Along with offering online courses, the institutions will use edX to research how students learn and how technology can facilitate teaching—both on-campus and online.</p>
+        <p>EdX is based on an open-source technological platform that provides interactive educational materials designed specifically for the web, and is available to anyone in the world with an internet connection.</p>
+        <p>Harvard and MIT have created edX open-source software and invite interested institutions to join edX with their own educational content. EdX is a Cambridge-based not-for-profit, equally owned and funded by Harvard and MIT</p>
+      </article>
       <hr class="fade-right-hr-divider">
     </section>
 
@@ -27,9 +29,11 @@
       <div class="photo">
         <img src="">
       </div>
-      <h2>Mission: Educate 1 billion people around the world</h2>
-      <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
-      <p>Harvard President Drew Faust said, “edX gives Harvard and MIT an unprecedented opportunity to dramatically extend our collective reach by conducting groundbreaking research into effective education and by extending online access to quality higher education.”
+      <article>
+        <h2>Harvard University</h2>
+        <p>Harvard University is devoted to excellence in teaching, learning, and research, and to developing leaders in many disciplines who make a difference globally. Harvard faculty are engaged with teaching and research to push the boundaries of human knowledge. For students who are excited to investigate the biggest issues of the 21st century, Harvard offers an unparalleled student experience and a generous financial aid program, with over $160 million awarded to more than 60% of our undergraduate students. The University has twelve degree-granting Schools in addition to the Radcliffe Institute for Advanced Study, offering a truly global education.</p>
+        <p>Established in 1636, Harvard is the oldest institution of higher education in the United States. The University, which is based in Cambridge and Boston, Massachusetts, has an enrollment of over 20,000 degree candidates, including undergraduate, graduate, and professional students. Harvard has more than 360,000 alumni around the world.</p>
+      </article>
       <hr class="fade-left-hr-divider">
     </section>
 
@@ -37,9 +41,12 @@
       <div class="photo">
         <img src="">
       </div>
-      <h2>Mission: Educate 1 billion people around the world</h2>
-      <p>“EdX represents a unique opportunity to improve education on our own campuses through online learning, while simultaneously creating a bold new educational path for millions of learners worldwide,” MIT President Susan Hockfield said.</p>
-      <p>Harvard President Drew Faust said, “edX gives Harvard and MIT an unprecedented opportunity to dramatically extend our collective reach by conducting groundbreaking research into effective education and by extending online access to quality higher education.”
+      <article>
+        <h2>Massachusetts Institute of Technology</h2>
+        <p>The Massachusetts Institute of Technology — a coeducational, privately endowed research university founded in 1861 — is dedicated to advancing knowledge and educating students in science, technology, and other areas of scholarship that will best serve the nation and the world in the 21st century. The Institute has close to 1,000 faculty and 10,000 undergraduate and graduate students. It is organized into five Schools: Architecture and Urban Planning; Engineering; Humanities, Arts, and Social Sciences; Sloan School of Management; and Science.</p>
+        <p>MIT's commitment to innovation has led to a host of scientific breakthroughs and technological advances. Seventy-eight MIT alumni, faculty, researchers and staff have won Nobel Prizes.</p>
+        <p>Current areas of research and education include neuroscience and the study of the brain and mind, bioengineering, cancer, energy, the environment and sustainable development, information sciences and technology, new media, financial technology, and entrepreneurship.</p>
+      </article>
     </section>
   </section>
 </section>

lms/templates/activation_active.html

@@ -1,12 +1,14 @@
-<%inherit file="marketing.html" />
+<%! from django.core.urlresolvers import reverse %>
+<%inherit file="main.html" />
 
-<section class="tos">
-<div>
+<%namespace name='static' file='static_content.html'/>
 
-<section class="activation">
-  <h1>Account already active!</h1>
-  <!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> -->
-  <p> This account has already been activated. You can log in at
-  the <a href="/">6.002x course page</a>.</p>
-</div>
+<section class="container activation">
+
+  <section class="message">
+    <h1>Account already active!</h1>
+    <hr class="horizontal-divider">
+
+    <p> This account has already been activated. You can now <a href="#login-modal" rel="leanModal">login</a>.</p>
+  </section>
 </section>

lms/templates/activation_complete.html

@@ -1,9 +1,14 @@
-<%inherit file="marketing.html" />
+<%! from django.core.urlresolvers import reverse %>
+<%inherit file="main.html" />
 
-<section class="tos">
-<div>
-  <h1>Activation Complete!</h1>
-  <!-- <p>Now go <a href="/">log in</a> and try the course!</a></p> -->
-  <p>Thanks for activating your account. You can log in at the <a href="/">6.002x course page</a>.</p>
-</div>
+<%namespace name='static' file='static_content.html'/>
+
+<section class="container activation">
+
+  <section class="message">
+    <h1 class="valid">Activation Complete!</h1>
+    <hr class="horizontal-divider">
+
+    <p>Thanks for activating your account. You can now <a href="#login-modal" rel="leanModal">login</a>.</p>
+  </section>
 </section>

lms/templates/activation_invalid.html

@@ -1,14 +1,19 @@
-<%inherit file="marketing.html" />
+<%! from django.core.urlresolvers import reverse %>
+<%inherit file="main.html" />
 
-<section class="tos">
-<div>
-<h1>Activation Invalid</h1>
+<%namespace name='static' file='static_content.html'/>
 
-<p>Something went wrong. Check to make sure the URL you went to was
-  correct -- e-mail programs will sometimes split it into two
-  lines. If you still have issues, e-mail us to let us know what happened
-  at <a href="mailto:bugs@mitx.mit.edu">bugs@mitx.mit.edu</a>.</p>
+<section class="container activation">
 
-  <p>Or you can go back to the <a href="/">6.002x course page</a>.</p>
-</div>
+  <section class="message">
+    <h1 class="invalid">Activation Invalid</h1>
+    <hr class="horizontal-divider">
+
+    <p>Something went wrong. Check to make sure the URL you went to was
+      correct -- e-mail programs will sometimes split it into two
+      lines. If you still have issues, e-mail us to let us know what happened
+      at <a href="mailto:bugs@edx.org">bugs@edx.org</a>.</p>
+
+    <p>Or you can go back to the <a href="/">home page</a>.</p>
+  </section>
 </section>

lms/templates/course.html

@@ -9,7 +9,7 @@
     <header class="course-preview">
         <a href="${reverse('about_course', args=[course.id])}">
         <hgroup>
-          <h2>${course.get_about_section('title')}</h2>
+          <h2>${course.number} ${course.get_about_section('title')}</h2>
         </hgroup>
         <div class="info-link">&#x2794;</div>
       </a>

lms/templates/courses.html

@@ -3,7 +3,7 @@
 <%namespace name='static' file='static_content.html'/>
 
 <section class="find-courses">
-  <header class="search">
+  <header class="search" style="background: url('/static/images/shot-2-large.jpg')">
     <div class="inner-wrapper main-search">
       <hgroup>
         <div class="logo">
@@ -16,7 +16,7 @@
 
   <section class="container">
     ## I'm removing this for now since we aren't using it for the fall.
-    <%include file="course_filter.html" />
+    ## <%include file="course_filter.html" />
     <section class="courses">
       %for course in courses:
         <%include file="course.html" args="course=course" />

lms/templates/dashboard.html

@@ -11,13 +11,13 @@
       <section class="user-info">
         <ul>
           <li>
-            <img src=""><p>Email<span>${ user.email }</span></p>
+            <span class="title"><div class="icon email-icon"></div>Email</span><span class="data">${ user.email }</span>
           </li>
           <li>
-            <img src=""><p>Location<span>${ user.profile.location }</span></p>
+            <span class="title"><div class="icon location-icon"></div>Location</span><span class="data">${ user.profile.location }</span>
           </li>
           <li>
-            <img src=""><p>Language<span>${ user.profile.language }</span></p>
+            <span class="title"><div class="icon language-icon"></div>Language</span><span class="data">${ user.profile.language }</span>
           </li>
         </ul>
       </section>
@@ -46,7 +46,7 @@
               <p>Class Starts - <span>9/2/2012</span></div>
             </section>
             <section class="meta">
-              <div src="" class="course-work-icon"></div>
+              <div class="course-work-icon"></div>
               <div class="progress">
                 <div class="meter">
                   <div class="meter-fill"></div>

lms/templates/footer.html

@@ -10,6 +10,7 @@
         <a href="/t/about.html">About</a>
         <a href="#">Blog</a>
         <a href="/t/jobs.html">Jobs</a>
+        <a href="/t/contact.html">Contact</a>
       </section>
 
       <section class="social">

lms/templates/index.html

@@ -7,31 +7,37 @@
     <div class="outer-wrapper">
       <div class="inner-wrapper">
         <div class="title">
-          <h1>The Future of Online Education</h1>
+          <h1>Online education for anyone, anywhere, at anytime</h1>
+
           <div class="main-cta">
-            <a href="${reverse('courses')}" class="find-courses">Find Courses</a>
+            <a href="#signup-modal" class="find-courses" rel="leanModal">Sign Up</a>
           </div>
 
-          <div class="social-sharing">
-            <div class="sharing-message">Share with friends and family!</div>
-            <a href="#" class="share">
-              <img src="${static.url('images/twitter-sharing.png')}">
-            </a>
-            <a href="#" class="share">
-              <img src="${static.url('images/facebook-sharing.png')}">
-            </a>
-            <a href="#" class="share">
-              <img src="${static.url('images/email-sharing.png')}">
+          <div class="secondary-actions">
+            <div class="social-sharing">
+              <div class="sharing-message">Share with friends and family!</div>
+              <a href="#" class="share">
+                <img src="${static.url('images/twitter-sharing.png')}">
+              </a>
+              <a href="#" class="share">
+                <img src="${static.url('images/facebook-sharing.png')}">
+              </a>
+              <a href="#" class="share">
+                <img src="${static.url('images/email-sharing.png')}">
+              </a>
+            </div>
+
+            <a href="#video-modal" class="intro-video" rel="leanModal">
+              <!--
+                 -<img src="${static.url('images/courses/space1.jpg')}" />
+                 -->
+              <div class="video">
+                <div class="play"></div>
+              </div>
+              <p>Play intro video</p>
             </a>
           </div>
         </div>
-
-        <a href="#video-modal" class="media" rel="leanModal">
-          <div class="hero">
-            <img src="${static.url('images/courses/space1.jpg')}" />
-            <div class="play-intro"></div>
-          </div>
-        </a>
       </div>
     </div>
   </header>
@@ -87,10 +93,10 @@
         <section class="blog-posts">
           <article>
             <a href="#" class="post-graphics">
-              <img src="${static.url('images/courses/space1.jpg')}" />
+              <img src="${static.url('images/mongolia_post.jpeg')}" />
             </a>
             <div class="post-name">
-              <a href="">Online Classes Cut Costs, But Do They Dilute Brands?</a>
+              <a href="">Opening Doors For Exceptional Students: 6.002x in Mongolia.</a>
               <p class="post-date">7/12/2012</p>
             </div>
           </article>

lms/templates/jobs.html

@@ -22,6 +22,14 @@
     <h2>We are currently looking for</h2>
 
     <section class="jobs-listing">
+      <article id="technology-team" class="job">
+        <div class="inner-wrapper">
+          <h3>Technology Team</h3>
+          <p>[Looking for both back-end and front-end developers. Strong backgrounds in machine learning, education, user interaction design, big data, or social network analysis are desirable, but team members do wear many hats. Best candidate would be a masterful hacker who went and did startups after finishing their Ph.D. We should find a way to make some positions that parallel fellows, and can leverage MIT/Harvard prestige]</p>
+          <p>If you're interested in this position, send an e-mail to <a href="">content-engineer@edxonline.org</a></p>
+        </div>
+      </article>
+
       <article id="edx-fellow" class="job">
         <div class="inner-wrapper">
           <h3>edX Fellow</h3>
@@ -49,27 +57,20 @@
           <p>If you're interested in this position, send an e-mail to <a href="">content-engineer@edxonline.org</a></p>
         </div>
       </article>
-
-      <article id="technology-team" class="job">
-        <div class="inner-wrapper">
-          <h3>Technology Team</h3>
-          <p>[Looking for both back-end and front-end developers. Strong backgrounds in machine learning, education, user interaction design, big data, or social network analysis are desirable, but team members do wear many hats. Best candidate would be a masterful hacker who went and did startups after finishing their Ph.D. We should find a way to make some positions that parallel fellows, and can leverage MIT/Harvard prestige]</p>
-          <p>If you're interested in this position, send an e-mail to <a href="">content-engineer@edxonline.org</a></p>
-        </div>
-      </article>
     </section>
 
     <section class="jobs-sidebar">
       <h2>Positions</h2>
       <nav>
+        <a href="#technology-team">Technology Team</a>
         <a href="#edx-fellow">edX Fellow</a>
         <a href="#content-engineer">Content Engineer</a>
-        <a href="#technology-team">Technology Team</a>
       </nav>
       <h2>How to Apply</h2>
-      <p>E-mail your resume, coverletter and any other materials to <a href="#">careers@edxonline.org</a></p>
+      <p>E-mail your resume, coverletter and any other materials to <a href="#">careers@edx.org</a></p>
       <h2>Our Location</h2>
-      <p>11 Cambridge Center, Cambridge MA USA</p>
+      <p>11 Cambridge Center <br/>
+      Cambridge, MA 02142</p>
     </section>
   </section>
 

lms/templates/navigation.html

@@ -17,17 +17,17 @@
     <ol class="user">
       <li class="primary">
         <a href="${reverse('dashboard')}" class="user-link">
-          <span class="avatar"><img src="${static.url('images/profile.jpg')}" /></span>
+          <span class="avatar"></span>
           ${user.username}
         </a>
       </li>
       <li class="primary">
         <a href="#" class="dropdown">&#9662</a>
-          <ul class="dropdown-menu">
-            <li><a href="#">Account Settings</a></li>
-            <li><a href="${reverse('help')}">Help</a></li>
-            <li><a href="${reverse('logout')}">Log Out</a></li>
-          </ul>
+        <ul class="dropdown-menu">
+          <li><a href="#">Account Settings</a></li>
+          <li><a href="${reverse('help')}">Help</a></li>
+          <li><a href="${reverse('logout')}">Log Out</a></li>
+        </ul>
       </li>
     </ol>
 
@@ -37,6 +37,7 @@
         <a href="/t/about.html">About</a>
         <a href="#">Blog</a>
         <a href="${reverse('jobs')}">Jobs</a>
+        <a href="/t/contact.html">Contact</a>
         <a href="#login-modal" id="login" rel="leanModal">Log In</a>
       </li>
       <li class="primary">

lms/templates/portal/course_about.html

@@ -11,7 +11,7 @@
     <div class="intro-inner-wrapper">
       <section class="intro">
         <hgroup>
-        <h1>${course.get_about_section("title")}</h1><h2><a href="#">${course.get_about_section("university")}</a></h2>
+        <h1>${course.number}: ${course.get_about_section("title")}</h1><h2><a href="#">${course.get_about_section("university")}</a></h2>
         </hgroup>
 
         <div class="main-cta">
@@ -47,6 +47,10 @@
 
         <section class="course-staff">
           <h2>Course staff</h3>
+
+          ${course.get_about_section("instructors")}
+
+          <!--
           <article class="teacher">
             <div class="teacher-image">
               <img src="${static.url('images/anant.jpg')}" />
@@ -70,6 +74,7 @@
             <h3>Piotr Mitros</h3>
             <p>Research Scientist at MIT. His research focus is in finding ways to apply techniques from control systems to optimizing the learning process. Dr. Mitros has worked as an analog designer at Texas Instruments, Talking Lights, and most recently, designed the analog front end for a novel medical imaging modality for Rhythmia Medical.</p>
           </article>
+          -->
         </section>
 
         <section class="requirements">
@@ -98,9 +103,6 @@
     <section class="course-sidebar">
       <section class="course-summary">
         <header>
-          <!--
-             -<a href="#" class="university-name">${course.get_about_section("university")}</a><span>${course.get_about_section("title")}</span>
-             -->
           <div class="social-sharing">
             <div class="sharing-message">Share with friends and family!</div>
             <a href="#" class="share">
@@ -116,10 +118,10 @@
         </header>
 
         <ol class="important-dates">
-          <li><img src=""><p>Classes Start</p><span class="start-date">7/12/12</span></li>
-          <li><img src=""><p>Final Exam</p><span class="final-date">12/09/12</span></li>
-          <li><img src=""><p>Course Length</p><span class="course-length">15 weeks</span></li>
-          <li><img src=""><p>Course Number</p><span class="course-number">${course.get_about_section("number")}</span></li>
+          <li><div class="icon start-icon"></div><p>Classes Start</p><span class="start-date">7/12/12</span></li>
+          <li><div class="icon final-icon"></div><p>Final Exam</p><span class="final-date">12/09/12</span></li>
+          <li><div class="icon length-icon"></div><p>Course Length</p><span class="course-length">15 weeks</span></li>
+          <li><div class="icon number-icon"></div><p>Course Number</p><span class="course-number">${course.get_about_section("number")}</span></li>
         </ol>
       </section>
     </section>

lms/templates/registration/reg_complete.html

@@ -1,3 +1,7 @@
-<h1>Check your email</h1>
-<p>An activation link has been sent to ${ email }, along with
+<header>
+  <h2>Thanks For Registering!</h2>
+  <hr>
+</header>
+
+<p class='activation-message'>Please check your email. An activation link has been sent to <strong>${ email }</strong>, along with
 instructions for activating your account.</p>

lms/templates/signup_modal.html

@@ -2,12 +2,11 @@
 
 <section id="signup-modal" class="modal signup-modal">
   <div class="inner-wrapper">
-    <header>
-      <h2>Sign Up for edX</h2>
-      <hr>
-    </header>
-
     <div id="enroll">
+      <header>
+        <h2>Sign Up for edX</h2>
+        <hr>
+      </header>
 
       <form id="enroll_form" method="post">
         <div id="enroll_error" name="enroll_error"></div>
@@ -32,26 +31,27 @@
           <input name="honor_code" type="checkbox" value="true">
           I agree to the
           <a href="/t/honor.html" target="blank">Honor Code</a>
-          , sumarized below as:
         </label>
 
-          <div class="honor-code-summary">
-            <ul>
-              <li>
-                <p>Complete all mid-terms and final exams with only my own work.</p>
-              </li>
-              <li>
-                <p>Maintain only one account, and not share the username or password.</p>
-              </li>
-              <li>
-                <p>Not engage in any activity that would dishonestly improve my results, or improve or hurt those of others.</p>
-              </li>
-              <li>
-                <p>Not post answers to problems that are being used to assess student performance.</p>
-              </li>
-            </ul>
-            <hr>
-          </div>
+          <!--
+             -<div class="honor-code-summary">
+             -  <ul>
+             -    <li>
+             -      <p>Complete all mid-terms and final exams with only my own work.</p>
+             -    </li>
+             -    <li>
+             -      <p>Maintain only one account, and not share the username or password.</p>
+             -    </li>
+             -    <li>
+             -      <p>Not engage in any activity that would dishonestly improve my results, or improve or hurt those of others.</p>
+             -    </li>
+             -    <li>
+             -      <p>Not post answers to problems that are being used to assess student performance.</p>
+             -    </li>
+             -  </ul>
+             -  <hr>
+             -</div>
+             -->
 
         <div class="submit">
           <input name="submit" type="submit" value="Create My Account">

lms/templates/university_profile.html

@@ -3,13 +3,13 @@
 <%namespace name='static' file='static_content.html'/>
 
 <section class="university-profile">
-  <header class="search">
+  <header class="search" style="background: url('/static/images/shot-5-large.jpg')">
     <div class="inner-wrapper university-search">
       <hgroup>
         <div class="logo">
-          <img src="${static.url('images/harvard.png')}" />
+          <img src="${static.url('images/mit.png')}" />
         </div>
-        <h1>HarvardX</h1>
+        <h1>MITx</h1>
       </hgroup>
     </div>
   </header>

rakefile

@@ -88,9 +88,8 @@ end
 
     # Per System tasks
     desc "Run all django tests on our djangoapps for the #{system}"
-    task "test_#{system}" => [report_dir, :predjango, "#{system}:collectstatic:test"] do
-        run_tests(system, report_dir)
-    end
+    task "test_#{system}" => ["#{system}:collectstatic:test", "fasttest_#{system}"]
+
     # Have a way to run the tests without running collectstatic -- useful when debugging without
     # messing with static files.
     task "fasttest_#{system}" => [report_dir, :predjango] do