Commit e1225834 by Bridger Maxwell

Merge branch 'dormsbee/multicourse' into multicourse_wiki

parents 064274a7 506ee58b
......@@ -39,7 +39,7 @@ def index(request):
''' Redirects to main page -- info page if user authenticated, or marketing if not
'''
if settings.COURSEWARE_ENABLED and request.user.is_authenticated():
return redirect('/courses')
return redirect(reverse('dashboard'))
else:
csrf_token = csrf(request)['csrf_token']
# TODO: Clean up how 'error' is done.
......
......@@ -2,10 +2,10 @@ $(document).ready(function () {
$('ul.tabs li').click(function() {
$('ul.tabs li').removeClass("enabled");
$(this).addClass("enabled");
var data_class = '.' + $(this).attr('data-class');
$('.tab').slideUp();
$(data_class + ':hidden').slideDown();
})
});
\ No newline at end of file
});
......@@ -16,5 +16,14 @@ $(document).ready(function () {
$('.modal.signup-modal').removeClass("visible");
$('.modal-overlay').removeClass("visible");
});
$('.hero').click(function() {
$('.modal.video-modal').addClass("visible");
$('.modal-overlay').addClass("visible");
});
$('div.close-modal').click(function() {
$('.modal.video-modal').removeClass("visible");
$('.modal-overlay').removeClass("visible");
});
});
.grid-container {
display: none;
> * {
float: left;
height: 20px;
}
.grid {
background: #FFD3DC;
margin-right: flex-gutter();
width: flex-grid(1);
&:last-child {
margin-right: 0px;
};
.course-info {
.container {
margin-bottom: 60px;
}
.gutter {
background: #E3FFDA;
display:none;
width: $fg-gutter();
}
}
header.course-profile {
background: rgb(245,245,245);
//@include background-image(linear-gradient(-90deg, rgb(230,230,230), rgb(245,245,245)));
@include box-shadow(0 1px 80px 0 rgba(0,0,0, 0.5));
border-bottom: 1px solid rgb(200,200,200);
@include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1));
overflow: hidden;
width: 100%;
.container {
}
.intro-inner-wrapper {
@include clearfix;
margin: 0 auto;
max-width: 1200px;
padding: 50px 0px 40px;
position: relative;
width: flex-grid(12);
.course-info {
h1, h2, h3, h4, h5, h6 {
font-family: $sans-serif;
font-weight: bold;
}
font-size: 16px;
> * {
@include box-sizing(border-box);
margin-top: 20px;
}
a {
font-family: $serif;
font-size: 16px;
}
section {
}
h2 {
font-size: 2em;
}
h3 {
font-size: 1.4em;
}
p {
// color: rgb(102,102,102);
}
header {
background: rgb(240,240,240);
border: 1px solid rgb(200,200,200);
@include border-radius(4px);
@include box-shadow(inset 0 0 1px 1px rgb(255,255,255));
padding: 20px;
padding-left: flex-grid(1) + flex-gutter() * 2;
padding-right: flex-grid(4) + flex-gutter();
position: relative;
width: flex-grid(12);
> img {
float: left;
max-height: 86px;
max-width: flex-grid(1) + flex-gutter();
@include position(absolute, 10px 0 0 10px);
vertical-align: middle;
}
h2 {
margin-bottom: .5em;
.course-number {
color: $lighter-base-font-color;
&::before {
@include background-image(radial-gradient(50% 50%, ellipse closest-side, rgba(#fff, 1), rgba(#fff, 0)));
content: "";
display: block;
height: 200%;
left: 0px;
position: absolute;
top: 80px;
width: flex-grid(8);
z-index: 1;
}
}
h3 {
}
.course-abstract {
display: none;
}
.button {
@include button(simple, $blue);
@include box-sizing(border-box);
@include border-bottom-left-radius(0px);
@include border-top-left-radius(0px);
display: block;
font-size: 1.6em;
left: flex-grid(8) + flex-gutter();
padding-top: 1.5em;
@include position(absolute, -1px -1px -1px 0);
text-align: center;
vertical-align: middle;
}
} // header
.sidebar {
background: white;
float: right;
margin: 93px 0 0 flex-gutter();
padding: 0 0 20px flex-gutter();
padding-bottom: 20px;
position: relative;
width: flex-grid(4);
.faded-vertical-divider {
@include background-image(linear-gradient(90deg, rgba(255,255,255, 0) 0%, rgba(200,200,200, 0.6) 10%, rgb(200,200,200) 50%, rgba(200,200,200, 0.6) 90%, rgba(255,255,255, 0)));
@include position(absolute, 0px 0 0px 0px);
}
h3 {
color: #999;
font-size: 1em;
margin-bottom: .5em;
}
.course-staff {
clear: none;
position: relative;
.teacher {
margin-bottom: 1em;
.teacher-image {
// display: none;
float: left;
margin: 0 10px 5px 0;
img {
.intro {
@include clearfix;
float: left;
margin-right: flex-gutter();
position: relative;
width: flex-grid(8);
z-index: 2;
> hgroup {
position: relative;
hr {
@include background-image(linear-gradient(180deg, rgba(200,200,200, 0) 0%,
rgba(200,200,200, 1) 50%,
rgba(200,200,200, 1)));
border: none;
height: 1px;
margin: 10px 0;
position: relative;
&::after {
@include background-image(linear-gradient(180deg, rgba(255,255,255, 0) 0%,
rgba(255,255,255, 0.6) 50%,
rgba(255,255,255, 0.6)));
bottom: -1px;
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%;
}
}
h1 {
font: bold 2.8rem/3.2rem $sans-serif;
@include inline-block;
margin-right: 5px;
text-shadow: 0 1px rgba(255,255,255, 0.6);
span {
color: $lighter-base-font-color;
display: none;
font: 300 1.2rem/3rem $sans-serif;
}
}
h2 {
@include inline-block;
a {
color: $lighter-base-font-color;
font: italic bold 1.4rem/1.6rem $sans-serif;
text-shadow: 0 1px rgba(255,255,255, 0.6);
&:hover {
color: $blue;
}
}
}
}
.teacher-name {
color: rgb(100,100,100);
font-size: 1.5em;
font-weight: bold;
line-height: 1.3em;
.course-dates {
p {
color: $lighter-base-font-color;
@include inline-block;
font: 300 1.2rem/1.6rem $sans-serif;
margin-top: 0px;
margin-right: 20px;
text-transform: uppercase;
&:last-child {
margin: 0;
}
> span {
color: $base-font-color;
font: 300 1.2rem/1.6rem $sans-serif;
margin-left: 5px;
}
}
}
}
} // .course-staff
}
.main-content-wrap {
float: right;
margin-top: 40px;
padding-bottom: 20px;
width: flex-grid(8);
.video {
iframe {
border: 10px solid rgb(106,106,106);
@include border-radius(10px);
display: block;
margin: 0 auto 20px;
.actions {
float: left;
position: relative;
width: flex-grid(4);
z-index: 2;
&:hover {
.register-wrapper {
@include box-shadow(0 1px 16px 0 rgba($blue, 0.35));
border-color: rgb(180,180,180);
}
}
.register-wrapper {
@include background-image(linear-gradient(-90deg, rgb(245,245,245) 0%, rgb(243,243,243) 50%, rgb(237,237,237) 50%, rgb(235,235,235) 100%));
@include box-sizing(border-box);
@include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1), inset 0 0 0 1px rgba(255,255,255, 0.9));
border: 1px solid rgb(210,210,210);
@include border-radius(4px);
@include transition(all, 0.15s, linear);
padding: 10px;
a.register {
@include button(shiny, $blue);
@include box-sizing(border-box);
@include border-radius(3px);
display: block;
font: italic 1.2rem/1.6rem $serif;
padding: 10px 0px;
position: relative;
text-transform: uppercase;
text-align: center;
width: flex-grid(12);
z-index: 1;
}
}
.social-sharing {
padding: 0px 20px;
p {
background: rgb(245,245,245);
@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.075), inset 0 0 0 1px rgba(255,255,255, 0.9));
border: 1px solid rgb(210,210,210);
border-top: 0;
@include border-bottom-radius(4px);
padding: 5px 10px;
margin: 0 auto;
color: $lighter-base-font-color;
font: italic 300 1.2rem/1.6rem $serif;
margin: 0 0 5px 0;
text-align: center;
text-shadow: 0 1px rgba(255,255,255, 0.6);
&:last-child {
margin: 0;
}
> span {
font: normal 1.2rem/1.6rem $sans-serif;
margin-right: 5px;
}
}
}
}
}
.course-description {
}
.container {
@include clearfix;
nav {
border-bottom: 1px solid rgb(220,220,220);
@include box-sizing(border-box);
margin-bottom: 40px;
position: relative;
h3 {
font-size: 2em;
font-weight: bold;
margin-bottom: 1em;
@include clearfix;
margin: 40px 0;
width: flex-grid(12);
&::after {
@extend .faded-hr-divider;
content: "";
display: none;
}
.course-times {
background: #F0F0F0;
@include border-radius(4px);
color: #7A7A7A;
font-size: .8em;
padding: .3em 1em;
@include position(absolute, 0px 0px 0 0);
text-shadow: -1px -1px 0px #e9e9e9;
.start, .length, .final {
float: left;
margin-right: 1em;
strong {
display: block;
}
a {
border-bottom: 3px solid transparent;
color: $lighter-base-font-color;
@include inline-block;
font: normal 1.2rem/1.6rem $sans-serif;
margin: 0 15px;
padding: 0px 5px 15px;
text-align: center;
text-transform: uppercase;
&:first-child {
margin-left: 0px;
}
.start {
&:hover, &.active {
border-color: $pink;
//background: rgb(240,240,240);
color: $base-font-color;
}
.length {
}
}
h2 {
color: $lighter-base-font-color;
margin-bottom: 20px;
text-transform: uppercase;
}
h3 {
color: $base-font-color;
font-weight: 300;
font-family: $sans-serif;
margin-bottom: 10px;
}
}
.details {
float: left;
margin-right: flex-gutter();
width: flex-grid(8);
.inner-wrapper {
> section {
&::after {
@extend .faded-hr-divider;
content: "";
display: none;
margin-top: 60px;
}
.final {
margin: 0;
margin-bottom: 60px;
p + h2 {
margin-top: 40px;
}
} // .course-times
}
}
ul.tabs {
list-style-type: none;
font-size: 0;
padding: 0;
margin-top: 40px;
li {
background: #eee;
@include border-radius(2px);
display: inline-block;
color: #444;
font-size: 16px;
font-weight: bold;
margin-right: 10px;
padding: .3em 1em;
&.enabled {
color: #fff;
@include linear-gradient($blue, darken($blue, 5%));
.course-staff {
.teacher {
margin-bottom: 30px;
&::after {
@extend .faded-hr-divider;
content: "";
display: block;
margin-top: 30px;
}
&:hover {
cursor: pointer;
background: #ddd;
&.enabled {
@include linear-gradient(darken($blue, 5%), darken($blue, 10%));
color: #fff;
&:last-child {
&::after {
display: none;
}
}
}
}
.tabs-content {
section.tab {
display: none;
margin-top: 0;
padding-top: 30px;
h3 {
margin-bottom: .5em;
font-size: 1.5em;
font-weight: bold;
.teacher-image {
background: rgb(255,255,255);
border: 1px solid rgb(200,200,200);
float: left;
margin: 0 15px 15px 0;
padding: 1px;
}
}
section {
margin-top: 30px;
color: #666;
}
}
.syllabus {
ul {
list-style: none outside;
line-height: 1.5em;
li {
}
.course-sidebar {
@include box-sizing(border-box);
float: left;
padding-top: 40px;
width: flex-grid(4);
h3 {
color: $lighter-base-font-color;
font-family: $serif;
font-weight: 300;
margin-bottom: 15px;
text-transform: uppercase;
}
> section {
border: 1px solid rgb(220,220,220);
@include border-radius(4px);
background: rgb(245,245,245);
margin-bottom: 20px;
padding: 15px;
}
.media {
border: 1px solid rgb(200,200,200);
@include box-sizing(border-box);
margin-bottom: 20px;
padding: 1px;
width: flex-grid(12);
.hero {
height: 180px;
overflow: hidden;
position: relative;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.6), rgba(255,255,255, 0.4)));
@include border-radius(4px);
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.3);
height: 80px;
left: 50%;
margin-top: -40px;
margin-left: -40px;
position: absolute;
top: 50%;
width: 80px;
&::after {
color: $base-font-color;
content: "\25B6";
display: block;
font: normal 3.2rem/3.2rem $sans-serif;
left: 50%;
margin-left: -12px;
margin-top: -17px;
position: absolute;
text-shadow: 0 1px rgba(255,255,255, 0.8);
top: 50%;
}
}
img {
min-width: 100%;
}
}
} //.syllabus
.faq {
ul {
list-style: none outside;
li {
margin-bottom: 1em;
p {
margin-left: 2em;
&:hover {
cursor: pointer;
.play-intro {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 0.7), rgba(255,255,255, 0.5)));
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.2));
border: 1px solid rgba(0,0,0, 0.4);
&::after {
color: $pink;
}
}
}
} // .faq
.more-info {
p {
margin-left: 2em;
}
}
} //.main-info-wrap
}
\ No newline at end of file
}
}
......@@ -57,16 +57,6 @@
text-overflow: ellipsis;
white-space: nowrap;
}
p {
color: $base-font-color;
display: none;
font: normal 1rem/1.6rem $sans-serif;
overflow: hidden;
text-shadow: 0 1px rgba(255,255,255, 0.6);
text-overflow: ellipsis;
white-space: nowrap;
}
}
.info-link {
......
......@@ -34,6 +34,21 @@
display: block;
}
&.video-modal {
//height: 360px;
left: 50%;
margin-left: -320px;
//margin-top: -180px;
//top: 50%;
width: 642px;
.inner-wrapper {
height: 360px;
padding: 0px;
width: 640px;
}
}
.inner-wrapper {
background: rgb(240,240,240);
@include border-radius(0px);
......
......@@ -362,7 +362,7 @@ a:link, a:visited {
.container:after {
clear: both; }
.faded-hr-divider, .horizontal-divider, .modal .inner-wrapper header hr::after, .modal .inner-wrapper form .honor-code-summary hr::after {
.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 .details .inner-wrapper > section::after, .course-info .details .course-staff .teacher::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));
......@@ -1785,14 +1785,6 @@ header.app {
text-shadow: 0 1px rgba(255, 255, 255, 0.6);
text-overflow: ellipsis;
white-space: nowrap; }
.highlighted-courses .courses .course header.course-preview > a hgroup p, .find-courses .courses .course header.course-preview > a hgroup p {
color: #3c3c3c;
display: none;
font: normal 1rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
overflow: hidden;
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;
......@@ -2086,6 +2078,14 @@ header.app {
z-index: 10; }
.modal.visible {
display: block; }
.modal.video-modal {
left: 50%;
margin-left: -320px;
width: 642px; }
.modal.video-modal .inner-wrapper {
height: 360px;
padding: 0px;
width: 640px; }
.modal .inner-wrapper {
background: #f0f0f0;
-webkit-border-radius: 0px;
......@@ -3394,276 +3394,428 @@ nav.course-material {
text-align: center;
z-index: 2; }
.grid-container {
display: none; }
.grid-container > * {
float: left;
height: 20px; }
.grid-container .grid {
background: #FFD3DC;
margin-right: 2.024%;
width: 6.478%; }
.grid-container .grid:last-child {
margin-right: 0px; }
.grid-container .gutter {
background: #E3FFDA;
display: none;
width: 25px; }
.course-info {
font-size: 16px; }
.course-info h1, .course-info h2, .course-info h3, .course-info h4, .course-info h5, .course-info h6 {
font-family: "Open Sans", Verdana, Geneva, sans-serif;
font-weight: bold; }
.course-info > * {
.course-info .container {
margin-bottom: 60px; }
.course-info header.course-profile {
background: #f5f5f5;
-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 #c8c8c8;
-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);
overflow: hidden;
width: 100%; }
.course-info header.course-profile .intro-inner-wrapper {
zoom: 1;
margin: 0 auto;
max-width: 1200px;
padding: 50px 0px 40px;
position: relative;
width: 100%; }
.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::before {
background-image: -webkit-radial-gradient(50% 50%, ellipse closest-side, white, rgba(255, 255, 255, 0));
background-image: -moz-radial-gradient(50% 50%, ellipse closest-side, white, rgba(255, 255, 255, 0));
background-image: -ms-radial-gradient(50% 50%, ellipse closest-side, white, rgba(255, 255, 255, 0));
background-image: -o-radial-gradient(50% 50%, ellipse closest-side, white, rgba(255, 255, 255, 0));
background-image: radial-gradient(50% 50%, ellipse closest-side, white, rgba(255, 255, 255, 0));
content: "";
display: block;
height: 200%;
left: 0px;
position: absolute;
top: 80px;
width: 65.992%;
z-index: 1; }
.course-info header.course-profile .intro-inner-wrapper .intro {
zoom: 1;
float: left;
margin-right: 2.024%;
position: relative;
width: 65.992%;
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 {
position: relative; }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup hr {
background-image: -webkit-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, #c8c8c8);
background-image: -moz-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, #c8c8c8);
background-image: -ms-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, #c8c8c8);
background-image: -o-linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, #c8c8c8);
background-image: linear-gradient(180deg, rgba(200, 200, 200, 0) 0%, #c8c8c8 50%, #c8c8c8);
border: none;
height: 1px;
margin: 10px 0;
position: relative; }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup hr::after {
background-image: -webkit-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.6));
background-image: -moz-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.6));
background-image: -ms-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.6));
background-image: -o-linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.6));
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 50%, rgba(255, 255, 255, 0.6));
bottom: -1px;
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%; }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup h1 {
font: bold 2.8rem/3.2rem "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-right: 5px;
text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup h1 span {
color: #a0a0a0;
display: none;
font: 300 1.2rem/3rem "Open Sans", Verdana, Geneva, sans-serif; }
.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; }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup h2 a {
color: #a0a0a0;
font: italic bold 1.4rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
.course-info header.course-profile .intro-inner-wrapper .intro > hgroup h2 a:hover {
color: #1d9dd9; }
.course-info header.course-profile .intro-inner-wrapper .intro .course-dates p {
color: #a0a0a0;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
font: 300 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
margin-top: 0px;
margin-right: 20px;
text-transform: uppercase; }
.course-info header.course-profile .intro-inner-wrapper .intro .course-dates p:last-child {
margin: 0; }
.course-info header.course-profile .intro-inner-wrapper .intro .course-dates p > span {
color: #3c3c3c;
font: 300 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
margin-left: 5px; }
.course-info header.course-profile .intro-inner-wrapper .actions {
float: left;
position: relative;
width: 31.984%;
z-index: 2; }
.course-info header.course-profile .intro-inner-wrapper .actions:hover .register-wrapper {
-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);
border-color: #b4b4b4; }
.course-info header.course-profile .intro-inner-wrapper .actions .register-wrapper {
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%);
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
border: 1px solid #d2d2d2;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 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;
padding: 10px; }
.course-info header.course-profile .intro-inner-wrapper .actions .register-wrapper 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: italic 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
padding: 10px 0px;
position: relative;
text-transform: uppercase;
text-align: center;
width: 100%;
z-index: 1; }
.course-info header.course-profile .intro-inner-wrapper .actions .register-wrapper 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 .actions .register-wrapper 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 .actions .social-sharing {
padding: 0px 20px; }
.course-info header.course-profile .intro-inner-wrapper .actions .social-sharing p {
background: #f5f5f5;
-webkit-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.075), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
-moz-box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.075), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.075), inset 0 0 0 1px rgba(255, 255, 255, 0.9);
border: 1px solid #d2d2d2;
border-top: 0;
-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;
padding: 5px 10px;
margin: 0 auto;
color: #a0a0a0;
font: italic 300 1.2rem/1.6rem Georgia, Cambria, "Times New Roman", Times, serif;
margin: 0 0 5px 0;
text-align: center;
text-shadow: 0 1px rgba(255, 255, 255, 0.6); }
.course-info header.course-profile .intro-inner-wrapper .actions .social-sharing p:last-child {
margin: 0; }
.course-info header.course-profile .intro-inner-wrapper .actions .social-sharing p > span {
font: normal 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
margin-right: 5px; }
.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;
margin-top: 20px; }
.course-info a {
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;
font: normal 1.2rem/1.6rem "Open Sans", Verdana, Geneva, sans-serif;
margin: 0 15px;
padding: 0px 5px 15px;
text-align: center;
text-transform: uppercase; }
.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: #b62568;
color: #3c3c3c; }
.course-info .container h2 {
color: #a0a0a0;
margin-bottom: 20px;
text-transform: uppercase; }
.course-info .container h3 {
color: #3c3c3c;
font-weight: 300;
font-family: "Open Sans", Verdana, Geneva, sans-serif;
margin-bottom: 10px; }
.course-info .details {
float: left;
margin-right: 2.024%;
width: 65.992%; }
.course-info .details .inner-wrapper > section {
margin-bottom: 60px; }
.course-info .details .inner-wrapper > section::after {
content: "";
display: none;
margin-top: 60px; }
.course-info .details .inner-wrapper > section p + h2 {
margin-top: 40px; }
.course-info .details .course-staff .teacher {
margin-bottom: 30px; }
.course-info .details .course-staff .teacher::after {
content: "";
display: block;
margin-top: 30px; }
.course-info .details .course-staff .teacher:last-child::after {
display: none; }
.course-info .details .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;
float: left;
padding-top: 40px;
width: 31.984%; }
.course-info .course-sidebar h3 {
color: #a0a0a0;
font-family: Georgia, Cambria, "Times New Roman", Times, serif;
font-size: 16px; }
.course-info h2 {
font-size: 2em; }
.course-info h3 {
font-size: 1.4em; }
.course-info header {
background: #f0f0f0;
border: 1px solid #c8c8c8;
font-weight: 300;
margin-bottom: 15px;
text-transform: uppercase; }
.course-info .course-sidebar > section {
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: inset 0 0 1px 1px white;
-moz-box-shadow: inset 0 0 1px 1px white;
box-shadow: inset 0 0 1px 1px white;
padding: 20px;
padding-left: 10.526%;
padding-right: 34.008%;
position: relative;
background: #f5f5f5;
margin-bottom: 20px;
padding: 15px; }
.course-info .course-sidebar .media {
border: 1px solid #c8c8c8;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 20px;
padding: 1px;
width: 100%; }
.course-info header > img {
float: left;
max-height: 86px;
max-width: 8.502%;
position: absolute;
top: 10px;
left: 10px;
vertical-align: middle; }
.course-info header h2 {
margin-bottom: .5em; }
.course-info header h2 .course-number {
color: #a0a0a0; }
.course-info header .course-abstract {
display: none; }
.course-info header .button {
border: 1px solid #0d72a2;
-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 #61b8e1;
-moz-box-shadow: inset 0 1px 0 0 #61b8e1;
box-shadow: inset 0 1px 0 0 #61b8e1;
color: white;
display: inline;
font-size: 11px;
font-weight: bold;
background-color: #1d9dd9;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d9dd9), color-stop(100%, #0e7cb0));
background-image: -webkit-linear-gradient(top, #1d9dd9, #0e7cb0);
background-image: -moz-linear-gradient(top, #1d9dd9, #0e7cb0);
background-image: -ms-linear-gradient(top, #1d9dd9, #0e7cb0);
background-image: -o-linear-gradient(top, #1d9dd9, #0e7cb0);
background-image: linear-gradient(top, #1d9dd9, #0e7cb0);
padding: 6px 18px 7px;
text-shadow: 0 1px 0 #076794;
-webkit-background-clip: padding-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-border-bottom-left-radius: 0px;
-moz-border-bottom-left-radius: 0px;
-moz-border-radius-bottomleft: 0px;
-ms-border-bottom-left-radius: 0px;
-o-border-bottom-left-radius: 0px;
border-bottom-left-radius: 0px;
-webkit-border-top-left-radius: 0px;
-moz-border-top-left-radius: 0px;
-moz-border-radius-topleft: 0px;
-ms-border-top-left-radius: 0px;
-o-border-top-left-radius: 0px;
border-top-left-radius: 0px;
display: block;
font-size: 1.6em;
left: 68.016%;
padding-top: 1.5em;
position: absolute;
top: -1px;
right: -1px;
bottom: -1px;
text-align: center;
vertical-align: middle; }
.course-info header .button:hover {
-webkit-box-shadow: inset 0 1px 0 0 #35a6db;
-moz-box-shadow: inset 0 1px 0 0 #35a6db;
box-shadow: inset 0 1px 0 0 #35a6db;
cursor: pointer;
background-color: #1e8bbe;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1e8bbe), color-stop(100%, #0e72a1));
background-image: -webkit-linear-gradient(top, #1e8bbe, #0e72a1);
background-image: -moz-linear-gradient(top, #1e8bbe, #0e72a1);
background-image: -ms-linear-gradient(top, #1e8bbe, #0e72a1);
background-image: -o-linear-gradient(top, #1e8bbe, #0e72a1);
background-image: linear-gradient(top, #1e8bbe, #0e72a1); }
.course-info header .button:active {
border: 1px solid #0d72a2;
-webkit-box-shadow: inset 0 0 8px 4px #0d6892, inset 0 0 8px 4px #0d6892, 0 1px 1px 0 #eeeeee;
-moz-box-shadow: inset 0 0 8px 4px #0d6892, inset 0 0 8px 4px #0d6892, 0 1px 1px 0 #eeeeee;
box-shadow: inset 0 0 8px 4px #0d6892, inset 0 0 8px 4px #0d6892, 0 1px 1px 0 #eeeeee; }
.course-info .sidebar, .course-info section.course-index {
background: white;
float: right;
margin: 93px 0 0 2.024%;
padding: 0 0 20px 2.024%;
padding-bottom: 20px;
position: relative;
width: 31.984%; }
.course-info .sidebar .faded-vertical-divider, .course-info section.course-index .faded-vertical-divider, .course-info .sidebar .vertical-divider, .course-info section.course-index .vertical-divider, .course-info .sidebar header.app .divider, header.app .course-info .sidebar .divider, .course-info section.course-index header.app .divider, header.app .course-info section.course-index .divider, .course-info .sidebar footer nav .copyright a.logo::after, footer nav .copyright .course-info .sidebar a.logo::after, .course-info section.course-index footer nav .copyright a.logo::after, footer nav .copyright .course-info section.course-index a.logo::after, .course-info .sidebar footer nav ol li::after, footer nav ol .course-info .sidebar li::after, .course-info section.course-index footer nav ol li::after, footer nav ol .course-info section.course-index li::after, .course-info .sidebar .home .university-partners .partners li.partner::before, .home .university-partners .partners .course-info .sidebar li.partner::before, .course-info section.course-index .home .university-partners .partners li.partner::before, .home .university-partners .partners .course-info section.course-index li.partner::before {
background-image: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(200, 200, 200, 0.6) 10%, #c8c8c8 50%, rgba(200, 200, 200, 0.6) 90%, rgba(255, 255, 255, 0));
background-image: -moz-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(200, 200, 200, 0.6) 10%, #c8c8c8 50%, rgba(200, 200, 200, 0.6) 90%, rgba(255, 255, 255, 0));
background-image: -ms-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(200, 200, 200, 0.6) 10%, #c8c8c8 50%, rgba(200, 200, 200, 0.6) 90%, rgba(255, 255, 255, 0));
background-image: -o-linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(200, 200, 200, 0.6) 10%, #c8c8c8 50%, rgba(200, 200, 200, 0.6) 90%, rgba(255, 255, 255, 0));
background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(200, 200, 200, 0.6) 10%, #c8c8c8 50%, rgba(200, 200, 200, 0.6) 90%, rgba(255, 255, 255, 0));
position: absolute;
top: 0px;
bottom: 0px;
left: 0px; }
.course-info .sidebar h3, .course-info section.course-index h3 {
color: #999;
font-size: 1em;
margin-bottom: .5em; }
.course-info .sidebar .course-staff, .course-info section.course-index .course-staff {
clear: none;
position: relative; }
.course-info .sidebar .course-staff .teacher, .course-info section.course-index .course-staff .teacher {
margin-bottom: 1em; }
.course-info .sidebar .course-staff .teacher .teacher-image, .course-info section.course-index .course-staff .teacher .teacher-image {
float: left;
margin: 0 10px 5px 0; }
.course-info .sidebar .course-staff .teacher .teacher-name, .course-info section.course-index .course-staff .teacher .teacher-name {
color: #646464;
font-size: 1.5em;
font-weight: bold;
line-height: 1.3em; }
.course-info .main-content-wrap {
float: right;
margin-top: 40px;
padding-bottom: 20px;
width: 65.992%; }
.course-info .main-content-wrap .video iframe {
border: 10px solid #6a6a6a;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
display: block;
margin: 0 auto 20px; }
.course-info .main-content-wrap .course-description {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 40px;
.course-info .course-sidebar .media .hero {
height: 180px;
overflow: hidden;
position: relative; }
.course-info .main-content-wrap .course-description h3 {
font-size: 2em;
font-weight: bold;
margin-bottom: 1em; }
.course-info .main-content-wrap .course-description .course-times {
background: #F0F0F0;
.course-info .course-sidebar .media .hero .play-intro {
background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.4));
background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.4));
background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.4));
background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.4));
background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.4));
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
color: #7A7A7A;
font-size: .8em;
padding: .3em 1em;
-webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.3);
height: 80px;
left: 50%;
margin-top: -40px;
margin-left: -40px;
position: absolute;
top: 0px;
right: 0px;
text-shadow: -1px -1px 0px #e9e9e9; }
.course-info .main-content-wrap .course-description .course-times .start, .course-info .main-content-wrap .course-description .course-times .length, .course-info .main-content-wrap .course-description .course-times .final {
float: left;
margin-right: 1em; }
.course-info .main-content-wrap .course-description .course-times .start strong, .course-info .main-content-wrap .course-description .course-times .length strong, .course-info .main-content-wrap .course-description .course-times .final strong {
display: block; }
.course-info .main-content-wrap .course-description .course-times .final {
margin: 0; }
.course-info .main-content-wrap ul.tabs {
list-style-type: none;
font-size: 0;
padding: 0;
margin-top: 40px; }
.course-info .main-content-wrap ul.tabs li {
background: #eee;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
-ms-border-radius: 2px;
-o-border-radius: 2px;
border-radius: 2px;
display: inline-block;
color: #444;
font-size: 16px;
font-weight: bold;
margin-right: 10px;
padding: .3em 1em; }
.course-info .main-content-wrap ul.tabs li.enabled {
color: #fff;
background-color: #1d9dd9;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1d9dd9), color-stop(100%, #1a8dc3));
background-image: -webkit-linear-gradient(top, #1d9dd9, #1a8dc3);
background-image: -moz-linear-gradient(top, #1d9dd9, #1a8dc3);
background-image: -ms-linear-gradient(top, #1d9dd9, #1a8dc3);
background-image: -o-linear-gradient(top, #1d9dd9, #1a8dc3);
background-image: linear-gradient(top, #1d9dd9, #1a8dc3); }
.course-info .main-content-wrap ul.tabs li:hover {
cursor: pointer;
background: #ddd; }
.course-info .main-content-wrap ul.tabs li:hover.enabled {
background-color: #1a8dc3;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1a8dc3), color-stop(100%, #177cac));
background-image: -webkit-linear-gradient(top, #1a8dc3, #177cac);
background-image: -moz-linear-gradient(top, #1a8dc3, #177cac);
background-image: -ms-linear-gradient(top, #1a8dc3, #177cac);
background-image: -o-linear-gradient(top, #1a8dc3, #177cac);
background-image: linear-gradient(top, #1a8dc3, #177cac);
color: #fff; }
.course-info .main-content-wrap .tabs-content section.tab {
display: none;
margin-top: 0;
padding-top: 30px; }
.course-info .main-content-wrap .tabs-content section.tab h3 {
margin-bottom: .5em;
font-size: 1.5em;
font-weight: bold; }
.course-info .main-content-wrap .tabs-content section {
margin-top: 30px;
color: #666; }
.course-info .main-content-wrap .syllabus ul {
list-style: none outside;
line-height: 1.5em; }
.course-info .main-content-wrap .faq ul {
list-style: none outside; }
.course-info .main-content-wrap .faq ul li {
margin-bottom: 1em; }
.course-info .main-content-wrap .faq ul li p {
margin-left: 2em; }
.course-info .main-content-wrap .more-info p {
margin-left: 2em; }
top: 50%;
width: 80px; }
.course-info .course-sidebar .media .hero .play-intro::after {
color: #3c3c3c;
content: "\25B6";
display: block;
font: normal 3.2rem/3.2rem "Open Sans", Verdana, Geneva, sans-serif;
left: 50%;
margin-left: -12px;
margin-top: -17px;
position: absolute;
text-shadow: 0 1px rgba(255, 255, 255, 0.8);
top: 50%; }
.course-info .course-sidebar .media .hero img {
min-width: 100%; }
.course-info .course-sidebar .media:hover {
cursor: pointer; }
.course-info .course-sidebar .media:hover .play-intro {
background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.5));
background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.5));
background-image: -ms-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.5));
background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.5));
background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.5));
-webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.2);
border: 1px solid rgba(0, 0, 0, 0.4); }
.course-info .course-sidebar .media:hover .play-intro::after {
color: #b62568; }
html {
height: 100%;
......
<%inherit file="main.html" />
<%include file="guest_navigation.html" args="active_page='info'" />
<<<<<<< HEAD
<%namespace name='static' file='static_content.html'/>
<section class="container">
<section class="course-info">
......@@ -112,6 +113,85 @@
<section class="faq tab">
<h3>Frequently Asked Questions</h3>
=======
<section class="course-info">
<header class="course-profile">
<div class="intro-inner-wrapper">
<section class="intro">
<hgroup>
<h1>18th Century History <span class="course-number">(HC137)</span></h1>
<hr>
<h2><a href="#">HarvardX</a></h2>
</hgroup>
</section>
<section class="actions">
<a href="#" class="register">Register</a>
<section class="social-sharing">
</section>
</section>
</div>
</header>
<section class="container">
<section class="details">
<nav>
<a href="#" class="active">Overview</a>
<a href="#">FAQ</a>
<a href="#">Requirements</a>
<a href="#">Text-book</a>
<a href="#">Syllabus</a>
<a href="#">Reviews</a>
</nav>
<div class="inner-wrapper">
<section class="about">
<h2>About this course</h2>
<p>This course explores the history of the modern world since Chinggis Khan. It focuses on the connections between societies from the time of the Mongol conquests and the gradual, but accelerating ways in which connections became ties of inter-dependence. The relations between societies are what will concern us. The forces pulling the world together vary from religious to economic, political to intellectual. These forces bring the world together, but they also create new divisions. Nowadays, we call this "globalization." That term has tended to emphasize the drive to worldwide integration; the view of globalization taken in this course emphasizes disintegration as well as integration. We will tackle some very basic questions: How do we explain the staggering wealth of China in the centuries up to 1750, as well as China's recent ascent? Where did the United States come from, and where is it headed? What are the significance and legacies of empire in the world? How have world wars and revolutions shaped the international system over time? What exactly is globalization, and how does today's globalization compare with the past? How has the relationship between humans and nature changed over the centuries?</p>
<h2>Requirements</h2>
<p>In order to succeed in this course, you must have taken an AP level physics course in electricity and magnetism. You must know basic calculus and linear algebra and have some background in differential equations. Since more advanced mathematics will not show up until the second half of the course, the first half of the course will include an optional remedial differential equations component for those who need it.</p>
<p>The course web site was developed and tested primarily with Google Chrome. We support current versions of Mozilla Firefox as well. The video player is designed to work with Flash. While we provide a partial non-Flash fallback for the video, as well as partial support for Internet Explorer, other browsers, and tablets, portions of the functionality will be unavailable.</p>
</section>
<section class="course-staff">
<h2>Course staff</h3>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/anant.jpg')}" />
</div>
<h3>Anant Agarwal</h3>
<p>Director of MIT’s Computer Science and Artificial Intelligence Laboratory (CSAIL) and a professor of the Electrical Engineering and Computer Science department at MIT. His research focus is in parallel computer architectures and cloud software systems, and he is a founder of several successful startups, including Tilera, a company that produces scalable multicore processors. Prof. Agarwal won MIT’s Smullin and Jamieson prizes for teaching and co-authored the course textbook “Foundations of Analog and Digital Electronic Circuits.”</p>
</article>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/gerald.jpg')}" />
</div>
<h3>Gerald Sussman</h3>
<p>Professor of Electrical Engineering at MIT. He is a well known educator in the computer science community, perhaps best known as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textbooks in computer science, and as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p>
</article>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/piotr.jpg')}" />
</div>
<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="syllabus">
<h2>Syllabus</h2>
</section>
<section class="textbook">
<h2>Textbook</h2>
<p>The course uses the textbook Foundations of Analog and Digital Electronic Circuits, by Anant Agarwal and Jeffrey H. Lang. Morgan Kaufmann Publishers, Elsevier, July 2005. While recommended, the book is not required: relevant sections will be provided electronically as part of the online course for personal use in connection with this course only. The copyright for the book is owned by Elsevier. The book can be purchased on <a href="http://www.amazon.com/exec/obidos/ASIN/1558607358/ref=nosim/mitopencourse-20">Amazon</a>.</p>
</section>
<section class="faq">
<h2>Frequently Asked Questions</h2>
>>>>>>> cleans up course info/profile page
<ul>
<li>What is the format of the class?
<p>The course will consist of 24 lectures, each lasting 50 minutes. There will be regular assignments consisting of map tests and short essays.</p>
......@@ -127,6 +207,7 @@
</li>
</ul>
</section>
<<<<<<< HEAD
<section class="more-info tab">
<section class="who-should-take">
......@@ -224,5 +305,33 @@
<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></li>
</ul>
=======
</section>
</div>
<section class="course-sidebar">
<div class="media">
<div class="hero">
<img src="${static.url('images/history.png')}" />
</div>
</div>
<section class="dates">
<h3>Important Dates</h3>
<p>Class Starts: <span class="start-date">7/12/12</span></p>
<p>Final Exam: <span class="start-date">12/09/12</span></p>
<p>Total Length: <span class="course-length">15 weeks</span></p>
</section>
<section class="course-abstract">
<h3>Course Sumamry</h3>
<p>This course will examine the ways in which the world has grown more integrated yet more divided over the past 300 years.</p>
</section>
<section class="dates">
<p>Course Number <span class="start-date">HC137</span></p>
</section>
</section>
>>>>>>> cleans up course info/profile page
</section>
</section>
......@@ -4,20 +4,19 @@
%>
%for course in courses:
<article class="course">
<article id="${course.id}"class="course">
<div class="inner-wrapper">
<header class="course-preview">
<a href="${reverse('about_course', args=[course.id])}">
<hgroup>
<h2>${course.title}</h2>
<p>${course.institution}</p>
</hgroup>
<div href="" class="info-link">&#x2794;</div>
<div class="info-link">&#x2794;</div>
</a>
</header>
<section class="info">
<div class="meta-info">
<p class="university">HarvardX</p>
<p class="university">${course.institution}</p>
<p class="dates"><span class="start">7/23/12</span> &rarr; <span class="end">12/15/12</span></p>
</div>
<div class="cover-image">
......
......@@ -67,7 +67,9 @@
<%include file="footer.html" />
<%block name="js_extra"/>
<script src="${static.url('js/my_courses_dropdown.js')}"></script>
<script src="${static.url('js/sticky_footer.js')}"></script>
<!--
-<script src="${static.url('js/sticky_footer.js')}"></script>
-->
<script src="${static.url('js/toggle_login_modal.js')}"></script>
<script src="${static.url('js/sticky_filter.js')}"></script>
......
......@@ -6,107 +6,109 @@
<%inherit file="../main.html" />
<section class="container">
<section class="course-info">
<header>
<img src="${static.url('images/harvard_cropped.png')}" />
<h2>${course.get_about_section("title")} <span class="course-number">(${course.get_about_section("number")})</span></h3>
<h3>${course.get_about_section("university")}</h3>
<div class="course-abstract">
<p>${course.get_about_section("short_description")}</p>
</div>
<a class="button sign-up" href="${reverse('enroll', args=[course.id])}">Sign up</a>
</header>
<section class="sidebar">
<div class="faded-vertical-divider"></div>
<section class="course-staff">
<h3>About the course staff</h3>
<div class="teacher">
<div class="teacher-image">
<img src="${static.url('images/anant.jpg')}" />
</div>
<h3 class="teacher-name">Anant Agarwal</h3>
<p>Director of MIT’s Computer Science and Artificial Intelligence Laboratory (CSAIL) and a professor of the Electrical Engineering and Computer Science department at MIT. His research focus is in parallel computer architectures and cloud software systems, and he is a founder of several successful startups, including Tilera, a company that produces scalable multicore processors. Prof. Agarwal won MIT’s Smullin and Jamieson prizes for teaching and co-authored the course textbook “Foundations of Analog and Digital Electronic Circuits.”</p>
</div> <!-- .teacher -->
<div class="teacher">
<div class="teacher-image">
<img src="${static.url('images/gerald.jpg')}" />
</div>
<h3 class="teacher-name">Gerald Sussman</h3>
<p>Professor of Electrical Engineering at MIT. He is a well known educator in the computer science community, perhaps best known as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textbooks in computer science, and as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p>
</div> <!-- .teacher -->
<div class="teacher">
<div class="teacher-image">
<img src="${static.url('images/piotr.jpg')}" />
</div>
<h3 class="teacher-name">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>
</div> <!-- .teacher -->
<section class="course-info">
<header class="course-profile">
<div class="intro-inner-wrapper">
<section class="intro">
<hgroup>
<h1>${course.get_about_section("title")} <h2><a href="#">${course.get_about_section("university")}</a></h2></h1>
<hr>
</hgroup>
<div class="course-dates">
<p>Class Starts: <span class="start-date">7/12/12</span></p>
<p>Final Exam: <span class="start-date">12/09/12</span></p>
<p>Total Length: <span class="course-length">15 weeks</span></p>
</div>
</section>
</section>
<section class="main-content-wrap">
<div class="video">
${course.get_about_section("video")}
</div>
<section class="course-description">
<h3>About this course</h3>
<div class="course-times">
<div class="start">
<strong>Start</strong>
Aug 6th
</div>
<div class="length">
<strong>Length</strong>
15 weeks
</div>
<div class="final">
<strong>Final</strong>
Dec 24th
</div>
<section class="actions">
<div class="register-wrapper">
<a href="#" class="register">Register</a>
</div>
</div>
<p>${course.get_about_section("description")}</p>
<section class="social-sharing">
<p><span class="num-people-registered">1,435</span> students already registed!</p>
</section>
</section>
</div>
</header>
<div class="faded-hr-divider"></div>
<section class="container">
<section class="details">
<nav>
<a href="#" class="active">Overview</a>
<a href="#">FAQ</a>
<a href="#">Requirements</a>
<a href="#">Text-book</a>
<a href="#">Syllabus</a>
<a href="#">Reviews</a>
</nav>
<ul class="tabs">
<li data-class="requirements" class="enabled">Requirements</li>
<li data-class="syllabus">Syllabus</li>
<li data-class="textbook">Textbook</li>
<li data-class="faq">FAQ</li>
<li data-class="more-info">More info</li>
</ul>
<div class="inner-wrapper">
<section class="about">
<h2>About this course</h2>
<p>${course.get_about_section("description")}</p>
<section class="tabs-content">
<section class="requirements tab" style="display: block;">
<h3>Requirements</h3>
${course.get_about_section("requirements")}
</section>
<h2>Requirements</h2>
<p>${course.get_about_section("requirements")}</p>
<section class="syllabus tab">
<h3>Syllabus</h3>
${course.get_about_section("syllabus")}
</section>
<h2>Syllabus</h2>
<p>${course.get_about_section("syllabus")}</p>
<section class="textbook tab">
<h3>Textbook</h3>
${course.get_about_section("textbook")}
</section>
<section class="faq tab">
<h3>Frequently Asked Questions</h3>
${course.get_about_section("faq")}
</section>
<section class="more-info tab">
${course.get_about_section("more_info")}
</section>
</section> <!-- .tabs -->
<div class="clearfix"></div>
</section> <!-- .main-content-wrap -->
</section> <!-- .course-info -->
</section> <!-- .container -->
<section class="course-staff">
<h2>Course staff</h3>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/anant.jpg')}" />
</div>
<h3>Anant Agarwal</h3>
<p>Director of MIT’s Computer Science and Artificial Intelligence Laboratory (CSAIL) and a professor of the Electrical Engineering and Computer Science department at MIT. His research focus is in parallel computer architectures and cloud software systems, and he is a founder of several successful startups, including Tilera, a company that produces scalable multicore processors. Prof. Agarwal won MIT’s Smullin and Jamieson prizes for teaching and co-authored the course textbook “Foundations of Analog and Digital Electronic Circuits.”</p>
</article>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/gerald.jpg')}" />
</div>
<h3>Gerald Sussman</h3>
<p>Professor of Electrical Engineering at MIT. He is a well known educator in the computer science community, perhaps best known as the author of Structure and Interpretation of Computer Programs, which is universally acknowledged as one of the top ten textbooks in computer science, and as the creator of Scheme, a popular teaching language. His research spans a range of topics, from artificial intelligence, to physics and chaotic systems, to supercomputer design.</p>
</article>
<article class="teacher">
<div class="teacher-image">
<img src="${static.url('images/piotr.jpg')}" />
</div>
<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>
</div>
<section class="course-sidebar">
<div class="media">
<div class="hero">
<img src="${static.url('images/history.png')}" />
<div class="play-intro"></div>
</div>
<%include file="../video_modal.html" />
${course.get_about_section("video")}
</div>
<section class="course-summary">
<h3>Course Sumamry</h3>
<p>${course.get_about_section("short_description")}</p>
</section>
<section class="dates">
<p>Course Number <span class="start-date">(${course.get_about_section("number")})</span></p>
</section>
</section>
</section>
</section>
<%namespace name='static' file='static_content.html'/>
<section class="modal video-modal">
<div class="inner-wrapper">
<iframe width="640" height="360" src="http://www.youtube.com/embed/p2Q6BrNhdh8" frameborder="0" allowfullscreen></iframe>
<div class="close-modal">
<div class="inner">
<p>&#10005;</p>
</div>
</div>
</div>
</section>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment