﻿.font-100 {
  font-weight: 100; }

.font-300 {
  font-weight: 300; }

.font-400 {
  font-weight: 400; }

.font-500 {
  font-weight: 500; }

.font-600 {
  font-weight: 600; }

.font-700 {
  font-weight: 700; }

.font-900 {
  font-weight: 900; }

.font-s-12 {
  font-size: 12px; }

.font-s-14 {
  font-size: 14px; }

.font-s-16 {
  font-size: 16px; }

.font-s-15 {
  font-size: 15px; }

.font-s-17 {
  font-size: 17px; }

.font-s-18 {
  font-size: 18px; }

.font-s-20 {
  font-size: 20px; }

.font-s-22 {
  font-size: 22px; }

.font-s-24 {
  font-size: 24px; }

.font-s-26 {
  font-size: 26px; }

.font-s-30 {
  font-size: 30px; }

.font-s-32 {
  font-size: 32px; }

.font-s-40 {
  font-size: 40px; }

p {
  font-size: 18px;
  font-family: "Montserrat", sans-serif; }

.text-blue {
  color: #4C8299; }

.text-grey {
  color: #555; }

.text-orange {
  color: #E5761B; }

h1 {
  font-size: 90px; }

h2 {
  font-size: 65px; }

h3 {
  font-size: 35px; }

h4 {
  font-size: 38px; }

h5 {
  font-size: 22px; }

h6 {
  font-size: 20px; }

.font-montserrat {
  font-family: "Montserrat", sans-serif; }

.font-oswald {
  font-family: "Oswald", sans-serif; }

h1 {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  line-height: 95px;
  letter-spacing: 2.75px; }

h2 {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  line-height: 72px;
  letter-spacing: 2.75px; }

h3 {
  font-family: "Oswald", sans-serif;
  font-weight: 400;
  line-height: 50px;
  letter-spacing: 0px; }

h4 {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  line-height: 45px;
  letter-spacing: 0px; }

h5 {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: normal; }

h6 {
  font-family: "Montserrat", sans-serif;
  font-weight: 400;
  line-height: 32px;
  letter-spacing: normal;
  font-weight: 500; }

@media only screen and (max-width: 767px) {
  h1 {
    font-size: 50px;
    line-height: 60px;
    letter-spacing: 1.53; }
  h2 {
    font-size: 50px;
    line-height: 55px;
    letter-spacing: 2.12; }
  h3 {
    font-size: 35px;
    line-height: 40px; }
  h4 {
    font-size: 24px;
    line-height: 30px; }
  h5 {
    font-size: 18px;
    line-height: 20px; }
  h6 {
    font-size: 16px;
    font-weight: normal;
    line-height: 18px; } }

@media only screen and (min-width: 768px) and (max-width: 991px) {
  h1 {
    font-size: 50px;
    line-height: 60px;
    letter-spacing: 1.53; }
  h2 {
    font-size: 50px;
    line-height: 60px;
    letter-spacing: 2.12; }
  h3 {
    font-size: 40px;
    line-height: 50px; }
  h4 {
    font-size: 25px;
    line-height: 30px; }
  h5 {
    font-size: 18px;
    line-height: 20px; }
  h6 {
    font-size: 16px;
    font-weight: normal;
    line-height: 18px; } }

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  h1 {
    font-size: 80px; }
  h2 {
    font-size: 55px; }
  h3 {
    font-size: 30px; }
  h4 {
    font-size: 30px; }
  h5 {
    font-size: 20px; }
  h6 {
    font-size: 16px;
    font-weight: normal; } }

.btn.cmn-buttons:focus {
  outline: none; }

.btn.light-btn {
  background: #FFCF82;
  color: #4C8299;
  font-size: 35px;
  border-radius: 10px;
  box-shadow: 0 6px 20px -9px rgba(0, 0, 0, 0.3);
  font-family: "Oswald", sans-serif;
  outline: none;
  cursor: pointer;
  min-width: 271px;
  max-width: 271px; }
  .btn.light-btn:hover {
    background: #fcbc56; }

.btn.dark-btn {
  background: #E5761B;
  color: #fff;
  font-size: 35px;
  border-radius: 10px;
  box-shadow: 0 6px 20px -9px rgba(0, 0, 0, 0.3);
  font-family: "Oswald", sans-serif;
  outline: none;
  cursor: pointer;
  min-width: 271px;
  max-width: 271px; }
  .btn.dark-btn:hover {
    background: #fcbc56; }

.btn.sm-light-btn {
  min-width: 181px !important;
  max-width: 181px !important; }

.btn.dark-btn-sm {
  background: #E5761B;
  color: #fff;
  font-size: 24px;
  border-radius: 10px;
  box-shadow: 0 6px 20px -9px rgba(0, 0, 0, 0.3);
  font-family: "Oswald", sans-serif;
  outline: none;
  cursor: pointer;
  height: 40px;
  min-width: 160px;
  max-width: 160px;
  padding: 0px; }
  .btn.dark-btn-sm:hover {
    background: #fcbc56; }

.btn.orange-btn {
  background: #FFCF82;
  color: #E5761B;
  font-size: 24px;
  border-radius: 10px;
  box-shadow: 0 6px 20px -9px rgba(0, 0, 0, 0.3);
  font-family: "Oswald", sans-serif;
  outline: none;
  cursor: pointer;
  height: 40px;
  min-width: 160px;
  max-width: 160px;
  padding: 0px; }
  .btn.orange-btn:hover {
    background: #fcbc56; }

@media only screen and (max-width: 991px) {
  /* Buttons */
  .btn.cmn-buttons {
    height: 45px;
    font-size: 22px;
    min-width: 150px;
    max-width: 181px;
    padding: 4px 0px; } }

input {
  border-radius: 10px !important;
  height: 64px;
  color: #000 !important;
  border: 1px solid #707070 !important; }
  input:focus {
    outline: none !important;
    box-shadow: none !important;
    border: 1px solid #707070 !important; }

textarea {
  border-radius: 10px !important;
  border: 1px solid #707070 !important;
  color: #000 !important; }
  textarea:focus {
    border: 1px solid #707070 !important;
    box-shadow: none !important; }

@media only screen and (max-width: 991px) {
  input {
    height: 45px; } }

/* TESTIMONALS */
html {
  overflow-x: hidden; }

.testimonials-wrapper {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/orange-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  .testimonials-wrapper .bottom-description {
    background: #E5761B; }

.slider .items {
  height: auto;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  margin-left: 15px;
  margin-right: 15px; }
  .slider .items > p {
    font-style: italic;
    font-size: 20px;
    line-height: 32px;
    min-height: 350px; }
  .slider .items .bottom-description {
    position: relative; }
    .slider .items .bottom-description img {
      width: 40px;
      position: absolute;
      right: 32px;
      top: -20px; }

.slick-dots li.slick-active button:before {
  color: #fff !important; }

.slick-dots li button:before {
  font-size: 20px !important;
  color: #fff !important; }

#video-popup {
  position: absolute;
  background: rgba(0, 0, 0, 0.6);
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 100;
  top: 0;
  left: -100%;
  background-color: rgba(0, 0, 0, 0.7);
  overflow-x: hidden;
  transition: 0.5s; }

.video-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.border-10 {
  border-radius: 10px; }

.cursor-pointer {
  cursor: pointer; }

.amp-logo {
  display: none !important; }

.vjs-poster img {
  position: absolute;
  left: 0; }

@media only screen and (max-width: 767px) {
  .slider .items > p {
    min-height: 220px; } }

@media only screen and (max-width: 991px) {
  input {
    height: 45px; } }

.navigation {
  top: 0;
  left: 0;
  z-index: 99999999;
  transition: all 0.5s; }

.sticky {
  background: rgba(76, 130, 153, 0.9);
  box-shadow: 2px 2px 15px -1px;
  transition: all 0.5s; }

.logo-size {
  height: 60px !important; }

.nav-items-global ul li {
  list-style: none;
  display: inline; }
  .nav-items-global ul li a {
    font-size: 24px;
    border-radius: 10px;
    background: #fff;
    color: #E5761B;
    list-style-type: none;
    display: inline-block;
    min-width: 159px;
    padding: 2px 0px;
    box-shadow: 0 6px 20px -9px rgba(0, 0, 0, 0.3);
    font-family: "Oswald", sans-serif;
    border: 0px;
    outline: none;
    cursor: pointer; }
  .nav-items-global ul li a:hover {
    text-decoration: none !important;
    background: #E5761B;
    color: #fff; }
  .nav-items-global ul li:last-of-type a {
    background: #E5761B;
    color: #fff; }
    .nav-items-global ul li:last-of-type a:hover {
      background: #fcbc56; }
  .nav-items-global ul li .active-btn {
    background: #FFCF82;
    color: #E5761B; }

.header-content-sec {
  border-radius: 10px;
  background-color: rgba(255, 255, 255, 0.85); }

.logo-nav-bar {
  background-image: url("../images/logo.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 100px;
  height: 100px;
  transition: all 0.5s; }

.footer-bg {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/blue-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  .footer-bg ul li {
    list-style-type: none;
    display: inline-block;
    margin-left: 2%;
    font-size: 20px;
    font-family: "Montserrat", sans-serif; }
  .footer-bg a {
    text-decoration: none;
    color: #fff; }
    .footer-bg a:hover {
      color: #f2f4f4; }

.copyright-section p {
  font-size: 20px; }

@media only screen and (max-width: 767px) {
  .logo-nav-bar {
    height: 40px !important; }
  .nav-items-global ul li a {
    font-size: 11px !important;
    max-width: 100px !important;
    min-width: 65px !important;
    padding: 0px;
    margin: 0 !important; }
    .nav-items-global ul li a:last-child a {
      font-size: 11px !important; } }

@media only screen and (max-width: 991px) {
  .nav-items-global ul li a {
    font-size: 14px;
    max-width: 100px;
    min-width: 95px;
    padding: 2px 0px; }
    .nav-items-global ul li a:last-child a {
      font-size: 14px; }
  .logo-nav-bar {
    height: 70px; }
  /* Footer section */
  .footer-bg ul li {
    display: block;
    font-size: 18px; }
  .footer-bg .copyright-section p {
    font-size: 18px; } }

/* Header SECTION */
.cover-header {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/header-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: calc(640px + 59px);
  padding-top: 59px; }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .cover-header {
      height: calc(640px + 80px);
      padding-top: 86px; } }
  @media only screen and (max-width: 991px) {
    .cover-header {
      height: calc(640px + 113px);
      padding-top: 113px; } }

.marketing-logo {
  position: absolute;
  top: -21%;
  right: -7%; }
  .marketing-logo.marketing-logo-top-left {
    height: 50%;
    left: -8%;
    top: -14%; }

/*PROGRAMS*/
.programs {
  background: #E7F8FD;
  height: auto; }

.exampleSlider .MS-content .item img {
  max-width: 350px;
  max-height: 260px; }

/* Adventure section */
.Adventure-section {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/blue-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

/* SUBJECTS SECTION */
.subject-hover:hover .inner-wrapper {
  transform: rotateY(180deg); }

.subject-hover:hover .background {
  opacity: 0;
  transform: rotateY(0deg); }

.subject-hover:hover .background-2 {
  opacity: 1; }

.subjects {
  overflow: hidden;
  position: relative;
  border-radius: 10px;
  height: 282px;
  perspective: 1000px;
  height: 300px;
  width: 100%; }
  .subjects .inner-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.4s;
    overflow: visible !important;
    transform-style: preserve-3d; }
  .subjects .background, .subjects .background-2 {
    position: absolute;
    top: 0px;
    left: 0px;
    transition: all 0.5s; }
  .subjects .background {
    background-color: rgba(0, 0, 0, 0.4);
    backface-visibility: hidden; }
    .subjects .background .inner-container {
      opacity: 1;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      text-align: center; }
    .subjects .background p {
      font-size: 30px;
      font-weight: 800;
      opacity: 1;
      line-height: 28px; }
  .subjects .background-2 {
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 0;
    transform: rotateY(180deg); }
    .subjects .background-2 p {
      font-size: 18px;
      line-height: 24px; }
    .subjects .background-2 a {
      font-family: "Montserrat", sans-serif;
      font-size: 18px;
      position: absolute;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      text-decoration: underline; }
      .subjects .background-2 a:hover {
        color: #E5761B; }

.subject-arts-music {
  background-image: url("/images/home/subjects/arts-music.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-common-core {
  background-image: url("/images/home/subjects/common-core.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-digital-literacy {
  background-image: url("/images/home/subjects/digital-literacy.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-english {
  background-image: url("/images/home/subjects/english.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-financial-literacy {
  background-image: url("/images/home/subjects/financial-literacy.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-math {
  background-image: url("/images/home/subjects/math.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-more {
  background-image: url("/images/home/subjects/more.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-physical-activity {
  background-image: url("/images/home/subjects/physical-activity.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-science {
  background-image: url("/images/home/subjects/science.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-social {
  background-image: url("/images/home/subjects/social.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-special-education {
  background-image: url("/images/home/subjects/special-education.jpeg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.subject-wellness-mindfulness {
  background-image: url("/images/home/subjects/wellness-mindfulness.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

/* WHAT YOU GET SECTION */
.what-you-get-section > div {
  padding: 0; }

.what-you-get-image {
  background-image: url("../images/home/what-you-get.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.what-you-get-bg {
  background-image: url("../images/home/what-you-get-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.what-you-get-bg {
  color: #41748A; }
  .what-you-get-bg ul li {
    background: url("../images/home/tick.png") no-repeat left 18px;
    list-style-type: none;
    padding-left: 43px;
    font-size: 24px; }

/* Classroom Section */
.classroom-section {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/orange-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  .classroom-section .image-section-right {
    background-image: url("../images/about-a2l.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 300px; }

.content-section-left {
  font-size: 18px;
  font-family: "Montserrat", sans-serif; }
  .content-section-left ul {
    text-align: left;
    padding-left: 0px; }
    .content-section-left ul li {
      background: url("../images/home/tick.png") no-repeat left 5px;
      list-style-type: none;
      padding-left: 43px; }

.live-stats-icon, .ease-of-use-icon, .variety-icon {
  display: inline-block;
  background: url("../images/icons/start-adventure.png") no-repeat;
  overflow: hidden;
  text-indent: -9999px;
  text-align: left; }

.live-stats-icon {
  background-position: -5px -0px;
  width: 160px;
  height: 160px; }

.ease-of-use-icon {
  background-position: -5px -165px;
  width: 159px;
  height: 160px; }

.variety-icon {
  background-position: -5px -330px;
  width: 159px;
  height: 160px; }

.facebook, .insta, .twitter {
  display: inline-block;
  background: url("../images/icons/social-media.png") no-repeat;
  overflow: hidden;
  text-indent: -9999px;
  text-align: left; }

.facebook {
  background-position: -5px -0px;
  width: 36px;
  height: 36px; }

.insta {
  background-position: -5px -41px;
  width: 36px;
  height: 36px; }

.twitter {
  background-position: -5px -82px;
  width: 36px;
  height: 36px; }

.sound-btn {
  cursor: pointer;
  position: absolute;
  left: 0%;
  right: 0%;
  top: 0%;
  bottom: 0%;
  width: 100%;
  height: 100%;
  background: transparent; }

/* READY TO GET STARTED */
.ready-section .logo img {
  width: 139px;
  height: 139px; }

@media only screen and (max-width: 767px) {
  /* Header & navigation */
  .cover-header {
    height: calc(550px + 113px); }
  .what-you-get-image {
    height: 400px; }
  .marketing-logo {
    top: -4%;
    right: -3%;
    width: 20%; } }

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .what-you-get-image {
    height: 700px; }
  .marketing-logo {
    top: -21%;
    right: -10%;
    width: 22%; } }

.header-notification {
  z-index: 999;
  margin: 0 -15px;
  width: calc(100% + 30px);
  background: #fd3;
  -webkit-box-shadow: inset 0 0.125rem 0.0625rem rgba(0, 0, 0, 0.5), inset 0 -0.125rem 0.125rem rgba(0, 0, 0, 0.5);
  box-shadow: inset 0 0.125rem 0.0625rem rgba(0, 0, 0, 0.5), inset 0 -0.125rem 0.125rem rgba(0, 0, 0, 0.5);
  overflow: hidden; }
  .header-notification .header-notification__inner {
    padding: 1rem 1rem;
    display: flex;
    justify-content: center; }
    .header-notification .header-notification__inner p {
      text-align: center; }

.contact-us-header {
  background-image: url("../images/background-images/header-bg3.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 540px; }

.contact {
  animation-name: contact;
  animation-duration: 1s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards; }

.contact-main {
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 0 64px 0 rgba(0, 0, 0, 0.16); }

.contact-form-sec {
  background: #fff; }
  .contact-form-sec #message {
    resize: none; }
  .contact-form-sec h5 {
    color: #4C8299; }

.contact-info-sec {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/orange-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  .contact-info-sec p {
    font-size: 16px; }

@keyframes contact {
  from {
    transform: translateY(0px); }
  to {
    transform: translateY(-125px); } }

/* HEADER SECTION */
.about-us-header {
  background-image: url("../images/background-images/header-bg10.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 570px; }

/* A2L DESCRIPTION SECTION */
.A2L-description .box-wrapper {
  box-shadow: 0 8px 40px 0 rgba(0, 0, 0, 0.1);
  border-radius: 10px; }
  .A2L-description .box-wrapper .line {
    background: #E5761B;
    height: 1px;
    width: 105px;
    margin: 30px auto 25px auto; }

.A2L-description .content-section {
  font-size: 18px;
  font-family: "Montserrat", sans-serif; }
  .A2L-description .content-section ul {
    padding-left: 0px; }
    .A2L-description .content-section ul li {
      background: url("../images/icons/tick-orange.png") no-repeat left 5px;
      list-style-type: none;
      padding-left: 43px; }

/* LEADERSHIP TEAM */
.team-members div .card {
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.06);
  padding: 20px 0px;
  min-height: 160px;
  border: 0px; }
  .team-members div .card .profile-pic {
    display: none; }
  .team-members div .card .name {
    font-size: 24px;
    font-weight: 600; }
  .team-members div .card:hover .profile-pic {
    display: block; }

.management-team div .card {
  cursor: pointer; }

.blog-header {
  background-image: url("../images/background-images/header-bg7.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 735px; }

.sample-videos-header {
  background-image: url("../images/background-images/header-bg4.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 570px; }

.sample-video {
  object-fit: cover; }

video:focus {
  outline: none; }

.play-btn {
  background-image: url("../images/icons/play.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: unset; }

.lock-btn {
  background-image: url("../images/icons/lock.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: unset;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4); }

.play-btn, .lock-btn {
  cursor: pointer;
  position: absolute;
  left: 0%;
  right: 0%;
  top: 0%;
  bottom: 0%; }

.video-wrapper {
  max-height: 187px;
  overflow: hidden;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px; }

.video-timing {
  background-image: url(../images/icons/fill.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: unset;
  position: absolute;
  bottom: 11px;
  right: 11px;
  width: 79px;
  height: 40px;
  justify-content: center;
  align-items: center;
  display: flex; }

.videos-section .video-title,
.more-videos .video-title {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background: #C0E2D5; }

.more-videos {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/blue-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

.unlock-videos {
  position: absolute;
  background: rgba(0, 0, 0, 0.6);
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: -100%;
  background-color: rgba(0, 0, 0, 0.7);
  overflow-x: hidden;
  transition: 0.5s; }

.unlock-popup {
  background-color: #e2a23c;
  height: auto;
  border-radius: 10px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }
  .unlock-popup p:hover {
    color: #08088A; }

@media only screen and (max-width: 767px) {
  .video-wrapper {
    max-height: 100%; } }

.subscribe-header {
  background-image: url("../images/background-images/header-bg6.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 570px; }

.plans-pricing {
  margin-top: -190px; }
  .plans-pricing .plans {
    height: 400px;
    position: relative; }
  .plans-pricing .subscribe-btn {
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%); }
  .plans-pricing .free-plan {
    border-top-left-radius: 10px;
    background: #A5C1CC;
    box-shadow: 0 3px 29px 0 rgba(0, 0, 0, 0.1); }
  .plans-pricing .monthly-plan {
    background: #81A7B7;
    box-shadow: 0 3px 29px 0 rgba(0, 0, 0, 0.1); }
  .plans-pricing .yearly-plan {
    height: 470px;
    background: #6292A6;
    box-shadow: 0 10px 56px 0 rgba(0, 0, 0, 0.2);
    border: 1.86px solid #FFCF82;
    border-radius: 10px; }
    .plans-pricing .yearly-plan .recommended-plan {
      background: #E5761B;
      font-size: 12px;
      padding: 2px 4px;
      border-radius: 3px; }
    .plans-pricing .yearly-plan #banner {
      width: auto;
      max-width: 250px;
      height: 43px;
      position: relative;
      background: #FFCF82;
      padding: 2px;
      margin-bottom: 32px; }
      .plans-pricing .yearly-plan #banner p {
        font-size: 12px; }
    .plans-pricing .yearly-plan #banner:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      top: 0;
      width: 0;
      height: 0;
      border-left: 12px solid #6292A6;
      border-top: 25px solid transparent;
      border-bottom: 21px solid transparent; }
    .plans-pricing .yearly-plan #banner:before {
      content: "";
      position: absolute;
      transform: rotate(180deg);
      right: 0px;
      bottom: 0;
      top: 0;
      width: 0;
      height: 0;
      border-left: 12px solid #6292A6;
      border-top: 21px solid transparent;
      border-bottom: 25px solid transparent; }
  .plans-pricing .school-wide-plan {
    border-top-right-radius: 10px;
    background: #81A7B7; }
  .plans-pricing .plan-name {
    font-size: 40px;
    font-weight: bold; }
  .plans-pricing .plan-description {
    font-size: 16px; }
  .plans-pricing .features {
    height: 600px; }
    .plans-pricing .features ul {
      text-align: left;
      padding-left: 0px; }
      .plans-pricing .features ul li {
        background: url("../images/icons/check-btn.png") no-repeat left 5px;
        list-style-type: none;
        padding-left: 25px;
        font-size: 14px; }
  .plans-pricing .free-plan-features {
    border-bottom-left-radius: 10px;
    background: rgba(165, 193, 204, 0.2); }
  .plans-pricing .monthly-plan-features {
    background: rgba(129, 167, 183, 0.2); }
  .plans-pricing .yearly-plan-features {
    transform: translateY(-35px);
    background: rgba(98, 146, 166, 0.2); }
  .plans-pricing .school-wide-features {
    border-bottom-right-radius: 10px;
    background: rgba(129, 167, 183, 0.2); }

.offer-wrapper {
  background-image: url("https://a2lprod.blob.core.windows.net/marketing-site/orange-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }
  .offer-wrapper a {
    color: inherit; }

@media only screen and (max-width: 767px) {
  .plans-pricing .plans {
    height: auto; }
  .plans-pricing .plans-container {
    overflow: hidden;
    border-radius: 10px; }
  .plans-pricing .subscribe-btn {
    position: relative;
    bottom: 0px;
    left: 0%;
    transform: translateX(0%); }
  .plans-pricing .yearly-plan-features {
    transform: translateY(0px); }
  .plans-pricing .features {
    height: auto !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; } }

.not-found-header {
  background-image: url("../images/background-images/header-bg8.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 735px; }

.thank-you-header {
  background-image: url("../images/background-images/header-bg9.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 735px; }

.landing-container {
  background-image: url("../images/background-images/blue-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #555; }
  .landing-container .logo {
    padding-top: 3rem; }
  .landing-container .heading {
    font-size: 42px;
    font-family: "Montserrat", sans-serif; }
  .landing-container .container {
    background-color: #fff; }
  .landing-container .landing-gradient-1 {
    padding: 15px;
    border-radius: 20px 20px 10px 10px;
    background: linear-gradient(90deg, #EDFAFF 0%, rgba(237, 250, 255, 0) 100%);
    box-shadow: 0 0 24px 0 rgba(119, 119, 119, 0.13); }
  .landing-container .landing-gradient-2 {
    padding: 15px;
    border-radius: 20px 20px 10px 10px;
    background: linear-gradient(90deg, #FFFCE1 0%, rgba(255, 252, 225, 0) 100%);
    box-shadow: 0 0 24px 0 rgba(119, 119, 119, 0.13); }
  .landing-container .form-container {
    padding: 25px; }
  .landing-container .know-more {
    height: auto;
    min-width: 100px;
    font-size: medium; }
  .landing-container .dropdown .dropdown-toggle:active {
    border: none !important;
    outline: none !important; }
  .landing-container .dropdown .dropdown-toggle .form-control {
    width: 100%;
    background: #fff;
    color: #777;
    height: 64px;
    border-radius: 10px;
    font-size: 1.25em;
    text-align: initial;
    padding: .5rem 1rem;
    border: 1px solid #707070 !important; }
    .landing-container .dropdown .dropdown-toggle .form-control:focus {
      box-shadow: none !important; }
  .landing-container .dropdown .dropdown-toggle::after {
    color: #4C8299;
    font-size: 35px;
    position: absolute;
    right: 2px;
    margin-right: 5px;
    top: 28px;
    display: block;
    background: #fff; }
  .landing-container .dropdown .dropdown-menu {
    border: 1px solid #707070 !important;
    width: 100%;
    border-radius: 10px; }
  .landing-container .training {
    background-color: #FFCF82;
    height: 40px;
    padding: 0 20px; }
    .landing-container .training p {
      padding-top: 7px; }
    .landing-container .training::after, .landing-container .training::before {
      content: "";
      width: 0;
      height: 0;
      position: absolute;
      border-top: 20px solid transparent;
      border-bottom: 20px solid transparent; }
    .landing-container .training::after {
      left: 0;
      border-left: 20px solid #fff; }
    .landing-container .training::before {
      right: 0px;
      border-right: 20px solid #fff; }
    @media only screen and (min-width: 992px) and (max-width: 1199px) {
      .landing-container .training {
        height: 64px; }
        .landing-container .training::after, .landing-container .training::before {
          border-top: 32px solid transparent;
          border-bottom: 32px solid transparent; } }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
      .landing-container .training {
        height: 64px; }
        .landing-container .training::after, .landing-container .training::before {
          border-top: 32px solid transparent;
          border-bottom: 32px solid transparent; } }
    @media only screen and (max-width: 767px) {
      .landing-container .training {
        height: 90px; }
        .landing-container .training .dropdown .dropdown-toggle {
          height: 45px !important; }
        .landing-container .training::after, .landing-container .training::before {
          border-top: 45px solid transparent;
          border-bottom: 45px solid transparent; } }

.header-image {
  position: fixed;
  top: 0;
  z-index: 99;
  height: 240px;
  background-size: cover;
  background-position: center;
  transition: all 0.3s; }
  .header-image .header-icon {
    min-width: 50px;
    max-width: 50px; }
  .header-image .logo-wrapper {
    left: 50%;
    transform: translateX(-50%); }
  .header-image > div {
    background: rgba(46, 46, 46, 0.5); }

.subject-video-section {
  margin-top: 290px; }
  .subject-video-section .sample-video {
    border-radius: 10px;
    overflow: hidden; }
  .subject-video-section .video-timing {
    right: 20px; }
  .subject-video-section .play-btn {
    background-image: url("/images/icons/play-big.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: unset; }

.topic-wrapper ul {
  text-align: left; }
  .topic-wrapper ul li {
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    color: #555; }

.programs-bg {
  background-image: url("../images/background-images/yellow-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: auto; }
  .programs-bg .background {
    background: linear-gradient(to left, transparent, black);
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 50px 10px 50px 10px;
    width: 100%;
    background: linear-gradient(270deg, rgba(255, 210, 128, 0) 0%, #E6B651 100%); }
    .programs-bg .background::before {
      position: absolute;
      top: 0;
      left: 0;
      background: red;
      width: 100px;
      height: 50px; }
  .programs-bg .program-logo {
    max-width: 250px;
    border-radius: 10px; }

.programs-detail {
  background-image: url("../images/background-images/blue-bg.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover; }

#video-popup {
  position: absolute;
  background: rgba(0, 0, 0, 0.6);
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 100;
  top: 0;
  left: -100%;
  background-color: rgba(0, 0, 0, 0.7);
  overflow-x: hidden;
  transition: 0.5s; }

.video-popup {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.digital-life .word-highlight {
  color: #4C8299;
  font-weight: 500; }

.digital-life .header-wrapper {
  background: #faf9fd; }
  .digital-life .header-wrapper .a2l-logo {
    width: 90px; }
  .digital-life .header-wrapper .circle-logo {
    width: 130px; }
  .digital-life .header-wrapper .header-video {
    box-shadow: 0 12px 24px 0 rgba(98, 98, 98, 0.46); }

.digital-life .middle-wrapper #banner {
  margin: unset; }

.digital-life .videos-wrapper {
  background: #faf9fd; }
  .digital-life .videos-wrapper .resource-wrapper {
    height: 260px;
    width: 100%;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background-position: center;
    background-size: cover;
    background-color: #4C8299;
    display: flex;
    justify-content: center;
    align-items: center; }
    .digital-life .videos-wrapper .resource-wrapper .play-btn {
      width: 100%; }
  .digital-life .videos-wrapper .resource-title {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #E3F2EC;
    height: 120px; }
    .digital-life .videos-wrapper .resource-title .bottom-tag {
      min-width: 120px;
      background-color: #BDDBCF;
      border-radius: 17px; }
      .digital-life .videos-wrapper .resource-title .bottom-tag:hover {
        background: #9cc9b7; }
      .digital-life .videos-wrapper .resource-title .bottom-tag p {
        padding: 5px 15px; }
  .digital-life .videos-wrapper .ui-container:hover .ui-overlay {
    visibility: visible;
    opacity: 1; }
  .digital-life .videos-wrapper .ui-overlay {
    background: #4C8299;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 10px;
    justify-content: space-between;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s; }
    .digital-life .videos-wrapper .ui-overlay .btn {
      background: #FFCF82;
      border-radius: 20px; }
    .digital-life .videos-wrapper .ui-overlay .lang-spanish {
      opacity: 0.5; }

.digital-life .read-more-btn {
  background: #FFCF82;
  border-radius: 20px; }

.digital-life .english-btn, .digital-life .spanish-btn {
  background: #ffeccf;
  border-radius: 20px; }
  .digital-life .english-btn.active, .digital-life .spanish-btn.active {
    background: #FFCF82; }
  .digital-life .english-btn:not(.active), .digital-life .spanish-btn:not(.active) {
    border: 2px solid #FFCF82;
    color: #76a7bb; }

.digital-life #banner {
  width: auto;
  max-width: 450px;
  height: 36px;
  position: relative;
  background: #FFCF82;
  padding: 2px;
  margin: 0 auto; }
  .digital-life #banner p {
    font-size: 12px; }
  .digital-life #banner::after, .digital-life #banner::before {
    content: "";
    position: absolute;
    bottom: 0;
    top: 0;
    width: 0;
    height: 0;
    border-left: 13px solid #fff;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent; }
  .digital-life #banner::after {
    left: 0; }
  .digital-life #banner::before {
    transform: rotate(180deg);
    right: 0px; }

.social-emotional .header-container {
  background-image: url("../images/marketing-landing/social-emotional/social-emotional-header.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 540px; }
  .social-emotional .header-container .header-bg {
    background-color: rgba(0, 0, 0, 0.6); }
  .social-emotional .header-container .a2l-logo {
    width: 90px; }
  .social-emotional .header-container .header-heading {
    font-size: 42px; }
  .social-emotional .header-container .header-description {
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.4); }

.social-emotional .bullet-points li {
  background: url("../images/icons/tick-orange.png") no-repeat left 5px;
  list-style-type: none;
  padding-left: 25px;
  font-size: 18px;
  color: #555;
  margin-right: 60px;
  flex: 1; }
  .social-emotional .bullet-points li:last-child {
    margin-right: 0px;
    flex: unset; }

.social-emotional .video-wrapper {
  background-size: cover;
  background-position: center;
  height: 230px;
  width: 100%;
  overflow: hidden;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px; }
  .social-emotional .video-wrapper .play-btn {
    width: 100%; }

.social-emotional .video-title {
  height: 75px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #E3F2EC; }

.social-emotional #banner {
  height: 36px;
  position: relative;
  background: #FFCF82;
  padding: 2px;
  margin: 0 auto; }
  .social-emotional #banner p {
    padding: 6px 0px;
    font-size: 14px; }
  .social-emotional #banner::after, .social-emotional #banner::before {
    content: "";
    position: absolute;
    bottom: 0;
    top: 0;
    width: 0;
    height: 0;
    border-left: 13px solid #fff;
    border-top: 18px solid transparent;
    border-bottom: 18px solid transparent; }
  .social-emotional #banner::after {
    left: 0; }
  .social-emotional #banner::before {
    transform: rotate(180deg);
    right: 0px; }

.social-emotional .video-section .play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.social-emotional .video-section .programs-thumbnails {
  max-height: 70px; }

.social-emotional .ui-card {
  height: 200px;
  box-shadow: 0px 0px 9px -3px darkgrey;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center; }

.social-emotional .mask-background {
  background: url(/images/marketing-landing/social-emotional/mask-logo.png);
  background-size: cover;
  width: 600px;
  height: 600px;
  position: absolute; }

.social-emotional .mask-left {
  left: 0px;
  transform: translate(-55%, -24%); }

.social-emotional .mask-right {
  right: 0px;
  transform: translate(55%, -24%); }
