.cta-links { padding-bottom: 6.4rem; }
.cta-links .col { width: 50%; text-align: left; margin-bottom: 1.6rem; }
.cta-links .col.link-web-app, .cta-links .col.secondary-cta { text-align: right; }
.mobile-menu .col { width: 100%; text-align: center; margin-bottom: 1.6rem; }
.mobile-menu { display: none; }

/* section: formative  */
.formative { margin: 0 auto; padding-top: 8.8rem; padding-bottom: 12.8rem; }
.formative .spotlight { width: 100%; margin: 0 auto; display: block; position: relative; clear: both; }
.formative .figure { max-width: 90%; }
.formative .spotlight img { height: auto; max-width: 100%; }
.formative .col { width: 50%; }
.formative .spotlight img.left, .formative .spotlight img.right { display: inline; }
.formative .front-and-center { max-width: 80% ; }
.formative .spotlight { width: 100%; height: 32rem; }

/* section: apps  */
.apps { margin: 0 auto; padding-top: 12.8rem; padding-bottom: 12.8rem; text-align: center; }
.apps .col { width: 50%; padding: 0 5%;}
.apps .subtitle { max-width: 60% ; text-align: center;}
.apps h3 {text-align: left;}
.apps p {line-height: 1.6; text-align: left;}
.badge{width: 100%; margin: 3rem 0rem;}
.badge img{width: auto;}
.download-badge { width: 18.8rem; height: 4.8rem; margin: 0rem; }
.download-badge:hover { background-color: rgba(255,255,255,0.2); transition: 0.4s ease-in-out; }
.badge:hover::after { border-bottom: none; }
.badge:after { display: none; }
a.badge:hover { border: none; border-bottom: none !important; transition: 0.4s ease-in-out;}
p.trouble-help {text-align: center;}
p.note { color: #6C7378; font-style: italic; text-align: left;}

/* section: spotlight */
.spotlight img.primary { width: 55rem; position: absolute; top: 0; left: 50%; margin-left: -27.5rem; z-index: 2; }
.spotlight img.secondary { height: 22rem; top: 4.5rem; z-index: 1; position: absolute; }
.spotlight img.secondary.right { right: 9rem; }
.spotlight img.secondary.left { left: 9rem; }

/* section: classroom */
.classroom { padding-top: 12.8rem; padding-bottom: 12.8rem; }
.classroom .container { padding-top: 0; padding-bottom: 0; }
.section-showcase { width: 50%; }
.section-showcase img.primary { width: 85%; }
.section-showcase img.secondary { margin-top: -0.5rem; margin-left: 14%; width: 57%; }
.section-showcase img.tertiary { margin-top: -0.5rem; width: 28%; vertical-align: top; }
.classroom .section-text { width: 50%; text-align: right; margin-top: 4.8rem; padding: 0 1.5rem !important; }

/* section: how is ef class free  */
.free { margin: 0 auto;padding-top: 8.8rem; padding-bottom: 12.8rem; line-height: 1.4; text-align: center;}
.free .section-text { width: 55%; margin: 0 auto; }
.free .section-text .row { margin-left: -1.5rem; margin-right: -1.5rem; }
.free p { padding-top: 0.8rem; }

/* section: awesome content */
.awesome-content { padding-bottom: 12.8rem; }
.awesome-content .section-showcase { width: 40%; height: 44rem; position: relative; float: right; overflow-x: hidden; margin-top: 12.8rem; margin-bottom: 12.8rem;  margin-right: -18.4rem;}
.awesome-content .section-showcase img.primary { height: 100%; width: auto; position: absolute; top: 0; left: 0; }
.awesome-content .section-text { width: 55%; margin-top: 10rem; float: left; }
.awesome-content .section-text .row { margin-left: -1.5rem; margin-right: -1.5rem; }
.awesome-content .section-text .col { width: 50%; }

/* section: save-time */
section.save-time {  }
.save-time .container { margin-top: 12.8rem; margin-bottom: 12.8rem; }
.save-time .col { width: 25%; }
.save-time figure { width: 24rem; text-align: center; }
.save-time figure img { width: 12.8rem; }

/* section: testimonial */
.testimonial-teacher .section-showcase { width: 25%; height: 45.2rem; float: left; overflow-x: visible; margin-top: 12.8rem; margin-bottom: 12.8rem; }
.testimonial-teacher .section-showcase img.primary { width: 200%; float: right; }
.testimonial-teacher .section-text { width: 50%; margin-top: 16.9rem; float: right; }
.testimonial-student .section-showcase { width: 40%; height: 45.2rem; overflow-x: hidden; position: relative; float: right; margin-top: 12.8rem; margin-bottom: 12.8rem; margin-right: -18rem; }
.testimonial-student .section-showcase img.primary { height: 100%; width: auto; position: absolute; top: 0; left: 0; }
.testimonial-student .section-text { width: 50%; margin-top: 27rem; float: left; }

/* sections with darker bgs */
.classroom, .promo-section, .awesome-content, .testimonial-teacher, .apps{ background-color: #F8F8F8 !important; }
.product-email-updates { background-color: #ffffff !important; }
/* sections with overflow */
section.awesome-content, section.testimonial-teacher, section.testimonial-student { overflow: hidden; }

@media only screen and (max-width: 1088px) {
  .sub-nav ul li:first-child { display: none; }
}

@media only screen and (max-width:1023px) {
  .splash h1 { line-height: 7.2rem; }
  .splash-block-container { max-height: 92.5rem; }
  section.save-time { display: none; }
  .event-text{  padding-top: 0;}
}

@media only screen and (max-width:959px) {
  .splash h1 { line-height: 7.2rem; }
  .splash-block-container { max-height: 88.5rem; }
  section.sub-nav { display: none; }
  .awesome-content .section-text h2.breathe-a-lot { margin-top: 0 !important; }
  .awesome-content .section-showcase, .testimonial-student .section-showcase { margin-right: -12rem; }
  .awesome-content .section-text h2.breathe-a-lot { margin-top: 0 !important; }
  .awesome-content .section-showcase, .testimonial-student .section-showcase { margin-right: -12rem; }

}

@media only screen and (max-width:767px) {

  .splash { max-height: 86rem; }

  section.sub-nav { display: none; }

  section.event-banner { margin-top: 0rem;}

  .promo-section { padding-top: 3rem !important; padding-bottom: 3rem !important; }
  .formative { padding-top: 3rem; }
  .apps .col { width: 100%; }
  .formative .col { width: 100%; padding: 1.5rem 3rem; }
  section.formative { padding-bottom: 0 !important; }
  .spotlight img.secondary.left { left: 4rem; }
  .spotlight img.secondary.right { right: 4rem; }

  .section-showcase { width: 100%; }
  .section-showcase img.primary { width: 100%; margin-bottom: 3.2rem; }
  .section-showcase img.secondary, .section-showcase img.tertiary { display: none; }

  .classroom { padding-top: 8rem;   padding-bottom: 0; }
  .classroom .section-text { width: 100%; padding: 0; margin-bottom: 6.4rem; }

  .free { width: 100%; padding: 0; text-align: left; }
  .free h2, .free p { padding: 0; text-align: left; }
  .free .section-text { width: 100%; margin: 0 auto; }

  .awesome-content { padding-bottom: 0; }
  .awesome-content .section-text { width: 100%; margin: 6.4rem 0; }
  .awesome-content .section-text h2.breathe-a-lot { margin-top: 0 !important; }
  .awesome-content .section-showcase { display: none; }

  .testimonial-teacher .section-showcase { display: none; }
  .testimonial-teacher .section-text { width: 100%; margin: 6.4rem 0; }
  .testimonial-teacher blockquote.section-text { border: none !important; }

  .testimonial-student .section-showcase { display: none; }
  .testimonial-student .section-text { width: 100%; margin: 6.4rem 0; }
  .testimonial-student blockquote.section-text { border: none !important; }


}

@media only screen and (max-width:698px) {

  .formative .spotlight img.left, .formative .spotlight img.right { display: none; }

}

@media only screen and (max-width:539px) {

  body, section.classroom .section-text, section.free, section.free h2, section.free p { text-align: center !important; }

  section.alert { display: none; }
  .splash { padding-bottom: 0rem; }

  .splash-block-top { width: 1200px; position: absolute;  top: -2360px; left: 0px; -webkit-transform: rotate(-101.5deg); opacity: 0.3; -webkit-filter: blur(32px)}
  .splash-block-right { height: 1200px; position: absolute;  top: -100px; right: -300px; -webkit-transform: rotate(11.5deg); opacity: 0.3; -webkit-filter: blur(32px)}
  .splash-block-bottom { width: 1200px; position: absolute;  bottom: -2360px; left: -120px; -webkit-transform: rotate(101.5deg); opacity: 0.3; -webkit-filter: blur(32px)}
  .splash-block-left { height: 1200px; position: absolute;  top: -100px; left: -300px; -webkit-transform: rotate(-11.5deg); opacity: 0.3; -webkit-filter: blur(32px)}

  .download-badge { margin-top: 0.8rem; margin-bottom: 0.8rem; }

  p.next-button-label { margin-top: 3.2rem; }
  /*p.next-button-label { display: none; }
  .scroll-indicator { display: none !important; }*/

  section.event-banner { margin-top: -4.6rem; }
  .event-banner-logo { float: none; }

  .section-showcase img.primary { width: 100%; margin-bottom: 0 !important; }

  .cta-links { display: none; }
  .mobile-menu { display: block; }
  .formative .col { width: 100%; }
  .formative .spotlight { height: auto; }
  .formative .spotlight img.left { display: none; }
  .formative .spotlight img.left, .formative .spotlight img.right { display: none; }
  .spotlight img.primary { width: 100%; top: 0; left: 0 !important; margin-left: 0 !important; z-index: 2; position: relative; height: auto; }
  .awesome-content .section-text .col { width: 100% }

  .skolforum-event{ width: 100%; padding: 0;}
  .event-image{ width: 30%; height: auto;}
  .event-text{  width: 60%; padding-top: 0;}

}

@media only screen and (max-width:319px) {

.scroll-indicator { display: none !important; }

section.event-banner { margin-top: -4.2rem; }

}

@-webkit-keyframes floattop {
    0% {  -webkit-transform: rotate(-101.5deg); opacity: 0.3; }
    50% {  -webkit-transform: rotate(-106.5deg) scale(1.1); opacity: 0.4; }
    100% { -webkit-transform: rotate(-101.5deg); opacity: 0.3; }
}

@-webkit-keyframes floatright {
    0% {  -webkit-transform: rotate(11.5deg); opacity: 0.3; }
    50% {  -webkit-transform: rotate(16.5deg) scale(1.1); opacity: 0.4; }
    100% { -webkit-transform: rotate(11.5deg); opacity: 0.3; }
}

@-webkit-keyframes floatbottom {
    0% {  -webkit-transform: rotate(101.5deg); opacity: 0.3; }
    50% {  -webkit-transform: rotate(106.5deg) scale(1.1); opacity: 0.4; }
    100% { -webkit-transform: rotate(101.5deg); opacity: 0.3; }
}

@-webkit-keyframes floatleft {
    0% {  -webkit-transform: rotate(-11.5deg); opacity: 0.3; }
    50% {  -webkit-transform: rotate(-16.5deg) scale(1.1); opacity: 0.4; }
    100% { -webkit-transform: rotate(-11.5deg); opacity: 0.3; }
}