
/** Font circular */
@font-face {
	font-family: "EFCircularWeb Bold Web";
	src: url("/assets/fonts/EFCircularWeb-Bold.eot");
	src: url("/assets/fonts/EFCircularWeb-Bold.woff") format("woff"),
		 url("/assets/fonts/EFCircularWeb-Bold.woff2") format("woff2");
}
@font-face {
	font-family: "EFCircularWeb Bold Italic Web";
	src: url("/assets/fonts/EFCircularWeb-BoldItalic.eot");
	src: url("/assets/fonts/EFCircularWeb-BoldItalic.woff") format("woff"),
		 url("/assets/fonts/EFCircularWeb-BoldItalic.woff2") format("woff2");
}
@font-face {
	font-family: "EFCircularWeb Book Web";
	src: url("/assets/fonts/EFCircularWeb-Book.eot");
	src: url("/assets/fonts/EFCircularWeb-Book.woff") format("woff"),
		 url("/assets/fonts/EFCircularWeb-Book.woff2") format("woff2");
}
@font-face {
	font-family: "EFCircularWeb Book Italic Web";
	src: url("/assets/fonts/EFCircularWeb-BookItalic.eot");
	src: url("/assets/fonts/EFCircularWeb-BookItalic.woff") format("woff"),
		 url("/assets/fonts/EFCircularWeb-BookItalic.woff2") format("woff2");
}

/* CSS RESET */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
body {line-height: 1;} ol,ul {list-style: none;} blockquote,q {quotes: none;}
blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
strong { font-weight: bold; }

/**
 * class.ef.com
 */


