:root {
--purple: #5d35b0;
--deep-purple: #35166f;
--yellow: #ffd23f;
--cream: #fffdf6;
--ink: #2e2445;}
* {
box-sizing: border-box;}
body {
color: var(--ink);
font-family: 'Nunito', Arial, sans-serif;
font-size: 16px;
line-height: 1.65;}
a:hover, a:focus {
text-decoration: none;}
.navbar {
background: #fff;
border: 0;
border-radius: 0;
box-shadow: 0 2px 13px rgba(53,22,111,.08);
margin: 0;
min-height: 76px;}
.navbar-brand {
color: var(--deep-purple) !important;
font-size: 27px;
font-weight: 800;
height: 76px;
letter-spacing: -.6px;
padding-top: 22px;}
.brand-mark {
background: var(--yellow);
border-radius: 8px;
color: var(--deep-purple);
display: inline-block;
font-size: 17px;
height: 30px;
line-height: 30px;
margin-right: 7px;
text-align: center;
transform: rotate(-6deg);
width: 30px;}
.navbar-nav > li > a {
color: #584e69 !important;
font-weight: 700;
padding-bottom: 28px;
padding-top: 28px;}
.navbar-nav > li > a:hover {
color: var(--purple) !important;}
.nav-signin {
color: var(--purple) !important;}
.navbar-default .navbar-nav > li > a.nav-join {
background: var(--purple);
border-radius: 23px;
color: #fff !important;
margin: 16px 0 16px 12px;
padding: 11px 21px !important;}
.navbar-default .navbar-nav > li > a.nav-join:hover, .navbar-default .navbar-nav > li > a.nav-join:focus {
background: var(--deep-purple) !important;
color: #fff !important;}
.hero {
background: linear-gradient(135deg, #f9f5ff 0%, #f1eaff 62%, #fff8d9 100%);
min-height: 600px;
overflow: hidden;
padding: 83px 0 66px;
position: relative;}
.hero:after {
background: rgba(255,210,63,.28);
border-radius: 50%;
content: '';
height: 430px;
position: absolute;
right: -160px;
top: -215px;
width: 430px;}
.hero-copy {
padding-top: 25px;
position: relative;
z-index: 2;}
.eyebrow {
color: var(--purple);
font-size: 13px;
font-weight: 800;
letter-spacing: 1.4px;
text-transform: uppercase;}
h1 {
color: var(--deep-purple);
font-size: 49px;
font-weight: 800;
letter-spacing: -1.5px;
line-height: 1.12;
margin: 13px 0 19px;}
.hero-text {
color: #5e5470;
font-size: 19px;
max-width: 545px;}
.search-panel {
background: #fff;
border-radius: 14px;
box-shadow: 0 15px 34px rgba(68,39,130,.15);
margin-top: 28px;
max-width: 585px;
padding: 9px;}
.search-panel .form-control {
border: 0;
box-shadow: none;
color: #6c627b;
font-size: 15px;
height: 50px;}
.search-icon {
color: #a499b8;
padding-left: 13px;}
.btn-search, .btn-primary-schoreka {
background: var(--purple);
border: 0;
color: #fff;
font-weight: 800;}
.btn-search {
border-radius: 10px;
height: 50px;
padding: 0 25px;}
.btn-search:hover, .btn-primary-schoreka:hover {
background: var(--deep-purple);
color: #fff;}
.popular {
color: #776d87;
font-size: 13px;
margin: 12px 0 0 14px;}
.popular a {
color: var(--purple);
font-weight: 700;
margin-left: 8px;}
.hero-visual {
min-height: 435px;
position: relative;
z-index: 1;}
.hero-photo {
border-radius: 22px;
box-shadow: 0 18px 38px rgba(53,22,111,.17);
height: 375px;
object-fit: cover;
object-position: 68% center;
opacity: .94;
position: absolute;
right: 0;
top: 12px;
width: 330px;}
.lesson-card {
background: #fff;
border-radius: 18px;
box-shadow: 0 20px 45px rgba(52,22,111,.17);
left: 55px;
padding: 24px;
position: absolute;
top: 30px;
transform: rotate(2deg);
width: 330px;}
.lesson-top {
align-items: center;
display: flex;
margin-bottom: 22px;}
.avatar {
align-items: center;
background: #ffe890;
border-radius: 50%;
color: var(--deep-purple);
display: inline-flex;
font-size: 20px;
height: 52px;
justify-content: center;
margin-right: 12px;
width: 52px;}
.lesson-name {
font-size: 15px;
font-weight: 800;
line-height: 1.25;}
.lesson-subject {
color: #857a96;
font-size: 12px;}
.video-box {
align-items: center;
background: linear-gradient(135deg, #6d46bf, #3a167a);
border-radius: 12px;
color: #fff;
display: flex;
height: 158px;
justify-content: center;
position: relative;}
.video-box:before {
border: 2px solid rgba(255,255,255,.42);
border-radius: 50%;
content: '';
height: 56px;
position: absolute;
width: 56px;}
.video-box i {
font-size: 17px;
margin-left: 3px;
z-index: 1;}
.live-badge {
background: var(--yellow);
border-radius: 14px;
color: #4b3400;
font-size: 10px;
font-weight: 800;
left: 12px;
letter-spacing: .6px;
padding: 4px 8px;
position: absolute;
text-transform: uppercase;
top: 12px;}
.lesson-footer {
color: #6e637d;
font-size: 12px;
font-weight: 700;
margin-top: 17px;}
.lesson-footer .pull-right {
color: var(--purple);}
.floating-chip {
background: #fff;
border-radius: 12px;
box-shadow: 0 12px 25px rgba(50,24,102,.15);
font-size: 13px;
font-weight: 800;
padding: 12px 16px;
position: absolute;}
.chip-one {
left: -10px;
top: 300px;}
.chip-two {
right: 5px;
top: 105px;}
.floating-chip i {
color: #f2b600;
margin-right: 6px;}
.trust-bar {
background: var(--deep-purple);
color: #fff;
padding: 20px 0;}
.trust-bar p {
font-size: 14px;
margin: 5px 0;
opacity: .8;}
.trust-item {
font-size: 14px;
font-weight: 700;
margin: 5px 0;}
.trust-item + .trust-item {
margin-left: 30px;}
.trust-item i {
color: var(--yellow);
margin-right: 8px;}
.section {
padding: 82px 0;}
.section-soft {
background: var(--cream);}
.section-title {
color: var(--deep-purple);
font-size: 33px;
font-weight: 800;
letter-spacing: -.8px;
margin: 8px 0 14px;}
.section-lead {
color: #71677e;
font-size: 17px;
margin: auto;
max-width: 610px;}
.feature-row {
display: flex;
flex-wrap: wrap;}
.feature-row > [class*='col-'] {
display: flex;}
.feature {
background: #fff;
border: 1px solid #eee8f7;
border-radius: 13px;
height: 100%;
margin-top: 35px;
padding: 28px 24px;
transition: .2s ease;
width: 100%;}
.feature:hover {
box-shadow: 0 14px 30px rgba(72,39,132,.1);
transform: translateY(-4px);}
.feature-icon {
align-items: center;
background: #f0e9ff;
border-radius: 12px;
color: var(--purple);
display: flex;
font-size: 22px;
height: 51px;
justify-content: center;
margin-bottom: 18px;
width: 51px;}
.feature h3 {
color: var(--deep-purple);
font-size: 19px;
font-weight: 800;
margin: 0 0 8px;}
.feature p {
color: #746a80;
font-size: 14px;
margin: 0;}
.subject-card {
background: #fff;
border-radius: 12px;
color: var(--deep-purple);
display: block;
font-size: 16px;
font-weight: 800;
margin-top: 22px;
padding: 21px;
box-shadow: 0 6px 18px rgba(59,29,112,.06);}
.subject-card:hover {
color: var(--purple);
transform: translateY(-2px);}
.subject-card i {
color: var(--yellow);
float: right;
font-size: 19px;}
.teacher-cta {
background: linear-gradient(115deg, var(--deep-purple), #6a40ba);
border-radius: 19px;
color: #fff;
overflow: hidden;
padding: 48px 50px;
position: relative;}
.teacher-cta:after {
border: 45px solid rgba(255,210,63,.18);
border-radius: 50%;
content: '';
height: 225px;
position: absolute;
right: -38px;
top: -96px;
width: 225px;}
.teacher-cta h2 {
font-size: 31px;
font-weight: 800;
margin: 0 0 11px;
position: relative;
z-index: 1;}
.teacher-cta p {
font-size: 16px;
margin-bottom: 23px;
max-width: 550px;
opacity: .88;
position: relative;
z-index: 1;}
.btn-yellow {
background: var(--yellow);
border: 0;
border-radius: 23px;
color: var(--deep-purple);
font-weight: 800;
padding: 12px 23px;
position: relative;
z-index: 1;}
.btn-yellow:hover {
background: #ffe371;
color: var(--deep-purple);}
.story-section {
background: #fff;
padding: 82px 0;}
.story-copy {
padding: 27px 35px 0 0;}
.story-copy h2 {
color: var(--deep-purple);
font-size: 31px;
font-weight: 800;
letter-spacing: -.8px;
line-height: 1.2;
margin: 9px 0 15px;}
.story-copy p {
color: #71677e;
font-size: 16px;
line-height: 1.7;
margin-bottom: 19px;}
.story-points {
list-style: none;
margin: 0;
padding: 0;}
.story-points li {
color: #5e536c;
font-size: 14px;
font-weight: 700;
margin: 10px 0;}
.story-points i {
color: var(--purple);
margin-right: 8px;}
.story-photo-wrap {
border-radius: 18px;
box-shadow: 0 17px 35px rgba(53,22,111,.14);
overflow: hidden;
position: relative;}
.story-photo {
display: block;
height: 315px;
object-fit: cover;
object-position: center;
width: 100%;}
.photo-caption {
background: rgba(53,22,111,.9);
bottom: 0;
color: #fff;
font-size: 12px;
left: 0;
padding: 11px 16px;
position: absolute;
right: 0;}
.photo-caption i {
color: var(--yellow);
margin-right: 6px;}
.hero {
background-image: linear-gradient(90deg, rgba(248,245,255,.98) 0%, rgba(248,245,255,.91) 38%, rgba(248,245,255,.46) 72%, rgba(248,245,255,.2) 100%), url('../images/nigerian-hero-background.png');
background-position: center;
background-size: cover;}
.hero-photo {
display: none;}
footer {
background: #251044;
color: #cfc4df;
padding: 36px 0;}
footer .brand {
color: #fff;
font-size: 22px;
font-weight: 800;}
footer p {
font-size: 13px;
margin: 9px 0 0;}
footer a {
color: #e7dcf7;
font-size: 14px;
margin-left: 20px;}
footer a:hover {
color: var(--yellow);}
@media (max-width: 767px) {
.navbar-brand {
padding-left: 15px;}
.navbar-toggle {
border-color: #d7cdec;
margin-top: 20px;}
.navbar-toggle .icon-bar {
background: var(--purple);}
.navbar-nav {
margin: 0 -15px;
padding: 7px 18px 15px;}
.navbar-nav > li > a {
padding: 10px 15px;}
.navbar-default .navbar-nav > li > a.nav-join {
display: inline-block;
margin: 7px 15px;}
.feature-row, .feature-row > [class*='col-'] {
display: block;}
.hero {
padding-top: 48px;}
.hero:after {
right: -260px;}
.hero-copy {
padding-top: 0;}
h1 {
font-size: 38px;}
.hero-text {
font-size: 17px;}
.hero-visual {
margin: 27px auto 0;
max-width: 360px;
min-height: 390px;}
.hero-photo {
height: 360px;
right: 4px;
width: 310px;}
.lesson-card {
left: 22px;
width: 300px;}
.chip-one {
left: 0;}
.chip-two {
right: -2px;}
.trust-bar .text-right {
text-align: left;}
.trust-item {
display: inline-block;
margin-left: 0 !important;
margin-right: 15px;}
.story-section {
padding: 58px 0;}
.story-copy {
padding: 0 0 30px;}
.story-copy h2 {
font-size: 28px;}
.story-photo {
height: 245px;}
.section {
padding: 58px 0;}
.section-title {
font-size: 29px;}
.teacher-cta {
padding: 35px 28px;}
.teacher-cta h2 {
font-size: 27px;}
footer .text-right {
text-align: left;
margin-top: 18px;}
footer a {
margin-left: 0;
margin-right: 20px;}
}

.featured-plans{background:#fff}.public-plan-card{background:#fff;border:1px solid #eae3f0;border-radius:12px;box-shadow:0 7px 22px rgba(53,22,111,.06);margin:20px 0;padding:21px;text-align:left}.public-approved{color:#348367;font-size:10px;font-weight:800}.public-approved i{margin-right:4px}.public-plan-card h3{color:#35166f;font-size:17px;font-weight:800;line-height:1.35;margin:8px 0 5px}.plan-subject{color:#887d93;font-size:11px;min-height:32px}.plan-teacher{align-items:center;background:#faf8fd;border-radius:8px;display:flex;margin:14px 0;padding:9px}.plan-teacher>span{align-items:center;background:#f3d46c;border-radius:50%;color:#4e367e;display:flex;font-size:10px;font-weight:800;height:34px;justify-content:center;margin-right:8px;width:34px}.plan-teacher strong,.plan-teacher small{display:block}.plan-teacher strong{color:#4f405e;font-size:11px}.plan-teacher small{color:#958a9f;font-size:9px}.plan-stats{border-bottom:1px solid #eee9f3;display:flex;gap:18px;padding-bottom:12px}.plan-stats span{color:#746879;font-size:10px}.plan-card-foot{align-items:flex-end;display:flex;justify-content:space-between;padding-top:14px}.plan-card-foot small,.plan-card-foot strong{display:block}.plan-card-foot small{color:#968b9f;font-size:8px}.plan-card-foot strong{color:#35166f;font-size:16px}.plan-card-foot a,.all-teachers-link{color:#5d35b0;font-size:10px;font-weight:800}.all-teachers-link{border:1px solid #5d35b0;border-radius:6px;display:inline-block;margin-top:13px;padding:10px 14px}.all-teachers-link:hover{background:#5d35b0;color:#fff;text-decoration:none}