html { font-family: EFCircularWeb Book Web, sans-serif; font-size: 62.5%; /* children: 1rem ~= 10px */ line-height: 1.4; }
body { color: #284155; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/**
 * Grid system - mobile first
 * https://github.com/mourner/dead-simple-grid
 */
.container { margin: 0 auto; padding: 1rem 0;}
.row .row { margin:  0 -1.5rem; }
.col { padding: 0  1.5rem; }
.row:after { content: ""; clear: both; display: table; }
@media only screen { .col { float: left; width: 100%; box-sizing: border-box; }}

/* Headings */
h1 { font-family: EFCircularWeb Bold Web, sans-serif; color: #284155; }
h2 { font-family: EFCircularWeb Bold Web, sans-serif; color: #284155; }
h3 { font-family: EFCircularWeb Bold Web, sans-serif; }
.pretitle { font-family: EFCircularWeb Book Web, sans-serif; font-weight: regular; color: #284155; text-transform: uppercase; letter-spacing: 8px; }
.subtitle { font-family: EFCircularWeb Book Web, sans-serif; font-weight: regular; color: #284155; max-width: 80rem; margin: auto; }
small { font-family: EFCircularWeb Book Web, sans-serif; font-weight: regular; color: rgba(239,239,239,0.6); font-size: 1.2rem; }

/* quotes */
blockquote { border-left: 1px solid #284155; padding-left: 1rem; }
blockquote footer { color: #284155; }
blockquote footer .name { font-weight: bold; }

/* figures */
figure { margin: 0; display: inline-block; width: 100%; height:100%; }
figure figcaption { font-family: EFCircularWeb Book Web, sans-serif; text-align: center; color: #284155; }

/* Forms */
label { display: block; margin-bottom: 0.5rem; padding-left: 0.4rem; font-family: EFCircularWeb Book Web; color: #ffffff; font-weight: 600; text-transform: uppercase; font-size: 1.4rem; letter-spacing: 1px;}
input, select { font-size: 1.6rem; border: none; border-bottom: 1px solid #7F8D98; background: transparent; color: #ffffff; font-family: EFCircularWeb Book Web; border-radius: 0; padding: 1rem; transition: 0.4s ease;}
select { -moz-appearance: none; -webkit-appearance: none; border: none; border-bottom: 1px solid #7F8D98; color: #7F8D98; background-image: url("/assets/images/chevron-down-grey.svg"); background-repeat: no-repeat; background-position: right 1.5rem center; padding-right: 3rem; width: 104% !important;}
input:hover, select:hover { background-color: rgba(255,255,255,0.05); border-bottom: 1px solid #ffffff; transition: 0.4s ease; }
/* @todo: move this! */
input, select { width: 100%; }
input[type=submit] { width: auto; }
input::-webkit-input-placeholder { color: #7F8D98; }
input:focus, select:focus { background-color: rgba(255,255,255,0.05); border-bottom: 1px solid #ffffff; outline: none; }

/* Links */
a, a:visited { position: relative; font-family: EFCircularWeb Book Web, sans-serif; text-decoration: none; color: #4B96CC; cursor: pointer; }
a:after { content: ''; position: absolute; bottom: -4px; left: 0; width: 0%; border-bottom: 1px solid #6FABD6; transition: 0.6s; }
a:hover:after { width: 100%; }
a:hover { color: #6FABD6; }
a:active { color: #3C78A3; }
a.external { background: url(/assets/images/arrow-forward.svg) center right no-repeat; padding-right: 2.1rem; line-height: 2.8rem; }
a.download { background: url(/assets/images/arrow-download.svg) center right no-repeat; padding-right: 2.1rem; line-height: 2.8rem; }
a.next, a.top { display: inline-block; border: none; height: 3.2rem; width: 3.2rem; border-radius: 50%; cursor: pointer; }

a.secondary, a.secondary:visited { background-color: transparent; box-shadow: inset 0 0 0 1px #284155; color: #284155; }
a.secondary:hover { background-color: rgba(255,255,255,0.2); box-shadow: inset 0 0 0 1px #898F93; }
a.secondary:active { background-color: #F8F8F8; box-shadow: inset 0 0 0 1px #565C60; }
a.subtitle-link { font-family: EFCircularWeb Book Web, serif; font-style: italic; color: #4B96CC; }
a.subtitle-link:hover { color: #6FABD6; }

/* Buttons */
button, .button { display: inline-block; border: none; height: 3.9rem; text-align: center; padding: 0 2rem; font-family: EFCircularWeb Book Web, sans-serif; font-size: 1.4rem; line-height: 4rem; color: #F8F8F8; border-radius: 0.2rem; text-transform: uppercase; cursor: pointer; font-weight: 600; -webkit-appearance: none; transition: 0.4s; }
button.primary, .button.primary, .button.primary:visited { color: #F8F8F8; background-color: #4B96CC; color: #F8F8F8; border: none; }
button.primary:hover, .button.primary:hover { background-color: #6FABD6; color: #F8F8F8; border: none; }
button.primary:hover::after, .button.primary:hover::after, button.secondary:hover::after, .button.secondary:hover::after { border-bottom: none; }
button.primary:after, .button.primary:after, button.secondary:after, .button.secondary:after { display: none; }
button.primary:active, .button.primary:active { background-color: #3C78A3; color: #F8F8F8; border: none; }
button.primary:disabled, button.primary:disabled:hover, .button.primary:disabled, .button.primary:disabled:hover { background-color: #4B96CC; opacity: 0.4; cursor: default;}

button.secondary { color: #284155; background-color: transparent; box-shadow: inset 0 0 0 1px #284155; }
button.secondary:hover { color: #284155; background-color: #F8F8F8; border: none; }
button.secondary:active {color: #565C60; background-color: #F8F8F8; border: none; }
button.secondary:disabled, button.secondary:disabled:hover {color: #6C7378; box-shadow: inset 0 0 0 1px #6C7378; opacity: 0.1; cursor: default; }
a.button.secondary { border-bottom: none; font-weight: 400; }

button.tertiary, .button.tertiary, .button.tertiary:visited { color: #F8F8F8; background-color: #43A874; color: #F8F8F8; border: none; }
button.tertiary:hover, .button.tertiary:hover { background-color: #68B98F; color: #F8F8F8; border: none; }
button.tertiary:hover::after, .button.tertiary:hover::after { border-bottom: none; }
button.tertiary:after, .button.tertiary:after { display: none; }
button.tertiary:active, .button.tertiary:active { background-color: #43A874; color: #F8F8F8; border: none; }
button.tertiary:disabled, button.tertiary:disabled:hover, .button.tertiary:disabled, .button.tertiary:disabled:hover { background-color: #43A874; opacity: 0.4; cursor: default;}

/* Splash section */
.splash { position: relative; margin-bottom: -6.4rem; padding-top: 2.5rem; padding-bottom: 5.8rem; text-align: center; transition: 0.5s; min-height: 67rem; }
.splash div.container.row { padding-bottom: 0; }
.splash * { transition: none; }
.splash h1 { font-size: 5.8rem; line-height:1.2; color: #FFFFFF;  }
.splash h2 { color: #FFFFFF; }
.splash p.pretitle { font-size: 1.4rem; max-width: 60%; color: rgba(239,239,239,0.6); }
.splash p.subtitle { max-width: 60%; color: rgba(250,250,250,0.8); }

.splash-block-container { background-color: #284155; position: absolute; width: 100%; height: 100%; min-height: 67rem; top: 0; background-position: top center no-repeat; background-size: cover; overflow: hidden; }
.splash-block-top { width: 1200px; position: absolute;  top: -2240px; left: 0px; -webkit-transform: rotate(-101.5deg); opacity: 0.4; -webkit-filter: blur(48px); }
.splash-block-right { height: 1200px; position: absolute;  top: -100px; right: -220px; -webkit-transform: rotate(11.5deg); opacity: 0.4; -webkit-filter: blur(48px); }
.splash-block-bottom { width: 1200px; position: absolute;  bottom: -2300px; left: -120px; -webkit-transform: rotate(101.5deg); opacity: 0.4; -webkit-filter: blur(48px); }
.splash-block-left { height: 1200px; position: absolute;  top: -100px; left: -120px; -webkit-transform: rotate(-11.5deg); opacity: 0.4; -webkit-filter: blur(48px); }

video { position: absolute; opacity: 0.10; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translateX(-50%) translateY(-50%); }

/* Splash video section */
.splash-video { top: 0; position: relative; padding-top: 2.5rem; padding-bottom: 5.8rem; text-align: center; transition: 0.5s; min-height: 67rem; overflow: hidden; }
.splash-video div.container.row { padding-bottom: 0; width: 80%; }
.splash-video * { transition: none; }
.splash-video h1 { font-size: 6.4rem; line-height:1.2; color: #FFFFFF;  }
.splash-video h2 { color: #FFFFFF; }
.splash-video p.pretitle { font-size: 1.4rem; max-width: 60%; color: rgba(239,239,239,0.6); }
.splash-video p.subtitle { max-width: 60%; color: rgba(250,250,250,0.8); }

/* Splash video popover */
.splash-video-popover { z-index: 5000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background-color: rgba(40,65,85,0.95); -webkit-backdrop-filter: blur(16px); }
.splash-video-popover-card { width: 90%; margin: 5% auto; background-color: rgba(255, 255, 255, 0.8); border-radius: 2px; text-align: center; }
.splash-video-popover .col {width: 90% !important; margin: 5%; }
.splash-video-popover h3 { font-size: 3.2rem; font-family: EFCircularWeb Bold Web, sans-serif; font-weight: normal; color: #284155; line-height: 1.1; margin-top:3.2rem;  }
.splash-video-popover h3, .mobile-popover p, .mobile-popover figure { text-align: center; }
.splash-video-popover img { width: 90%; }
.splash-video-popover a#splash-video-popover-close { min-width: 16rem; margin: 0 auto 3.2rem auto; }

/* Main Navigation */
nav.main { line-height: 4rem; height: 4rem; text-align: right; }
nav.main li { display: inline; }
nav.main a, nav.main a:visited { font-family: EFCircularWeb Book Web, sans-serif; text-transform: uppercase; font-size: 1.4rem; color: #284155; margin-right: 3.6rem; }
nav.main a:hover { border-bottom: 1px solid #898F93; color: #898F93; transition: 0.4s; }
nav.main a:active { border-bottom: 1px solid #565C60; color: #565C60; }
nav.main a.ef-class-brand { border-bottom: none; display: inline; float: left; width: 18rem; height: 3.2rem; margin-top: 0.4rem; background: url("/assets/images/ef-class-logo-header-white.png") top left / auto no-repeat; background-size: 18rem 3.2rem; }
nav.main a.ef-class-brand:after { display: none; }
nav.main a.ef-class-brand:hover::after { border-bottom: none; }
nav.main a.button { border: none; border-bottom: none; margin-right: 1.6rem; }

nav.main a.button.secondary { color: #FFFFFF; background-color: transparent; box-shadow: inset 0 0 0 1px #FFFFFF; transition: 0.4s; }
nav.main a.button.secondary:hover { background-color: rgba(255,255,255,0.2); }

nav.main .menu { display: inline-block; }
nav.main .menu li:last-child a { margin-right: 0; }
nav.main { margin-bottom: 12.4rem; }
nav.main .ef-class-brand { float: left; display: inline; margin-top: 0.4rem; }

section.sub-nav { z-index: 1000; position: relative; margin: 0 auto; -webkit-backdrop-filter: blur(16px); color: #284155; text-align: center; }
.sub-nav .container.row { margin: 0 auto; padding: 3.2rem; }
.sub-nav ul { display: inline; width: 100%; padding: 3.2rem; border-bottom: 0.1rem solid #EFEFEF; }
.sub-nav li { display: inline; margin-left: 1.6rem; margin-right: 1.6rem; font-size: 1.4rem; text-transform: uppercase; }
.sub-nav li a { font-weight: 600; color: #284155; }
.sub-nav li a:hover { }

section.sub-nav.sub-nav-sticky.slide-down { padding-top: 0; padding-bottom: 0; }

.sub-nav-sticky { background-color: rgba(255,255,255,0.9) !important; z-index: 2; top: 0 !important; position: -webkit-sticky !important; position: sticky !important; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); }
.sub-nav-sticky li a { color: #284155; }
.sub-nav-sticky li a:hover { color: #284155; }
.sub-nav-sticky ul { text-align: right; display: inline-block; float: right;}
li#nav-sign-up.sub-nav-sign-up { margin-right: 0; }

section.sub-nav.sub-nav-sticky.slide-down li.hidden-on-scroll {display: none;}

/* Animate stuff */
.slide-down { animation-delay: 0.2s; animation: slidedown 0.4s ease-in-out; }
.slide-up { animation: slideup 0.4s ease; }

.hide { display: none !important; }

.scroll-indicator { margin: 0 auto; margin-bottom: 2.6rem; width: 3.1rem; height: 3.1rem; border-radius: 1.6rem; border: 1px solid #FFFFFF; -webkit-animation-delay: 2s; -webkit-animation: bounce 3s infinite ease-in-out; }
.scroll-indicator-chevron { width: 1.1rem; height: 0.7rem; padding-top: 1.2rem; }
p.next-button-label { margin-top: 12rem; font-size: 1.6rem; color: rgba(255,255,255,1); padding-bottom: 0.8rem; }

section.cookie-banner .container { padding: 1rem; }
section.cookie-banner { z-index: 1200; position: fixed; bottom:0; display: none; margin: 0 auto; background-color: rgba(40,65,85,0.9); color: #ffffff; text-align: center; line-height: 1; font-weight: 400; letter-spacing: 0.05rem; }
section.cookie-banner p { font-size: 1.2rem; line-height: 2.4; }
section.cookie-banner a { color: #FFFFFF; font-weight: 600; text-transform: uppercase; }
section.cookie-banner a:hover { color: #FFFFFF; }
section.cookie-banner a::after { border-bottom: 1px solid #FFFFFF; }
section.cookie-banner a.button { color: #FFFFFF !important; border: 1px solid #FFFFFF; padding: 0.4rem 0.8rem 0.4rem 0.8rem !important; margin-left: 0.8rem; height: auto; font-size: 1.2rem; line-height: 1.4; }
section.cookie-banner a.button:hover { background-color: rgba(255,255,255,0.1); color: #F8F8F8; }
section.cookie-banner a.button:hover::after { display: none; }

section.content-alert .container { padding: 1rem; }
section.content-alert .container p a { color: #FFFFFF; }
section.content-alert .container p a::after { display: none; }
section.content-alert { margin: 0 auto; margin-bottom: -0.5rem; background-color: #4B96CC; color: #ffffff; text-align: center; line-height: 1; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05rem; }
section.content-alert a.button { color: #4B96CC !important; background-color: #FFFFFF; border: none; padding: 0.8rem !important; margin-left: 2rem; height: auto; line-height: 1; }
section.content-alert a.button:hover { background-color: #6FABD6; color: #F8F8F8; border: none; }
section.content-alert a.button:hover::after { display: none; }

/* section: special event banner (change)  */
section.event-banner { margin: 0 auto; margin-top: -0.5rem; background-color: #4B96CC; color: #FFFFFF; text-align: left; line-height: 1.4; }
section.event-banner .container { }
.event-banner-message { padding-top: 1.6rem; padding-bottom: 1.2rem; float: left; width: 65%;}
.event-banner p { }
.event-banner p:first-of-type { font-weight: bold; }
.event-banner-logo { width: 6.4rem; height: 6.4rem; float: left; margin: 1.60rem; }
.event-banner a.button.primary { margin-right: 1.64rem; margin-left: 0rem; margin-top: 1.8rem; float: right; background-color: #FFFFFF; color: #4B96CC; }
.event-banner-button-group { width: 35%; float: right; }

/* section: special section (temporary)  */
section.promo-section { margin: 0 auto; margin-top: -0.5rem; background-color: #ffffff; text-align: center; line-height: 1.4; padding-top: 12.8rem; padding-bottom: 12.8rem; }
section.promo-section .container { padding: 0; }
.promo-section-message { padding-top: 1.6rem; padding-bottom: 1.2rem; width: 100%; }
.promo-section-logo { width: 12.8rem; height: 12.8rem; margin: 0 auto; text-align: center; }
.promo-section a.button.primary { min-width: 16rem; margin-right: 1.64rem; margin-left: 0rem; margin-top: 1.8rem; }
.promo-section a.button.primary:last-of-type { margin-right: 0; }
.promo-section-button-group { width: 100%; text-align: center; }
.promo-section-flag { width: 16rem; padding: 0.6rem; background: #44A874;color: #FFFFFF; font-size: 12px; font-weight: bold; margin: 0 auto; margin-top: 1.64rem; border-radius: 2px; text-transform: uppercase; }

/* section: competition */
.competition { padding-top: 6.4rem; padding-bottom: 6.4rem; background-color: #ffffff; color: #284155; text-align: center;}
.competition h2 { color: #284155;}
p span.alert { margin: 0 auto; padding: 0.8rem; font-weight: bold; color: #F0CB46; }
.competition img{width: 40rem;}

/* browser-not-supported-badges  */
ul.badge{width: 100%; display: flex; justify-content: center;}
.badge-browser-support{width: 20%; margin: 0 0.5rem}
.badge-browser-support img{width: 100%;}
li.badge-browser-support a{ border-bottom: 0px !important; transition: none; text-decoration: none; opacity:0.8; }
li.badge-browser-support a:hover{ border-bottom: 0px !important; transition: none; text-decoration: none; opacity:1; }
li.badge-browser-support a:after{ border-bottom: 0px !important; transition: none; text-decoration: none;}

/* section: product email updates */
section.product-email-updates{ overflow: hidden; background-color: #F8F8F8;}
.product-email-updates .section-showcase { width: 40%; height: 44rem; position: relative; float: right; overflow-x: hidden; margin-top: 17.4rem; margin-bottom: 17.4rem;  margin-right: -18.4rem;}
.product-email-updates .section-showcase img.primary { height: 100%; width: auto; position: absolute; top: 0; left: 0; }
.product-email-updates .section-text { width: 55%; margin-top: 10rem; float: left; }
.product-email-updates .section-text .row { margin-left: -1.5rem; margin-right: -1.5rem; }
.product-email-updates .button { margin-left: 1.5rem !important; width: 98% !important; }
.product-email-updates .section-text .col { width: 50%; }
.product-email-updates .section-text .breathe .button { width: 100%; }
.product-email-updates .mc-field-group label, .product-email-updates .mc-field-group input { color: #284155; font-family: EFCircularWeb Book Web, sans-serif; text-align: left!important;}
.product-email-updates .mc-field-group input:hover, .product-email-updates .mc-field-group input:focus { background: #F2F2F2; border-color: #284155; }

/* Mobile popover */
.mobile-popover { z-index: 1000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background-color: rgba(40,65,85,0.9); -webkit-backdrop-filter: blur(16px); }
.mobile-popover-card { width: 100%; margin: 5%; background-color: rgba(255, 255, 255, 0.9); border-radius: 2px; }
.mobile-popover h3 { font-size: 3.2rem; font-family: EFCircularWeb Bold Web, serif; font-weight: normal; color: #284155; line-height: 1.1; margin-top:3.2rem;  }
.mobile-popover h3, .mobile-popover p, .mobile-popover figure { text-align: center; }
.mobile-popover img { width: 90%; }

/* Syllabi popover */
.syllabi-popover { z-index: 1000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; margin: 0 auto; background-color: rgba(40,65,85,0.9); -webkit-backdrop-filter: blur(16px); }
.syllabi-popover-card { max-width: 60%; margin: 5% auto; background-color: rgba(255, 255, 255, 0.8); border-radius: 2px; text-align: center; }
.syllabi-popover .col {width: 90% !important; margin: 5%; }
.syllabi-popover h3 { font-size: 3.2rem; font-family: EFCircularWeb Bold Web, serif; font-weight: normal; color: #284155; line-height: 1.1; margin-top:3.2rem;  }
.syllabi-popover h3, .mobile-popover p, .mobile-popover figure { text-align: center; }
.syllabi-popover img { width: 90%; }
.syllabi-popover a#syllabi-popover-close { min-width: 14rem; margin: 0 auto 3.2rem auto; }

/* Global section: sign up */
.sign-up { padding-top: 17.4rem; padding-bottom: 17.4rem; }
.sign-up .col { width: 80%; margin-left:10%; }
.sign-up { background-color: #284155; color: #F8F8F8; text-align: center; }
.sign-up h2 { color: #F8F8F8; }
.sign-up .col { text-align: left; }
.sign-up .col.span { width: 100%; }
.sign-up-header { min-height: auto !important; }
.sign-up .accept-terms { color: #6c7378; }
.sign-up.sign-up-teacher .container { padding-bottom: 0; }
.sign-up.sign-up-student { background-color: #233a4c;}
.sign-up.recommending-social { background-color: #1f3445;}
.recommending-social .front-and-center a:hover { border-bottom: none; cursor: pointer; }
.recommending-social .front-and-center a:visited { border-bottom: none; cursor: pointer; }
div#mc_embed_signup { margin: 0 auto; }
div.ef-class-brand { border-bottom: none; width: 18rem; height: 3.2rem; margin: 0 auto; margin-top: 0.4rem; margin-bottom: 6.4rem; background: url("/assets/images/ef-class-logo-header-white@2x.png") top left / auto no-repeat; background-size: 18rem 3.2rem; }
section.sign-up.confirmation { padding-top: 3.2rem; }
.sign-up.skolforum{ padding-top: 3.2rem; }
.country-option { display: none; }

#post-message { display: none; padding-bottom: 12.8rem; }

.recommending-social a:hover { opacity: 0.8; transition: 0.4s ease-in-out}
.recommending-social a:after { display: none; }
.recommending-social a:hover::after { border-bottom: none;}
.social-media-buttons { margin: 0 1.6rem; }
.recommending-social p{ font-family: EFCircularWeb Book Web, sans-serif; font-weight: regular; color: rgba(255, 255, 255, 0.8); max-width: 80rem; margin: auto; margin-bottom: 4rem; }

/* section: terms and conditions styles */
/* section.terms { background-color: #ffffff; text-align: left; margin-top: 8rem; margin-bottom: 8rem; }
section.terms .container { margin-top: 3.2rem; margin-bottom: 3.2rem; }
section.terms ul li { margin-bottom: 1.6rem; }
section.terms ul li p:first-of-type { font-weight: 600; }
section.terms ul li ul { margin-left: 3.2rem; }
section.terms ul li ul li { list-style: circle; } */

/* Global footer / EF legal / brand */
body > footer { background-color: #1b2d3b; color: rgba(255, 255, 255, 0.8); text-align: center; padding-top: 10rem; padding-bottom: 10rem;}
.copyright { font-size: 1.6rem; font-family: EFCircularWeb Book Web, sans-serif; font-style: italic; color: #FFFFFF; }
.ef-brand { margin: 0 auto; width: 12rem; height: 8.3rem; margin-bottom: 6.4rem; background: url("/assets/images/footer-ef-logo.svg") top left / auto no-repeat; }


/**
 * Responsive layout base
 */

body { font-size: 1.6rem; line-height: 1.9rem; }
h1 { font-size: 6.2rem; line-height: 8.2rem; letter-spacing: 0.03rem; }
h2 { font-size: 4.6rem; line-height: 5.5rem; letter-spacing: 0.02rem; }
h3 { font-size: 1.6rem; line-height: 2.2rem; }
.subtitle { font-size: 1.8rem; line-height: 2.8rem; }

.container { padding: 1.5rem; max-width: 108rem; }

.breathe-a-little { margin-top: 1.6rem !important; }
.breathe { margin-top: 3.2rem !important; }
.breathe-a-lot { margin-top: 6.4rem !important; }
.signup-mobile{ display: none; margin-top: 1rem;}
.video-link{ color: #FFFFFF!important; background-color: transparent!important; box-shadow: inset 0 0 0 1px #FFFFFF!important; transition: 0.4s;}

body > section { display: inline-block; width: 100%; }
.front-and-center { text-align: center; display: inline-block; width: 80%; padding: 0 10%; margin: 0 auto 3.2rem auto; }

/* Global responsive stuff */

@media only screen and (max-width:1023px) {
  section.save-time { display: none; }
  li#nav-syllabi { display: none; }
  section.event-banner { padding-bottom: 1.6rem; }
  .event-banner-message { width: 55%; padding-bottom: 0; }
  .event-banner-button-group { width: 45%; }
  .event-banner a.button.primary { margin-top: 3rem; }
  .splash-block-container { max-height: none !important; }
}

@media only screen and (max-width:959px) {
  li#nav-contact { display: none; }
  .event-banner-message { width: 100%; float: none; text-align: center; }
  .event-banner-button-group { width: 100%; text-align: center; }
  .event-banner a.button.primary { margin-top: 1.8rem; margin-right: 1em; margin-left: 1rem; float: none; }
  section.event-banner .event-banner-message {width: 100%; text-align: center;}
  section.content-alert { display: none; }
  .product-email-updates .section-showcase, .testimonial-student .section-showcase { margin-right: -12rem; }
}

@media only screen and (max-width:767px) {
  .content-alert { display: none; }
  .container.row { width: auto !important; }
  a#mobile-link { display: block !important; }
  a#desktop-link { display: none !important; }
  li#nav-support, li#nav-get-started, li#nav-sign-in, li#nav-student-sign-up, li#nav-about { display: none; }
  nav.main a, nav.main a:visited { margin-right: 2.4rem; }
  nav.main .ef-class-brand { height: 4rem; }
  nav.main { margin-bottom: 9.6rem; }
  .sign-up .col { width: 80%; margin-left:10%; }
  .sign-up { padding-top: 6.4rem; padding-bottom: 6.4rem; }
  img.nobel-museum-logo { width: 90%; }
  .splash-video { margin-bottom: 0; padding-bottom: 0; min-height: auto; }
  .splash-video-popover div.container.row { width: 80% !important; }

  .product-email-updates { padding-bottom: 0; }
  .product-email-updates .section-text { width: 100%; margin: 6.4rem 0; }
  .product-email-updates .section-text h2.breathe-a-lot { margin-top: 0 !important; }
  .product-email-updates .section-showcase { display: none; }
  .product-email-updates .section-text .row { margin-right: 0; }
  .product-email-updates .button { padding: 0; margin-left: 0; }
  /* browser-not-supported-badges  */
  ul.badge{width: 100%; display: block; margin-bottom: 8rem;}
  .badge-browser-support{width: 100%; margin: .5rem 0;}
  .badge-browser-support img{width: 40%;}
}

@media only screen and (max-width:539px) {
  ul#nav-main-menu { display: none; }
  nav.main .ef-class-brand { float: none !important; display: inherit !important; margin: 0 auto !important; margin-top: 0.4rem !important; padding: 0 !important; }
  h1, .splash h1, .splash-video h1 { font-size: 4.8rem; line-height: 1.2 !important; }
  .breathe-a-lot { margin-top: 3.2rem !important; }
  nav.main { margin-bottom: 6.4rem; }
  .front-and-center { max-width: 80% !important;  }
  .col { padding: 1.5rem 1.5rem; }
  .sign-up .col { width: 100%; margin:0 !important; }
  .promo-section a.button.primary { width: 80%; margin-right: 0rem; margin-left: 0rem; margin-top: 1.8rem; }
  .signup-mobile{ display: inline-block; width: 75%;}
  .video-link{ display: inline-block; width: 75%; color: #FFFFFF!important; background-color: transparent!important; box-shadow: inset 0 0 0 1px #FFFFFF!important; transition: 0.4s;}
  .container { padding: 0;}
  .product-email-updates .section-text .col { width: 100%;}
  ul.badge{width: 100%; display: block; margin-bottom: 8rem;}
  .badge-browser-support{width: 100%; margin: .5rem 0;}
  .badge-browser-support img{width: 50%;}
}

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

@-webkit-keyframes bounce {
    0% { -webkit-transform: translate(0,0.6rem) scale(1); opacity: 1;}
    50% { -webkit-transform: translate(0,0.6rem) scale(1); opacity: 1; }
    60% { -webkit-transform: translate(0,1rem) scale(1); opacity: 1; }
    70% { -webkit-transform: translate(0,0.6rem) scale(1); opacity: 1; }
    80% { -webkit-transform: translate(0,1rem) scale(1); opacity: 1; }
    90% { -webkit-transform: translate(0,0.6rem) scale(1); opacity: 1; }
    100% { -webkit-transform: translate(0,0.6rem) scale(1); opacity: 1; }
}

@-webkit-keyframes slidedown {
    0% { -webkit-transform: translate(0,-1rem) scale(1); opacity: 0; }
    100% { -webkit-transform: translate(0,0) scale(1); opacity: 1; }
}

@-webkit-keyframes slideup {
    0% { -webkit-transform: translate(0,0) scale(1); opacity: 0; }
    100% { -webkit-transform: translate(0,0) scale(1); opacity: 1; }
}

@-webkit-keyframes lift {
    0% { -webkit-transform: translate(0,0) scale(1); opacity: 1; }
    100% { -webkit-transform: translate(0,-0.4rem) scale(1); opacity: 1; }
}
