@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
@import url('https://fonts.googleapis.com/css?family=Montserrat:400normal');
/**
 * @license
 * MyFonts Webfont Build ID 2781865, 2014-03-26T08:13:07-0400
 *
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are
 * explicitly restricted from using the Licensed Webfonts(s).
 *
 * You may obtain a valid license at the URLs below.
 *
 * Webfont: Brandon Text Bold Italic by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/bold-italic/
 *
 * Webfont: Brandon Text Bold by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/bold/
 *
 * Webfont: Brandon Text Italic by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/italic/
 *
 * Webfont: Brandon Text Regular by HVD Fonts
 * URL: http://www.myfonts.com/fonts/hvdfonts/brandon-text/regular/
 *
 *
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2781865
 * Licensed pageviews: 10,000
 * Webfonts copyright: Copyright (c) 2012 by Hannes von Doehren. All rights reserved.
 *
 * © 2014 MyFonts Inc
*/
/* @import must be at top of file, otherwise CSS will not work */
@font-face {
  font-family: 'BrandonText';
  font-weight: bold;
  font-style: italic;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_0_0-b0MaAiY_fM1vKt5IvHVdNm14f00.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_0_0-b0MaAiY_fM1vKt5IvHVdNm14f00.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_0_0-fSfxUFHta8vQKiyT-xtNvOaNaMI.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_0_0-k5DJPU03lKVmhn2oVbY_OH2-xvA.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: bold;
  font-style: normal;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_1_0-2IbevvmSoXsCQYk4t0GTYNkS41k.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_1_0-2IbevvmSoXsCQYk4t0GTYNkS41k.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_1_0-vwY8mr4HzYGwTDV9XBmIIMA9NuI.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_1_0-yiXqHs9dJqoGWYCsKRDurWl1T8o.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: normal;
  font-style: italic;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_2_0-N6zvBqUPcBQF9HGXDO3SRdQbGsY.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_2_0-N6zvBqUPcBQF9HGXDO3SRdQbGsY.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_2_0-CutgwexTr8gmr5a_68Ue9_w9PH4.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_2_0-U3-fDFE9slc_4xuJWRG-_E5-qnY.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: normal;
  font-style: normal;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_3_0-8TkGdoj_i1NZEjdCVpmCas2TgdI.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_3_0-8TkGdoj_i1NZEjdCVpmCas2TgdI.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_3_0-SJ-Fp4uvL4AdQOfDLa224d3Ae3s.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2A72A9_3_0-1fYddpuxSEn4zuCFlrRETcNG50I.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: lighter;
  font-style: italic;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_0_0-HvA8J92ajiVfUf9VxgUkFwA2JBk.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_0_0-HvA8J92ajiVfUf9VxgUkFwA2JBk.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_0_0-0QoV9A1h9ouSXXr3kj15I_nDgVA.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_0_0-QgmicfNFrsg19aO3CsParWJAZDw.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: lighter;
  font-style: normal;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_1_0-z8vf6a9ns_z0AbOiOj0SGrZ-nno.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_1_0-z8vf6a9ns_z0AbOiOj0SGrZ-nno.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_1_0-vQIhMwZ5DSi41VIQvArZoR8L-RI.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_1_0-lJNzZ48llBC0uWlIIVMkAKVkPj8.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: 500;
  font-style: italic;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_5_0-hSrduvtG9eZrTHz_7KpaQmT2rCA.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_5_0-hSrduvtG9eZrTHz_7KpaQmT2rCA.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_5_0-Grynlq2hFMyXW5NZGufXrtoSYoE.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_5_0-jS-ntEVmJTzxYHMElzUOt1_HWUw.ttf') format('truetype');
}
@font-face {
  font-family: 'BrandonText';
  font-weight: 500;
  font-style: normal;
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_4_0-k5y5xh7l1i2ZPRc4OYzWxfL5hb0.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_4_0-k5y5xh7l1i2ZPRc4OYzWxfL5hb0.eot?#iefix') format('embedded-opentype'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_4_0-fVxBNcjtdW-sZw-jZoCeU0v5at4.woff') format('woff'), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/2B7344_4_0-uTIlhiq03NmT3c3CwVSXwzfzPEY.ttf') format('truetype');
}
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}
/**
 * Remove default margin.
 */
body {
  margin: 0;
}
/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}
/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}
/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}
/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}
/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent;
}
/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}
/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}
/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}
/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}
/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}
/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}
/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}
/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}
/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}
/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}
/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}
/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}
/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}
/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}
/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}
/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}
/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}
/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}
/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}
/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}
/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}
/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}
/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}
/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td,
th {
  padding: 0;
}
.tipsy {
  font-size: 14px;
  position: absolute;
  padding: 5px;
  z-index: 100000;
}
.tipsy-inner {
  background-color: #000;
  color: #FFF;
  max-width: 200px;
  padding: 5px 8px 4px 8px;
  text-align: center;
}
/* Rounded corners */
.tipsy-inner {
  border-radius: 3px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
/* Uncomment for shadow */
/*.tipsy-inner { box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; }*/
.tipsy-arrow {
  position: absolute;
  width: 0;
  height: 0;
  line-height: 0;
  border: 5px dashed #000;
}
/* Rules to colour arrows */
.tipsy-arrow-n {
  border-bottom-color: #000;
}
.tipsy-arrow-s {
  border-top-color: #000;
}
.tipsy-arrow-e {
  border-left-color: #000;
}
.tipsy-arrow-w {
  border-right-color: #000;
}
.tipsy-n .tipsy-arrow {
  top: 0px;
  left: 50%;
  margin-left: -5px;
  border-bottom-style: solid;
  border-top: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-nw .tipsy-arrow {
  top: 0;
  left: 10px;
  border-bottom-style: solid;
  border-top: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-ne .tipsy-arrow {
  top: 0;
  right: 10px;
  border-bottom-style: solid;
  border-top: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-s .tipsy-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-top-style: solid;
  border-bottom: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-sw .tipsy-arrow {
  bottom: 0;
  left: 10px;
  border-top-style: solid;
  border-bottom: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-se .tipsy-arrow {
  bottom: 0;
  right: 10px;
  border-top-style: solid;
  border-bottom: none;
  border-left-color: transparent;
  border-right-color: transparent;
}
.tipsy-e .tipsy-arrow {
  right: 0;
  top: 50%;
  margin-top: -5px;
  border-left-style: solid;
  border-right: none;
  border-top-color: transparent;
  border-bottom-color: transparent;
}
.tipsy-w .tipsy-arrow {
  left: 0;
  top: 50%;
  margin-top: -5px;
  border-right-style: solid;
  border-left: none;
  border-top-color: transparent;
  border-bottom-color: transparent;
}
#jsonp-error {
  z-index: 2;
  position: fixed;
  left: 50%;
  top: 0;
  width: 650px;
  margin-left: -325px;
  padding: 0 1em;
  height: 3em;
  line-height: 3em;
  background-color: #ffffc0;
  color: #7c6d1f;
}
#jsonp-error em {
  font-weight: bold;
  color: #534915;
}
#jsonp-error .retry {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  background: #ffd600;
  text-decoration: none;
  color: inherit;
  height: 3em;
  line-height: 3em;
  margin: auto;
  padding: 0 1em;
}
#jsonp-error .retry:hover {
  background-color: #e6c100;
  cursor: pointer;
}
.section {
  margin: 0 0 1.5em;
}
.element {
  margin-bottom: 3em;
}
.element-header {
  margin-bottom: 1.5em;
  font-size: 1.33em;
}
.element-group {
  margin-bottom: 2em;
}
.element-example {
  margin-bottom: 1.5em;
}
.color-palette {
  margin-bottom: 1.5em;
  margin-left: -1em;
}
.color-palette > div {
  position: relative;
  display: inline-block;
  width: 120px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  margin: 0 0 1em 1em;
}
.color-palette > div .sample,
.color-palette > div .sample > div {
  text-align: center;
  line-height: 40px;
  height: 40px;
}
.color-palette > div .name {
  position: absolute;
  bottom: -0.3em;
  display: block;
  color: black;
  font-size: .8125em;
  line-height: 1;
  height: 1px;
}
.color-palette > div .triple-color > div {
  float: left;
  width: 40px;
}
.color-palette > div .double-color > div {
  float: left;
  width: 60px;
}
.color-palette > div .stroke-fill div {
  float: left;
  width: 40px;
}
.color-palette > div.paper {
  background-color: #fcfcfc;
}
.color-palette > div.ink {
  background-color: #333333;
}
.color-palette > div.header-background {
  background-color: #ffffff;
}
.color-palette > div.primary-action .base {
  background-color: #22394e;
  color: #fcfcfc;
}
.color-palette > div.primary-action .darker {
  background-color: #1a2c3c;
  color: #fcfcfc;
}
.color-palette > div.primary-action .darkest {
  background-color: #131f2a;
  color: #fcfcfc;
}
.color-palette > div.optional-action .base {
  background-color: #555555;
  color: #fcfcfc;
}
.color-palette > div.optional-action .darker {
  background-color: #484848;
  color: #fcfcfc;
}
.color-palette > div.optional-action .darkest {
  background-color: #3b3b3b;
  color: #fcfcfc;
}
.color-palette > div.danger .base {
  background-color: #f02d2e;
  color: #fcfcfc;
}
.color-palette > div.danger .darker {
  background-color: #dc0d20;
  color: #fcfcfc;
}
.color-palette > div.danger .darkest {
  background-color: #cf0017;
  color: #fcfcfc;
}
.color-palette > div.hint .base {
  background-color: #ffe789;
  color: #333333;
}
.color-palette > div.hint .darker {
  background-color: #ffd223;
  color: #333333;
}
.color-palette > div.hint .darkest {
  background-color: #bc9600;
  color: #333333;
}
.color-palette > div.hint {
  background-color: transparent;
  padding: 0;
}
.color-palette > div.ongoing {
  background-color: #cffadf;
}
.color-palette > div.disabled {
  background-color: transparent;
}
.color-palette > div.completed {
  background-color: #20b786;
}
.color-palette > div.new {
  background-color: #ffffc0;
}
.color-palette > div.inactive .fill {
  background-color: #e1e1e1;
  color: #333333;
}
.color-palette > div.inactive .stroke {
  background-color: #999999;
  color: #333333;
}
.color-palette > div.inactive .stroke.darker {
  background-color: #858585;
  color: #333333;
}
.color-palette > div.focus .fill {
  background-color: #eeeeee;
  color: #333333;
}
.color-palette > div.focus .stroke {
  background-color: #389de0;
  color: #333333;
}
.color-palette > div.focus .stroke.darker {
  background-color: #198dcf;
  color: #333333;
}
.color-palette > div.positive .background {
  background-color: #b6fcd0;
  color: #333333;
}
.color-palette > div.positive .icon {
  background-color: #17ce7f;
  color: #333333;
}
.color-palette > div.negative .background {
  background-color: #ffc2bf;
  color: #333333;
}
.color-palette > div.negative .icon {
  background-color: #ef7071;
  color: #333333;
}
.color-palette > div.blockquote .background {
  background-color: #fff8e1;
  color: #333333;
}
.color-palette > div.blockquote .icon {
  background-color: #ffc108;
  color: #333333;
}
.color-palette > div.pre-code .background {
  background-color: #efebe9;
  color: #333333;
}
.color-palette > div.pre-code .icon {
  background-color: #6d4c41;
  color: #333333;
}
.color-palette > div.info .background {
  background-color: #ffffc0;
  color: #333333;
}
.color-palette > div.info .icon {
  background-color: #ffd600;
  color: #333333;
}
.color-palette > div.special .background {
  background-color: #b6bec4;
  color: #333333;
}
.color-palette > div.special .icon {
  background-color: #65727c;
  color: #333333;
}
.color-palette > div.exercise-background {
  background-color: #fcfcfc;
}
.color-palette > div.video-background {
  background-color: #191919;
}
/* --------------------------------------------------------------------------
 * body and layout
 */
html {
  font-size: 16px;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.3;
  color: #333333;
  background-color: #fcfcfc;
}
.block-container {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1em;
}
@media (max-width: 900px) {
  .block-container {
    margin-left: 1em;
    margin-right: 1em;
  }
}
.block-container > .block-container {
  margin-left: auto;
  margin-right: auto;
}
.block-container > .last-child > ul.last-child {
  list-style-position: outside;
}
.immersive-background {
  margin: 0 -2em;
}
.immersive-background > .teaching-block {
  padding: 1em 2em;
}
.immersive-background *.teaching-block p {
  margin-bottom: 0;
}
.immersive-background > .grid {
  padding: 1em 2em;
}
.container {
  max-width: 54em;
  margin-left: auto;
  margin-right: auto;
}
.site-content {
  max-width: 54em;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  z-index: 0;
  margin-bottom: 1.5em;
  padding-top: 6em;
}
.site-content img {
  max-width: 100%;
  object-fit: cover;
}
/* --------------------------------------------------------------------------
 * standard elements
 */
a {
  text-decoration: none;
  border-bottom: 2px solid transparent;
  color: #389de0;
}
a:hover {
  border-color: #389de0;
}
a:visited {
  color: #660099;
}
a:visited:hover {
  border-color: #660099;
}
a.invisible {
  color: inherit;
  border: 0;
}
a.invisible:visited {
  color: inherit;
}
a.block {
  display: block;
}
p {
  margin-top: 0;
  margin-bottom: 1.5em;
}
ul,
ol {
  margin-bottom: 1.5em;
  margin-top: 0;
}
ul ul,
ol ul,
ul ol,
ol ol {
  margin-bottom: 0;
}
ol > li,
ul > li {
  margin-bottom: 0.75em;
}
ol > li > :last-child,
ul > li > :last-child,
ol > li > .last-child,
ul > li > .last-child {
  margin-bottom: 0;
}
code {
  background-color: #efebe9;
  padding: 0 .3em;
  font-size: 0.9em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.3;
}
code > :last-child,
code > .last-child {
  margin-bottom: 0;
}
pre {
  padding-top: 0.75em;
  padding-bottom: 0.75em;
  margin: 0 0 0.75em;
  clear: both;
  margin-left: 0;
  margin-right: 0;
  background-color: #efebe9;
}
pre > :last-child,
pre > .last-child {
  margin-bottom: 0;
}
pre code {
  display: block;
  padding: 0 0 0 1.66666667em;
}
* + pre {
  margin-top: -0.75em;
}
blockquote {
  zoom: 1;
  clear: both;
  margin-left: 0;
  margin-right: 0;
  padding-top: 0.75em;
  padding-bottom: 0.75em;
  margin: 0 0 0.75em;
  background-color: #fff8e1;
}
blockquote:after {
  content: "";
  display: table;
  clear: both;
}
blockquote > :last-child,
blockquote > .last-child {
  margin-bottom: 0;
}
blockquote > * {
  padding-left: 1.5em;
}
* + blockquote {
  margin-top: -0.75em;
}
img {
  -ms-interpolation-mode: bicubic;
}
@charset "UTF-8";
@font-face {
  font-family: "better-icon-font";
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/icon-font-_iqp4rJSlJcKBpJ1ReWjW5g8ci8.eot');
  src: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/icon-font-_iqp4rJSlJcKBpJ1ReWjW5g8ci8.eot?#iefix') format("embedded-opentype"), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/icon-font-Mlf4-eMwkyC1ud4rCb-Jngxphuk.woff') format("woff"), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/icon-font-KHNn6orGs-P3ISW2MY4piEgMBhw.ttf') format("truetype"), url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/fonts/icon-font-1xE8hN3FLM1K7wM7fIKaRypuaTs.svg#natalie-panda') format("svg");
  font-weight: normal;
  font-style: normal;
}
/* --- Icon Sizing

The characters in the Natalie-Panda icon font vertically span the
entire line-height, which starts on the baseline. Their middle line is
at half their height. We would like icons to be vertically centered
with capital letters. Since the ratio of cap-height to line-height is
different for different fonts, it is set as a skin-parameter. The size
of icons relative to a cap can be set here.  */
.icon {
  font-family: "better-icon-font" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 0.894em;
  position: relative;
  top: 0.08333333em;
}
.hint {
  display: inline-block;
  padding: .8em 1em;
  border-radius: .25em;
  background-color: #ffe789;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
}
.hint.fluid {
  display: block;
}
.hint > :last-child,
.hint > .last-child {
  margin-bottom: 0;
}
.hint.pointing {
  position: relative;
  *margin-bottom: 1em;
}
.hint.pointing .triangle {
  position: absolute;
  width: 0;
  height: 0;
  z-index: 2;
  border: 1em solid #ffe789;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
}
.hint.pointing.below .triangle {
  margin-left: -1em;
  top: auto;
  right: auto;
  bottom: -0.8em;
  left: 50%;
  border-bottom: 0;
  border-left-color: transparent;
  border-right-color: transparent;
}
.bttr.header {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
}
.bttr.header.skinned {
  color: #333333;
}
h1.bttr.header {
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  font-weight: bold;
}
h2.bttr.header {
  font-size: 1.4em;
  margin-top: 2.14285714em;
  margin-bottom: 1.07142857em;
}
h3.bttr.header {
  font-size: 1.3em;
  margin-top: 2.30769231em;
  margin-bottom: 1.15384615em;
}
h4.bttr.header {
  font-size: 1.2em;
  margin-top: 2.5em;
  margin-bottom: 1.25em;
}
div.button,
button.button {
  *display: inline;
  zoom: 1;
}
.button {
  -webkit-appearance: none;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  min-height: 1em;
  outline: 0;
  border: 1px solid black;
  margin: 0;
  padding: .8em 1.5em;
  font-size: 1em;
  line-height: 1;
  font-style: normal;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  border-radius: 0.125em;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  border-color: #22394e;
  background-color: #22394e;
  color: #fcfcfc;
}
.button.invisible {
  border-color: transparent !important;
  background-color: transparent !important;
}
.button.invisible:hover,
.button.invisible:active {
  border-color: transparent !important;
  background-color: transparent !important;
  cursor: inherit;
}
.button.mini {
  padding: .4em .7em .3em;
  font-size: .8em;
  border-radius: .3em;
}
.button.small {
  padding: .6em .8em;
  font-size: .9em;
}
.button.large {
  font-size: 1.33em;
}
.button.fluid {
  display: block;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}
.button > .icon {
  line-height: 1;
  margin-right: .6em;
  display: inline-block;
  height: 1em;
  vertical-align: top;
}
.button > .icon.right {
  margin: 0 0 0 .6em;
}
.button.icon {
  padding: .8em;
}
.button.icon.mini {
  padding: .4em .4em .3em;
}
.button.icon > .icon {
  margin: 0;
}
.button.centered {
  display: block;
  margin: 0 auto;
  text-align: center;
}
.button.wide {
  width: 60%;
}
.button:hover {
  border-color: #1a2c3c;
  background-color: #1a2c3c;
  color: #fcfcfc;
}
.button:active {
  border-color: #131f2a;
  background-color: #131f2a;
  color: #fcfcfc;
}
.button.outlined {
  border-color: #22394e;
  background-color: transparent;
  color: #22394e;
}
.button.outlined:hover {
  border-color: #22394e;
  background-color: #22394e;
  color: #fcfcfc;
}
.button.outlined:active {
  border-color: #131f2a;
  background-color: #131f2a;
  color: #fcfcfc;
}
.button.primary {
  border-color: #22394e;
  background-color: #22394e;
  color: #fcfcfc;
}
.button.primary:hover {
  border-color: #1a2c3c;
  background-color: #1a2c3c;
  color: #fcfcfc;
}
.button.primary:active {
  border-color: #131f2a;
  background-color: #131f2a;
  color: #fcfcfc;
}
.button.primary.outlined {
  border-color: #22394e;
  background-color: transparent;
  color: #22394e;
}
.button.primary.outlined:hover {
  border-color: #22394e;
  background-color: #22394e;
  color: #fcfcfc;
}
.button.primary.outlined:active {
  border-color: #131f2a;
  background-color: #131f2a;
  color: #fcfcfc;
}
.button.primary.invisible.outlined:hover,
.button.primary.invisible.outlined:active {
  color: #22394e;
}
.button.secondary {
  border-color: #555555;
  background-color: #555555;
  color: #fcfcfc;
}
.button.secondary:hover {
  border-color: #484848;
  background-color: #484848;
  color: #fcfcfc;
}
.button.secondary:active {
  border-color: #3b3b3b;
  background-color: #3b3b3b;
  color: #fcfcfc;
}
.button.secondary.outlined {
  border-color: #555555;
  background-color: transparent;
  color: #555555;
}
.button.secondary.outlined:hover {
  border-color: #555555;
  background-color: #555555;
  color: #fcfcfc;
}
.button.secondary.outlined:active {
  border-color: #3b3b3b;
  background-color: #3b3b3b;
  color: #fcfcfc;
}
.button.secondary.invisible.outlined:hover,
.button.secondary.invisible.outlined:active {
  color: #555555;
}
.button.danger {
  border-color: #f02d2e;
  background-color: #f02d2e;
  color: #fcfcfc;
}
.button.danger:hover {
  border-color: #dc0d20;
  background-color: #dc0d20;
  color: #fcfcfc;
}
.button.danger:active {
  border-color: #cf0017;
  background-color: #cf0017;
  color: #fcfcfc;
}
.button.danger.outlined {
  border-color: #f02d2e;
  background-color: transparent;
  color: #f02d2e;
}
.button.danger.outlined:hover {
  border-color: #f02d2e;
  background-color: #f02d2e;
  color: #fcfcfc;
}
.button.danger.outlined:active {
  border-color: #cf0017;
  background-color: #cf0017;
  color: #fcfcfc;
}
.button.danger.invisible.outlined:hover,
.button.danger.invisible.outlined:active {
  color: #f02d2e;
}
.button.disabled,
.button.disabled:hover,
.button.locked-for-page-lock,
.button.locked-for-page-lock:hover {
  cursor: default;
  border-color: #e1e1e1;
  background-color: #e1e1e1;
  color: #fcfcfc;
}
.button.disabled.outlined,
.button.disabled:hover.outlined,
.button.locked-for-page-lock.outlined,
.button.locked-for-page-lock:hover.outlined,
.button.disabled.outlined:hover,
.button.disabled:hover.outlined:hover,
.button.locked-for-page-lock.outlined:hover,
.button.locked-for-page-lock:hover.outlined:hover {
  border-color: #e1e1e1;
  background-color: transparent;
  color: #e1e1e1;
}
.buttons {
  zoom: 1;
}
.buttons:after {
  content: "";
  display: table;
  clear: both;
}
.buttons.fluid {
  width: 100%;
}
.buttons.fluid > .button {
  display: block;
  width: 100%;
}
.split-buttons {
  zoom: 1;
  clear: both;
  margin-bottom: 1.5em;
}
.split-buttons:after {
  content: "";
  display: table;
  clear: both;
}
.split-buttons > .button {
  padding-left: 0;
  padding-right: 0;
}
.split-buttons > .secondary.button {
  float: left;
  width: 39%;
}
.split-buttons > .primary.button {
  float: right;
  width: 59%;
}
.locale-change-buttons {
  margin: 1.5em 2em;
}
.locale-change-buttons .button {
  margin-bottom: .2em;
  text-align: left;
}
.locale-change-buttons .flag {
  margin-right: 1.5em;
  height: 1.6em;
  line-height: 1;
  display: block;
  float: left;
  position: relative;
  top: -1px;
  left: 1em;
}
.locale-change-buttons .text {
  line-height: 1.6em;
  display: inline-block;
  margin-left: .5em;
  height: 1.6em;
}
.locale-change-buttons .locales-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 1em;
  row-gap: normal;
}
@media only screen and (max-width: 600px) {
  .locale-change-buttons .locales-container {
    grid-template-columns: 1fr 1fr;
  }
}
@media only screen and (max-width: 400px) {
  .locale-change-buttons .locales-container {
    grid-template-columns: 1fr;
  }
}
.label {
  display: inline-block;
  vertical-align: middle;
  margin-top: -0.25em;
  padding: 0 .8em;
  border: 1px solid black;
  border-radius: 99em;
  font-size: .8125em;
  font-weight: 400;
  text-transform: uppercase;
}
.label > .icon {
  margin-right: .4em;
}
.label.green {
  border-color: #20b786;
  background-color: #20b786;
  color: #333333;
}
.label.blue {
  border-color: #ffffc0;
  background-color: #ffffc0;
  color: #333333;
}
.label.orange {
  border-color: #cffadf;
  background-color: #cffadf;
  color: #333333;
}
.label.disabled {
  border-color: transparent;
  background-color: transparent;
  color: #333333;
}
.message {
  position: relative;
  height: auto;
  background-color: #e1e1e1;
  padding: 0.75em 0.75em;
  color: #333333;
  margin-top: -0.75em;
  margin-bottom: 0.75em;
}
.message > :last-child,
.message > .last-child {
  margin-bottom: 0;
}
.message > :last-child,
.message > .last-child {
  margin-bottom: 0;
}
.message > div > :last-child,
.message > div > .last-child {
  margin-bottom: 0;
}
.message .header {
  zoom: 1;
  font-size: 1em;
  margin: 0 0 0.75em;
}
.message .header:after {
  content: "";
  display: table;
  clear: both;
}
.message .header:last-child,
.message .header.last-child {
  margin-bottom: 0;
}
.message .header span {
  font-size: 1.2em;
}
.message .header > .icon {
  font-size: 1.2em;
  display: inline-block;
  width: 1.875em;
  text-align: center;
  position: relative;
  left: -0.625em;
  margin-right: -0.625em;
}
.message .header > .button {
  float: right;
}
.message.error,
.message.negative {
  background-color: #ffc2bf;
}
.message.error > .header > .icon,
.message.negative > .header > .icon {
  color: #ef7071;
}
.message.positive {
  background-color: #b6fcd0;
}
.message.positive > .header > .icon {
  color: #17ce7f;
}
.message.recommendation {
  background-color: #ffffc0;
}
.message.recommendation > .header > .icon {
  color: #ffd600;
}
.message.special {
  background-color: #b6bec4;
}
.message.special > .header > .icon {
  color: #65727c;
}
.message.warning {
  background-color: #ffc2bf;
}
.message.warning > .header > .icon {
  color: #ef7071;
}
.message.hint {
  display: block;
  border-radius: 0;
  background-color: #ffffc0;
}
.message.hint > .header > .icon {
  color: #ffd600;
}
.message.note {
  background-color: #d1e8f5;
}
.message.note > .header > .icon {
  color: #3688b6;
}
.message.offline-exercise {
  background-color: #fcfcfc;
}
.message.offline-exercise > .header > .icon {
  color: #80c1e0;
}
.bttr.figure > .message {
  margin-top: 0;
}
.site-header-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  background-color: #ffffff;
}
.site-header-wrapper > .container {
  padding-top: 0.9em;
  padding-bottom: 0.9em;
}
.site-header__item {
  position: relative;
  top: 4px;
}
.site-header__item .site-header__item__icon {
  display: inline-block;
}
.site-header__item .site-header__item__icon .icon {
  position: relative;
  top: 0px;
}
.site-header__item .site-header__item__icon .avatar {
  top: 1px;
}
.site-header__item .site-header__item__label {
  display: inline-block;
  padding-left: 2px;
}
.site-header {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  max-width: 54em;
  margin: auto;
  padding-top: 0.9em;
  padding-bottom: 0.7em;
}
@media only screen and (max-width: 900px) {
  .site-header {
    max-width: 100%;
    margin-left: 2em;
    margin-right: 2em;
  }
}
.site-header div {
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  vertical-align: middle;
  white-space: nowrap;
  position: relative;
}
.site-header div > * {
  display: block;
}
.site-header div > a,
.site-header div > span {
  border: 0;
  text-decoration: none;
  color: #23394e;
  padding-top: 0.702em;
  zoom: 1;
}
.site-header div > a:hover,
.site-header div > span:hover {
  color: #5f93c8;
}
.site-header div > a.icon-only,
.site-header div > span.icon-only {
  width: 1.5em;
  margin: 0;
  text-align: center;
}
.site-header div > a.active,
.site-header div > span.active {
  color: #389de0;
}
.site-header div > a.disabled,
.site-header div > span.disabled {
  color: #e1e1e1;
}
.site-header div.with-overlay-pointer::after {
  display: block;
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  z-index: 2;
  border: 0.7em solid #d5d5d5;
  margin-left: -0.7em;
  top: auto;
  right: auto;
  bottom: -1.2em;
  left: 50%;
  border-top: 0;
  border-left-color: transparent;
  border-right-color: transparent;
}
.site-header div img.logo {
  display: block;
  max-width: 13.5em;
  max-height: 3em;
}
.site-header .flex {
  width: 100%;
  margin-right: 0.5em;
  margin-left: 0.5em;
}
.site-header .progress-bar {
  height: 0.9em;
  background-color: #e1e1e1;
}
.site-header .progress-bar .bar {
  height: 0.9em;
  background-color: #20b786;
}
.shadow-site-header {
  margin-bottom: 1.5em;
  visibility: hidden;
  opacity: 0;
}
.slideout-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
}
.slideout-container-wrapper {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 1.5em;
}
@media only screen and (max-width: 900px) {
  .slideout-container-wrapper {
    width: 100%;
    position: unset;
  }
  .slideout-container-wrapper > .container {
    width: 100%;
    margin-right: 0;
  }
}
.slideout-container-wrapper > .container {
  height: 100%;
  max-height: 100%;
  width: 35em;
  margin-top: 4.6em;
  margin-right: calc(50% + 1em - 27em);
}
.slideout {
  text-align: left;
  position: relative;
  background-color: #d5d5d5;
  box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
  max-height: 100%;
}
.slideout > :last-child,
.slideout > .last-child {
  margin-bottom: 0;
}
.slideout .spacer {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 1em;
}
.slideout .spacer .overlay-course-header {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  text-transform: inherit;
  margin: 0;
}
.slideout .content .shadow {
  visibility: hidden;
  padding: 3.65em 1em 1em;
}
.slideout .content .shadow > :last-child,
.slideout .content .shadow > .last-child {
  margin-bottom: 0;
}
.slideout .content .scroller {
  position: absolute;
  top: 3.65em;
  right: 0;
  bottom: 0;
  left: 0;
  overflow-y: auto;
  padding: 0 1em 1em;
}
.slideout .content .scroller > :last-child,
.slideout .content .scroller > .last-child {
  margin-bottom: 0;
}
.slideout .content .message {
  margin-top: 0;
}
.close-overlay {
  display: block;
  position: absolute;
  top: 1em;
  right: 1em;
  width: 1.5em;
  text-align: center;
}
.close-overlay > .icon {
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5em;
  color: #999999;
}
.slideout-mask {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.slideout-mask:hover {
  cursor: default;
}
.toc-header {
  zoom: 1;
  margin-bottom: 1.5em;
}
.toc-header:after {
  content: "";
  display: table;
  clear: both;
}
.toc-header .header {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  font-size: 1.5em;
  margin-top: 2em;
  margin-bottom: 1em;
  text-transform: inherit;
  margin-top: 0;
}
.toc-header .right {
  float: right;
  position: relative;
  top: 3px;
}
.table-of-contents {
  color: #333333;
}
.table-of-contents .entry {
  zoom: 1;
  position: relative;
  display: block;
  padding: 0.1em 0;
  border: 0;
  color: #333333;
}
.table-of-contents .entry:after {
  content: "";
  display: table;
  clear: both;
}
.table-of-contents .entry:hover {
  cursor: pointer;
}
.table-of-contents .entry:hover,
.table-of-contents .entry:hover .title .text,
.table-of-contents .entry:hover .entry-label {
  background-color: #eeeeee;
}
.table-of-contents .entry.focused .icon-column,
.table-of-contents .entry.focused .title .text,
.table-of-contents .entry.focused .dots {
  color: #389de0;
  border-color: #389de0;
}
.table-of-contents .entry.disabled:hover {
  cursor: inherit;
}
.table-of-contents .entry.disabled:hover,
.table-of-contents .entry.disabled:hover .title .text,
.table-of-contents .entry.disabled:hover .entry-label {
  background-color: #fcfcfc;
}
.table-of-contents .entry.disabled .title .text {
  color: #999999;
}
.table-of-contents .entry.disabled .title .text .icon {
  color: #e1e1e1;
}
.table-of-contents .entry.depth-1 .title {
  padding-left: 1.5em;
}
.table-of-contents .entry.depth-1 .title .dots {
  left: 2.25em;
}
.table-of-contents .entry.depth-2 .title {
  padding-left: 3em;
}
.table-of-contents .entry.depth-2 .title .dots {
  left: 3em;
}
.table-of-contents .entry.depth-3 .title {
  padding-left: 4.5em;
}
.table-of-contents .entry.depth-3 .title .dots {
  left: 4.5em;
}
.table-of-contents .entry.depth-4 .title {
  padding-left: 6em;
}
.table-of-contents .entry.depth-4 .title .dots {
  left: 6em;
}
.table-of-contents .entry.size-2.depth-1 {
  margin-top: 0.375em;
}
.table-of-contents .entry.size-2 .text,
.table-of-contents .entry.size-2 .icon-column {
  font-size: 1.1em;
}
.table-of-contents .entry.size-3.depth-1 {
  margin-top: 0.75em;
}
.table-of-contents .entry.size-3 .text,
.table-of-contents .entry.size-3 .icon-column {
  font-size: 1.4em;
  font-weight: lighter;
}
.table-of-contents .icon-column {
  width: 1.5em;
  text-align: center;
  float: left;
}
.table-of-contents .title {
  padding-left: 1.5em;
  padding-right: 150px;
}
.table-of-contents .title .text {
  position: relative;
  z-index: 1;
  padding-right: .5em;
  background-color: #fcfcfc;
}
.table-of-contents .title .text > .icon,
.table-of-contents .title .text > .label {
  margin-left: .4em;
}
.table-of-contents .title .text > .icon {
  color: #ff0000;
}
.table-of-contents .dots {
  position: absolute;
  bottom: .3em;
  left: 1.5em;
  right: 0;
  border-bottom: 1px dotted #333333;
  z-index: 0;
}
.table-of-contents .entry-label {
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: #fcfcfc;
  padding-left: .5em;
  padding-right: .2em;
  padding-bottom: .2em;
  z-index: 1;
}
.table-of-contents .entry-label .label {
  display: block;
  margin: 0;
  text-align: center;
}
.countdown-container {
  background-color: #21394f;
  color: #e0e3e6;
  border: 1px solid #677887;
  border-radius: .3em;
  margin-right: .6em;
  padding: .1em .7em;
  font-size: .8em;
}
.countdown {
  font-weight: bold;
}
[data-efy-image-map] .option-items .icon {
  margin-right: 0.3em;
}
[data-efy-image-map] .toolbar .zoom-help {
  color: #999999;
  font-size: .9em;
}
[data-efy-list-with-options] .toolbar {
  margin-top: -1.5em;
  margin-bottom: 0.75em;
}
.image-map {
  margin-bottom: 1.5em;
}
.image-map.zoom .image-container {
  position: relative;
  overflow: auto;
  padding: .375em;
  margin-top: .375em;
}
.image-map.zoom .image-container .click-capture {
  max-width: none;
}
.image-map.zoom .image-container img {
  max-width: none;
}
.image-map.no-zoom .image-container {
  position: static;
}
.image-map.no-zoom .image-container .click-capture {
  max-width: 100%;
}
.image-map.no-zoom .image-container img {
  max-width: 100%;
}
.image-map.dragging .image-container .click-capture {
  cursor: move;
}
.image-map .image-container {
  padding-top: .375em;
  margin-top: .375em;
  padding-bottom: .375em;
  margin-bottom: -0.375em;
  text-align: center;
}
.image-map .image-container .click-capture {
  position: relative;
  vertical-align: bottom;
  display: inline-block;
  cursor: default;
}
.image-map .image-container img {
  display: block;
}
.image-map-instructions {
  font-style: italic;
}
.image-map-instructions .icon {
  display: inline-block;
  width: 1.5em;
  text-align: center;
  color: #ffd600;
  font-size: 1.341em;
  position: relative;
  top: 0.22222222em;
}
.image-map-instructions .answer-label {
  font-style: italic;
  font-weight: bold;
}
.image-map-pin {
  position: absolute;
  top: -9999px;
  left: -9999px;
  font-size: 1.5em;
  width: 0;
}
.image-map-pin .icon {
  position: relative;
  top: -1em;
  left: -0.5em;
}
.image-map-pin .icon:hover {
  cursor: pointer;
}
.image-map-pin.disabled .icon:hover {
  cursor: default;
}
.image-map-area {
  position: absolute;
  outline: solid 1px #111;
  border: solid 1px #ddd;
}
.image-map-area .image-map-area-bg {
  background-color: #777;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
.image-map-area .image-map-area-remove-action-icon {
  position: absolute;
  top: 0;
  right: -1.2em;
}
.auxiliary.buttons {
  margin: 1em 0;
}
.available-options {
  margin-bottom: 1.5em;
  margin-left: 1.5em;
}
.available-options .option-item,
.option-items .option-item {
  margin: 0 .5em .5em 0;
}
.available-options .option-item.reset,
.option-items .option-item.reset {
  margin: 0 0 .5em .5em;
}
.cloze-deletion {
  line-height: 1.6;
}
/* ============================ GRID ============================ */
.grid-mixin {
  display: grid;
  gap: 1rem;
}
@media only screen and (max-width: 900px) {
  .grid-mixin {
    grid-template-columns: 1fr;
  }
}
.grid-mixin .teaching > div {
  padding: 0;
}
.grid-mixin .exercise,
.grid-mixin .exercise > .container {
  padding: 0;
}
.grid-mixin .video + .exercise,
.grid-mixin .teaching + .exercise {
  margin-top: 0;
}
.grid-mixin > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-col-2 {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
}
@media only screen and (max-width: 900px) {
  .grid-col-2 {
    grid-template-columns: 1fr;
  }
}
.grid-col-2 .teaching > div {
  padding: 0;
}
.grid-col-2 .exercise,
.grid-col-2 .exercise > .container {
  padding: 0;
}
.grid-col-2 .video + .exercise,
.grid-col-2 .teaching + .exercise {
  margin-top: 0;
}
.grid-col-2 > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-three-one {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
  grid-template-columns: 3fr 1fr;
}
@media only screen and (max-width: 900px) {
  .grid-three-one {
    grid-template-columns: 1fr;
  }
}
.grid-three-one .teaching > div {
  padding: 0;
}
.grid-three-one .exercise,
.grid-three-one .exercise > .container {
  padding: 0;
}
.grid-three-one .video + .exercise,
.grid-three-one .teaching + .exercise {
  margin-top: 0;
}
.grid-three-one > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-one-three {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr;
  grid-template-columns: 1fr 3fr;
}
@media only screen and (max-width: 900px) {
  .grid-one-three {
    grid-template-columns: 1fr;
  }
}
.grid-one-three .teaching > div {
  padding: 0;
}
.grid-one-three .exercise,
.grid-one-three .exercise > .container {
  padding: 0;
}
.grid-one-three .video + .exercise,
.grid-one-three .teaching + .exercise {
  margin-top: 0;
}
.grid-one-three > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-col-3 {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr 1fr;
}
@media only screen and (max-width: 900px) {
  .grid-col-3 {
    grid-template-columns: 1fr;
  }
}
.grid-col-3 .teaching > div {
  padding: 0;
}
.grid-col-3 .exercise,
.grid-col-3 .exercise > .container {
  padding: 0;
}
.grid-col-3 .video + .exercise,
.grid-col-3 .teaching + .exercise {
  margin-top: 0;
}
.grid-col-3 > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-one-two-one {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 2fr 1fr;
}
@media only screen and (max-width: 900px) {
  .grid-one-two-one {
    grid-template-columns: 1fr;
  }
}
.grid-one-two-one .teaching > div {
  padding: 0;
}
.grid-one-two-one .exercise,
.grid-one-two-one .exercise > .container {
  padding: 0;
}
.grid-one-two-one .video + .exercise,
.grid-one-two-one .teaching + .exercise {
  margin-top: 0;
}
.grid-one-two-one > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-one-one-two {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 2fr;
}
@media only screen and (max-width: 900px) {
  .grid-one-one-two {
    grid-template-columns: 1fr;
  }
}
.grid-one-one-two .teaching > div {
  padding: 0;
}
.grid-one-one-two .exercise,
.grid-one-one-two .exercise > .container {
  padding: 0;
}
.grid-one-one-two .video + .exercise,
.grid-one-one-two .teaching + .exercise {
  margin-top: 0;
}
.grid-one-one-two > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.grid-two-one-one {
  display: grid;
  gap: 1rem;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-columns: 2fr 1fr 1fr;
}
@media only screen and (max-width: 900px) {
  .grid-two-one-one {
    grid-template-columns: 1fr;
  }
}
.grid-two-one-one .teaching > div {
  padding: 0;
}
.grid-two-one-one .exercise,
.grid-two-one-one .exercise > .container {
  padding: 0;
}
.grid-two-one-one .video + .exercise,
.grid-two-one-one .teaching + .exercise {
  margin-top: 0;
}
.grid-two-one-one > .block-container {
  margin-right: 0;
  margin-left: 0;
}
.preview-course {
  padding: 0 1em;
}
.preview-course .toc-target-anchor {
  display: block;
  position: relative;
  top: -4em;
}
.preview-course table {
  margin: 0 auto;
}
.preview-course-site-header {
  margin: 1em 0 2em;
}
.preview-course-site-header .identification {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
}
.preview-course-site-header .timestamp {
  color: #888;
}
.preview-course-locale-switcher {
  margin-bottom: 2em;
}
.preview-course-legend {
  margin-bottom: 2em;
}
.preview-course-locale-header {
  font-size: 1.33em;
  line-height: 1;
  margin-bottom: 1em;
  padding: .5em;
  background-color: #f8f8f8;
  color: #888;
}
.preview-course-locale-header .remove {
  float: right;
  text-decoration: none;
  color: #888;
}
.preview-course-locale-header .remove:hover {
  color: black;
}
.preview-course-cell {
  width: 36em;
  padding-right: 2em;
  vertical-align: top;
}
.preview-course-cell:last-child {
  padding-right: 0;
}
.preview-course-cell img {
  max-width: 100%;
  object-fit: cover;
}
.preview-course-footer {
  text-align: center;
  margin: 20px;
}
.preview-course-edit-block {
  position: relative;
  margin-bottom: 1.5em;
}
.preview-course-edit-block[data-edit-master-source] {
  background-color: #F5F7C6;
}
.negative.message .preview-course-edit-block[data-edit-master-source] {
  background-color: #8B9108;
}
.positive.message .preview-course-edit-block[data-edit-master-source] {
  background-color: #8B9108;
}
.preview-course-edit-block-aside {
  position: absolute;
  top: 0;
  width: 2em;
  bottom: 0;
  left: 0;
  text-align: center;
  padding: .5em .2em 0 0;
  font-size: .9em;
  line-height: 1;
  color: #888;
}
.preview-course-edit-block-aside:hover {
  cursor: pointer;
  color: #444;
}
.preview-course-edit-block-content {
  padding-left: 2em;
}
.preview-course-edit-block-content > :last-child,
.preview-course-edit-block-content > .last-child {
  margin-bottom: 0;
}
.preview-course-assessment-settings {
  margin: 1em 0;
  padding: .7em 1em;
  background-color: #BAE0F1;
}
.preview-course-assessment-settings table {
  width: 100%;
}
.quick-edit-form {
  position: relative;
  margin: 1em 0;
  min-height: 12em;
}
.quick-edit-form-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(255, 255, 255, 0.95);
  color: #333;
  padding: 1em;
}
.quick-edit-form-toolbar:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.quick-edit-form-toolbar-right {
  float: right;
}
.quick-edit-form-toolbar-right .button {
  margin-left: .5em;
}
.quick-edit-form-textarea {
  width: 100%;
  min-height: 20em;
  box-sizing: border-box;
  border: 2px solid #dadfe7;
  padding: .8em 1em;
  box-shadow: none;
  border-radius: .25em;
  background-color: white;
  color: #333333;
}
@media print {
  .preview-course-locale-switcher {
    display: none;
  }
  .preview-course-legend {
    display: none;
  }
  .preview-course-edit-block-aside {
    display: none;
  }
  .preview-course-edit-block-content {
    padding-left: 0;
  }
}
.voice-over-text {
  position: relative;
  border: 1px dashed;
}
.voice-over-text i.icon {
  position: absolute;
  right: -1.5em;
  top: 0.1em;
}
form > :last-child,
form > .last-child {
  margin-bottom: 0;
}
.form .form-group {
  zoom: 1;
  margin-bottom: 1.5em;
}
.form .form-group:after {
  content: "";
  display: table;
  clear: both;
}
.form .form-group > label {
  margin: 0 0 .3em;
  display: block;
  font-size: .875em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  text-transform: uppercase;
}
.form textarea,
.form input[type=text],
.form input[type=password] {
  width: 100%;
  outline: 0;
  border: 0;
  color: #333333;
}
.form input:-webkit-autofill {
  box-shadow: 0 0 0px 1000px white inset;
}
.form-group .field {
  display: block;
  margin: .8em 0;
  line-height: 1;
}
.form-group .field .icon {
  float: left;
  width: 2em;
  text-align: center;
}
.form-group .field label {
  padding-left: 2.5em;
  display: block;
}
.form-group .fields {
  zoom: 1;
}
.form-group .fields:after {
  content: "";
  display: table;
  clear: both;
}
.form-group .fields > .field {
  float: left;
}
.form-group .two.fields > .field {
  width: 50%;
}
.form-section {
  position: relative;
  margin-bottom: 1.5em;
  padding-left: 0.75em;
  padding-right: 0.75em;
}
.form-section > .icon {
  display: inline-block;
  width: 2.25em;
  text-align: center;
  position: absolute;
  top: 0.24161074em;
  left: 0;
}
.form-section > .content {
  padding-left: 1.5em;
}
.form-section > .content > :last-child,
.form-section > .content > .last-child {
  margin-bottom: 0;
}
.form-section .header {
  margin: 0 0 0.41666667em;
  font-size: 1.2em;
}
.form-section .explanation {
  margin-bottom: .5em;
}
.form-section .input-fields > .field {
  display: block;
  padding: .1em 0;
}
.form-section .input-fields > .field > .icon {
  display: inline-block;
  width: 1.5em;
  text-align: center;
  line-height: 1.3;
  float: left;
}
.form-section .input-fields > .field a {
  display: inline-block;
}
.sign-in.container {
  max-width: 32em;
  padding: 4em 1em;
}
.sign-in.container .logo {
  display: block;
  margin: 0 auto 2em;
  max-width: 50%;
}
.sign-in.container .header {
  font-size: 1.9em;
  text-transform: uppercase;
  font-weight: bold;
  padding-bottom: 1em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
}
.sign-in.container .centered.header {
  text-align: center;
}
.sign-in.container label {
  font-size: 1.2em;
  text-transform: none;
}
.sign-in.container .button {
  letter-spacing: 1px;
}
.sign-in.container a.button {
  box-sizing: border-box;
}
.sign-in.container .forgot {
  float: right;
  font-size: 1.2em;
  margin-top: 0.4em;
}
.sign-in.container p {
  font-size: 1.2em;
}
/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
}
.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020;
}
.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.fancybox-opened {
  z-index: 8030;
}
.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}
.fancybox-outer,
.fancybox-inner {
  position: relative;
}
.fancybox-inner {
  overflow: hidden;
}
.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch;
}
.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap;
}
.fancybox-image,
.fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
}
.fancybox-image {
  max-width: 100%;
  max-height: 100%;
}
#fancybox-loading,
.fancybox-close,
.fancybox-prev span,
.fancybox-next span {
  background-image: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/fancybox_sprite-F98Z-XYo53vgnDUr8nQl-uokglE.png');
}
#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060;
}
#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/fancybox_loading-GnVfslmfOjE8xs_bFN8EP4wUqZw.gif') center center no-repeat;
}
.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040;
}
.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/blank-La6qi18Z8LwgnZdsAr1qy1GwCwo.gif');
  /* helps IE */
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  z-index: 8040;
}
.fancybox-prev {
  left: 0;
}
.fancybox-next {
  right: 0;
}
.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden;
}
.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px;
}
.fancybox-next span {
  right: 10px;
  background-position: 0 -72px;
}
.fancybox-nav:hover span {
  visibility: visible;
}
.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important;
}
/* Overlay helper */
.fancybox-lock {
  overflow: hidden !important;
  width: auto;
}
.fancybox-lock body {
  overflow: hidden !important;
}
.fancybox-lock-test {
  overflow-y: hidden !important;
}
.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/fancybox_overlay-s6TuZFuklPUoQO-EEgFboPRl2-A.png');
}
.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0;
}
.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll;
}
/* Title helper */
.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050;
}
.fancybox-opened .fancybox-title {
  visibility: visible;
}
.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center;
}
.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent;
  /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap;
}
.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
}
.fancybox-title-inside-wrap {
  padding-top: 10px;
}
.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, 0.8);
}
/*Retina graphics!*/
/*TODO (UU): Verify it works with retina graphics. Otherwise disable it. */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
  #fancybox-loading,
  .fancybox-close,
  .fancybox-prev span,
  .fancybox-next span {
    background-image: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/fancybox_sprite@2x-MMWJE_Mn4o9GagD0wayAAbVgrtg.png');
    background-size: 44px 152px;
    /*The size of the normal image, half the size of the hi-res image*/
  }
  #fancybox-loading div {
    background-image: url('https://adaptive.saltcompliance.com/api/v1/shc/hashedAssets/images/fancybox_loading@2x-JzsSNJakK6RcNBatsCfNmXRQWLA.gif');
    background-size: 24px 24px;
    /*The size of the normal image, half the size of the hi-res image*/
  }
}
/* --------------------------------------------------------------------------
 * form / input
 */
.input {
  border: 1px solid #e1e1e1;
  padding: 0.375em 0.75em;
  box-shadow: none;
  border-radius: .15em;
  background-color: #ffffff;
}
.input.active {
  border-color: #389de0;
}
.input input {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background-color: #ffffff;
  font-size: 100%;
  width: 100%;
}
.input input:focus {
  outline: none;
}
.input input[type=radio] {
  width: initial;
}
.input.fluid input {
  width: 100%;
}
.input.large input {
  font-size: 1.3em;
}
/* --------------------------------------------------------------------------
 * gap
 */
.gap {
  position: relative;
  display: inline-block;
  width: 200px;
  padding: 0 .3em;
  line-height: 1;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid #333333;
}
.gap input {
  width: 100%;
  text-align: center;
}
.gap.with-hint {
  padding-right: 2.3em;
}
.gap input::-webkit-input-placeholder {
  text-align: center;
}
.gap input::moz-placeholder {
  text-align: center;
}
/* --------------------------------------------------------------------------
 * unit-header
 */
.unit-header {
  margin-bottom: 0.5em;
}
.unit-header .title {
  color: #333333;
  font-size: 1.75em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  text-transform: inherit;
}
.unit-header .label {
  float: right;
  position: relative;
  top: .7em;
  margin: 0;
}
/* --------------------------------------------------------------------------
 * slide-header
 */
.slide-header {
  zoom: 1;
  margin-bottom: 1.5em;
}
.slide-header:after {
  content: "";
  display: table;
  clear: both;
}
.slide-header .title {
  color: #333333;
  font-size: 1.2em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
}
.slide-header .controls {
  zoom: 1;
  float: right;
  margin-left: 1em;
}
.slide-header .controls:after {
  content: "";
  display: table;
  clear: both;
}
.slide-header .controls > * {
  float: left;
}
/* --------------------------------------------------------------------------
 * assessment-header
 */
.assessment-header {
  zoom: 1;
  margin: 0 0 1.5em;
}
.assessment-header:after {
  content: "";
  display: table;
  clear: both;
}
.assessment-header .dots {
  zoom: 1;
}
.assessment-header .dots:after {
  content: "";
  display: table;
  clear: both;
}
.assessment-header .dots .icon {
  color: #e1e1e1;
}
.assessment-header .dots .icon.overdue {
  color: #ef7071;
}
.assessment-header .dots .icon.ongoing {
  color: #cffadf;
}
.assessment-header .dots .icon.completed {
  color: #20b786;
}
.assessment-header .dots > * {
  float: left;
}
.assessment-header .controls {
  zoom: 1;
  float: right;
  margin-left: 1em;
}
.assessment-header .controls:after {
  content: "";
  display: table;
  clear: both;
}
.assessment-header .controls > * {
  float: left;
}
/* --------------------------------------------------------------------------
 * my courses header
 */
.site-content > .container > h1 > .icon {
  display: inline-block;
  width: 2em;
  text-align: center;
}
/* --------------------------------------------------------------------------
 * course-inst-card
 */
.course-inst-card {
  zoom: 1;
  clear: both;
  margin-left: 0;
  margin-right: 0;
  padding: 1.5em 0;
  display: block;
  border: 0;
}
.course-inst-card:after {
  content: "";
  display: table;
  clear: both;
}
.course-inst-card a {
  display: block;
  color: inherit;
  border: 0;
  color: #333333;
}
.course-inst-card a:visited {
  color: inherit;
}
.course-inst-card a:hover {
  cursor: pointer;
}
.course-inst-card:hover {
  background-color: #eeeeee;
  margin: auto;
}
.course-inst-card .container > :last-child,
.course-inst-card .container > .last-child {
  margin-bottom: 0;
}
.course-inst-card .container .header {
  font-size: 1.4em;
  margin-bottom: 0.2em;
}
.course-inst-card .container .header .icon {
  display: inline-block;
  width: 2.14285714em;
  text-align: center;
}
.course-inst-card .container .label {
  margin-right: .5em;
}
.course-inst-card .container .summary {
  text-transform: uppercase;
  color: #389de0;
}
.course-inst-card .container .course-description {
  margin-top: 0.4em;
}
.course-inst-card .container .course-description p:last-child,
.course-inst-card .container .course-description p.last-child {
  margin-bottom: 0;
}
.course-inst-card .container .course-revision-forbidden {
  margin-top: 0.4em;
  color: #f02d2e;
  text-transform: uppercase;
}
/* --------------------------------------------------------------------------
 * slide-footer
 */
.site-footer-button {
  max-width: 36em;
  margin: auto;
  clear: both;
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}
.site-footer-button .button {
  width: auto;
}
/* --------------------------------------------------------------------------
 * voice-over
 */
.voice-over {
  zoom: 1;
  clear: both;
  margin-left: 0;
  margin-right: 0;
  margin-top: -1.5em;
  padding-top: 1.5em;
  margin-bottom: 1.5em;
}
.voice-over:after {
  content: "";
  display: table;
  clear: both;
}
.voice-over > :last-child,
.voice-over > .last-child {
  margin-bottom: 0;
}
.voice-over > .container {
  position: relative;
  top: -1.375em;
  height: 0;
}
.voice-over > .teaching > :last-child,
.voice-over > .teaching > .last-child {
  margin-bottom: 0;
}
.voice-over.voice-over-loading .voice-over-controls {
  visibility: hidden;
}
.voice-over.voice-over-playing {
  background-color: #eeeeee;
}
.voice-over.voice-over-playing .voice-over-controls .icon {
  color: #389de0;
}
.voice-over.voice-over-playing .voice-over-controls .link > .icon:hover {
  color: #198dcf;
}
.voice-over.voice-over-playing .voice-over-controls .bar {
  background-color: #389de0;
}
.voice-over.voice-over-inactive .icon {
  color: #e1e1e1;
}
.voice-over.voice-over-inactive .link > .icon:hover {
  color: #e1e1e1;
}
.voice-over.voice-over-inactive .voice-over-controls {
  visibility: hidden;
  cursor: pointer;
}
.voice-over.voice-over-inactive .voice-over-controls .bar {
  visibility: hidden;
}
.voice-over.voice-over-inactive:hover .voice-over-controls {
  visibility: visible;
}
.voice-over-controls {
  margin: 0;
  height: 1.5em;
  cursor: default;
}
.voice-over-controls table {
  width: 100%;
  height: 1.5em;
}
.voice-over-controls .item {
  line-height: 1;
}
.voice-over-controls .fluid {
  width: 100%;
  vertical-align: middle;
}
.voice-over-controls .icon {
  font-size: 1em;
  color: #999999;
  display: block;
  width: 1.5em;
  text-align: center;
}
.voice-over-controls td:first-child .icon {
  font-size: 1.5em;
  width: 1em;
  line-height: 1;
  position: relative;
  top: 0;
}
.voice-over-controls .item > .link {
  cursor: pointer;
}
.voice-over-controls .link > .icon:hover {
  color: #858585;
}
.voice-over-controls .progress-bar {
  position: relative;
  height: 6px;
  margin: 0 .2em;
  background-color: #e1e1e1;
}
.voice-over-controls .progress-bar .bar {
  position: absolute;
  left: 0;
  top: 0;
  height: 6px;
  background-color: #999999;
}
/* --------------------------------------------------------------------------
 * figure
 */
.figure,
.teaching .figure {
  zoom: 1;
  margin-bottom: 1.5em;
  /* Kaltura video */
}
.figure:after,
.teaching .figure:after {
  content: "";
  display: table;
  clear: both;
}
.figure > :last-child,
.teaching .figure > :last-child,
.figure > .last-child,
.teaching .figure > .last-child {
  margin-bottom: 0;
}
.figure img,
.teaching .figure img {
  display: block;
  max-width: 100%;
  margin: 0 auto;
}
.figure iframe,
.teaching .figure iframe {
  display: block;
  width: 100%;
  min-height: 400px;
}
.figure > span:first-child,
.teaching .figure > span:first-child {
  display: block;
  height: 400px;
}
.figure > span:first-child object,
.teaching .figure > span:first-child object {
  display: block;
  width: 100%;
  height: 400px;
}
.figure.key-image.show-zoom-icon a,
.teaching .figure.key-image.show-zoom-icon a {
  display: block;
  position: relative;
  z-index: 1;
}
.figure.key-image.show-zoom-icon a:after,
.teaching .figure.key-image.show-zoom-icon a:after {
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  display: block;
  position: absolute;
  right: .5em;
  bottom: .5em;
  font-family: 'better-icon-font' !important;
  content: "\e060";
  color: #ccc;
}
.figure.key-image.show-zoom-icon a:hover,
.teaching .figure.key-image.show-zoom-icon a:hover {
  cursor: pointer;
}
.figure.key-image.show-zoom-icon a:hover:after,
.teaching .figure.key-image.show-zoom-icon a:hover:after {
  color: inherit;
}
.figure .caption,
.teaching .figure .caption {
  padding: .3em 0;
  font-size: 0.8125em;
  color: #999;
}
.figure .caption > :last-child,
.teaching .figure .caption > :last-child,
.figure .caption > .last-child,
.teaching .figure .caption > .last-child {
  margin-bottom: 0;
}
.figure .caption > p,
.teaching .figure .caption > p {
  max-width: inherit;
}
.figure.left,
.teaching .figure.left {
  float: left;
  width: 35%;
  margin: 0.3em 0.75em 0.75em 0;
}
.figure.right,
.teaching .figure.right {
  float: right;
  width: 35%;
  margin: 0.3em 0 0.75em 0.75em;
}
@media (max-width: 56em) {
  .figure.left,
  .teaching .figure.left {
    float: none;
    width: auto;
  }
  .figure.right,
  .teaching .figure.right {
    float: none;
    width: auto;
  }
}
.figure .button.zoom-in,
.teaching .figure .button.zoom-in {
  float: right;
}
.voice-over .figure .caption,
.exercise .figure .caption {
  background-color: transparent;
}
/* --------------------------------------------------------------------------
 * exercise
 */
.exercise {
  clear: both;
  margin-left: 0;
  margin-right: 0;
  margin-top: -0.75em;
  margin-bottom: 2.25em;
  padding: 0.75em 0;
  background-color: #fcfcfc;
}
.exercise > .container > :last-child,
.exercise > .container > .last-child {
  margin-bottom: 0;
}
.question-body {
  margin-bottom: 1.5em;
  clear: both;
}
.question-body > :last-child,
.question-body > .last-child {
  margin-bottom: 0;
}
/* --------------------------------------------------------------------------
 * choice-item
 */
.choice-item {
  position: relative;
  margin-bottom: 0.375em;
  cursor: pointer;
  border-radius: 0.125em;
  user-select: none;
  padding: 0;
  border: 1px solid #333333;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.choice-item:last-child,
.choice-item.last-child {
  margin-bottom: 0;
}
.choice-item input {
  display: none;
}
.choice-item > .content {
  position: relative;
  padding: 0.1875em 0.75em;
  zoom: 1;
}
.choice-item > .content:after {
  content: "";
  display: table;
  clear: both;
}
.choice-item > .content > :last-child,
.choice-item > .content > .last-child {
  margin-bottom: 0;
}
.choice-item > .content > div > :last-child,
.choice-item > .content > div > .last-child {
  margin-bottom: 0;
}
.choice-item > .content blockquote,
.choice-item > .content pre,
.choice-item > .content pre code {
  background-color: inherit;
}
.choice-item.input > i.icon {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  margin: -0.5em 0 0 0;
  width: 2.25em;
  font-size: 1em;
  text-align: center;
}
.choice-item.input > .content {
  padding-left: 2.25em;
}
.choice-item:hover {
  border-color: #cacaca;
  background-color: #cacaca;
  color: #333333;
}
.choice-item:active {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.choice-item.selected {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.choice-item.selected:hover {
  border-color: #656565;
  background-color: #656565;
  color: #fcfcfc;
}
.choice-item.selected:active {
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.choice-item .hint {
  background-color: #ffe789;
  color: #333333;
}
.choice-item .hint .triangle {
  border-color: #ffe789;
}
.choice-item:hover .hint {
  border-color: #ffd223;
  background-color: #ffd223;
  color: #333333;
}
.choice-item:hover .hint .triangle {
  border-top-color: #ffd223;
}
.choice-item:active .hint {
  border-color: #bc9600;
  background-color: #bc9600;
  color: #333333;
}
.choice-item:active .hint .triangle {
  border-top-color: #bc9600;
}
.choice-item.disabled,
.choice-item.disabled:hover,
.choice-item.disabled:active {
  cursor: default;
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.choice-item.disabled.selected,
.choice-item.disabled:hover.selected,
.choice-item.disabled:active.selected {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.input-item {
  position: relative;
  margin-bottom: 0.375em;
}
.input-item.with-hint {
  padding-right: 3em;
}
.choice-item .hint-indicator,
.input-item .hint-indicator,
.gap .hint-indicator,
.option-item .hint-indicator {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  width: 2em;
  padding: 0;
  border-radius: 0.125em;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border: 1px solid #bc9600;
  border-left: 0;
  background-color: #ffe789;
}
.choice-item .hint-indicator:hover,
.input-item .hint-indicator:hover,
.gap .hint-indicator:hover,
.option-item .hint-indicator:hover {
  cursor: pointer;
}
.choice-item .hint-indicator > .icon,
.input-item .hint-indicator > .icon,
.gap .hint-indicator > .icon,
.option-item .hint-indicator > .icon {
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  margin: -0.5em 0 0 0;
  width: 2em;
  font-size: 1em;
  text-align: center;
  color: #bc9600;
}
.choice-item .hint-indicator .triangle,
.input-item .hint-indicator .triangle,
.gap .hint-indicator .triangle,
.option-item .hint-indicator .triangle {
  position: absolute;
  width: 0;
  height: 0;
  z-index: 2;
  border: 1em solid #ffe789;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  margin-left: -1em;
  bottom: -0.5em;
  left: 50%;
  border-top: 0;
  border-left-color: transparent;
  border-right-color: transparent;
  display: none;
  z-index: 4;
}
.choice-item.show-hint .hint-indicator,
.input-item.show-hint .hint-indicator,
.gap.show-hint .hint-indicator,
.option-item.show-hint .hint-indicator {
  background-color: #ffd223;
}
.choice-item.show-hint .hint-indicator > .icon,
.input-item.show-hint .hint-indicator > .icon,
.gap.show-hint .hint-indicator > .icon,
.option-item.show-hint .hint-indicator > .icon {
  color: #bc9600;
}
.choice-item .hint-popup,
.input-item .hint-popup,
.gap .hint-popup,
.option-item .hint-popup {
  position: absolute;
  top: 110%;
  left: 2em;
  right: -2em;
  padding: 0.75em 0.75em;
  background-color: #ffe789;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  display: none;
  z-index: 3;
}
.choice-item .hint-popup > :last-child,
.input-item .hint-popup > :last-child,
.gap .hint-popup > :last-child,
.option-item .hint-popup > :last-child,
.choice-item .hint-popup > .last-child,
.input-item .hint-popup > .last-child,
.gap .hint-popup > .last-child,
.option-item .hint-popup > .last-child {
  margin-bottom: 0;
}
.choice-item .hint-popup > div > :last-child,
.input-item .hint-popup > div > :last-child,
.gap .hint-popup > div > :last-child,
.option-item .hint-popup > div > :last-child,
.choice-item .hint-popup > div > .last-child,
.input-item .hint-popup > div > .last-child,
.gap .hint-popup > div > .last-child,
.option-item .hint-popup > div > .last-child {
  margin-bottom: 0;
}
.choice-item .hint-indicator,
.input-item .hint-indicator,
.gap .hint-indicator,
.option-item .hint-indicator,
.choice-item .hint-popup,
.input-item .hint-popup,
.gap .hint-popup,
.option-item .hint-popup {
  color: #333333;
}
.choice-item.with-hint,
.input-item.with-hint,
.gap.with-hint,
.option-item.with-hint {
  padding-right: 3em;
}
.choice-item.show-hint .hint-indicator .triangle,
.input-item.show-hint .hint-indicator .triangle,
.gap.show-hint .hint-indicator .triangle,
.option-item.show-hint .hint-indicator .triangle {
  display: block;
}
.choice-item.show-hint .hint-popup,
.input-item.show-hint .hint-popup,
.gap.show-hint .hint-popup,
.option-item.show-hint .hint-popup {
  display: block;
}
.choice-item .locale-input-warning,
.input-item .locale-input-warning,
.gap .locale-input-warning,
.option-item .locale-input-warning {
  position: absolute;
  top: -1px;
  right: -1px;
  bottom: -1px;
  width: 2em;
  padding: 0;
  border-radius: 0.125em;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border: 1px solid #bc9600;
  border-left: 0;
  background-color: #ffe789;
}
.choice-item .locale-input-warning > .locale,
.input-item .locale-input-warning > .locale,
.gap .locale-input-warning > .locale,
.option-item .locale-input-warning > .locale {
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
  margin: -0.5em 0 0 0;
  width: 2em;
  font-size: 1em;
  line-height: 1;
  text-align: center;
  color: #bc9600;
}
.choice-item.with-hint .locale-input-warning,
.input-item.with-hint .locale-input-warning,
.gap.with-hint .locale-input-warning,
.option-item.with-hint .locale-input-warning {
  border-radius: 0;
  right: 2em;
}
.input-item .hint-indicator,
.input-item .locale-input-warning {
  border-color: #ffd223;
}
.gap .hint-indicator,
.gap .locale-input-warning {
  border-radius: 0;
  border-top: 0;
  border-right-color: #ffe789;
}
.gap.with-hint .locale-input-warning {
  border-right-color: #ffd223;
}
.next-item-placeholder {
  padding: .8em 1em;
  margin-bottom: 1.5em;
  background-color: #ffffc0;
  color: #333333;
}
.off-screen {
  position: absolute;
  left: -9999px;
  /* For IE7 */
  width: 1px;
  height: 1px;
}
.change-locale-toggle {
  position: relative;
  z-index: 10;
}
.change-locale-menu {
  display: none;
  position: absolute;
  background: #ffffff;
  right: 0;
}
.hero-icon {
  float: right;
  font-size: 6em;
  color: #389de0;
  margin-left: .2em;
  margin-right: .2em;
}
.hero-icon .icon {
  display: block;
}
.assessment-result-summary {
  margin: 0 0 1.5em 2em;
}
.assessment-result-summary .question-icons-explanation {
  padding-right: 1em;
}
.assessment-result-summary .icon {
  margin: 0 .1em;
}
.assessment-choice-question-icons {
  margin: 0 0 1.5em;
  width: 100%;
}
.assessment-choice-question-icons td {
  width: 50%;
}
.assessment-choice-question-icons .explanation {
  text-align: right;
}
.assessment-choice-question-icons .explanation > span {
  display: inline-block;
  padding-right: .5em;
}
.assessment-choice-question-icons .spacer {
  display: inline-block;
  height: 1.5em;
}
.assessment-choice-question-icons .icon {
  display: inline-block;
  width: 1.6em;
  text-align: center;
  font-size: .8em;
}
/* ---------------------------------------------------------------------------
 * Custom icon styles
 */
.icon.overdue {
  color: #ef7071;
}
.icon.ongoing {
  color: #cffadf;
}
.icon.completed {
  color: #20b786;
}
.icon.outstanding {
  color: #e1e1e1;
}
/* ---------------------------------------------------------------------------
 * Salt ADAPTIVE branding
 */
.better-branding {
  text-align: center;
  margin: 3em;
  font-size: 13px;
  text-transform: uppercase;
}
.better-branding img {
  height: 40px;
  vertical-align: middle;
}
.better-branding a {
  border-bottom: 0;
}
/* ---------------------------------------------------------------------------
 * Learner Log
 */
.learner-log.container {
  width: 980px;
  font-size: 22px;
}
.learner-log.container .header {
  margin-top: 1em;
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
}
.learner-log.container .header.centered {
  text-align: center;
  text-transform: uppercase;
}
.learner-log-meta {
  width: 100%;
}
.learner-log-meta td {
  width: 50%;
}
.learner-log-history tr {
  padding-bottom: 2em;
}
.learner-log-history th {
  font-weight: bold;
  text-align: left;
}
.learner-log-history th,
.learner-log-history td {
  vertical-align: top;
}
.learner-log-history .iframe-wrapper {
  overflow: hidden;
  width: 325px;
  height: 200px;
  margin-left: 2em;
  margin-bottom: 2em;
  border: 1px solid #ddd;
}
.learner-log-history iframe {
  -webkit-transform: scale(0.5);
  -webkit-transform-origin: 0 0;
  width: 650px;
  height: 400px;
}
/* ---------------------------------------------------------------------------
 * jQuery Fancybox
 */
.fancybox-close {
  color: inherit;
  border: 0;
}
.fancybox-close:visited {
  color: inherit;
}
/* ---------------------------------------------------------------------------
 * recommendation-box
 */
.recommendation-box {
  position: relative;
  background-color: #ffffc0;
  margin-top: -0.75em;
  margin-bottom: 0.75em;
  padding: 0.75em 0.75em;
}
.recommendation-box > .icon {
  display: inline-block;
  width: 2.25em;
  text-align: center;
  position: absolute;
  top: 0.9em;
  left: 0;
  color: #ffd600;
}
.recommendation-box .content {
  padding-left: 1.5em;
}
.recommendation-box .content > :last-child,
.recommendation-box .content > .last-child {
  margin-bottom: 0;
}
.recommendation-box .top {
  zoom: 1;
}
.recommendation-box .top:after {
  content: "";
  display: table;
  clear: both;
}
.recommendation-box .top .text {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  margin: 0;
  font-size: 1.2em;
}
.recommendation-box .top .button {
  float: right;
}
.recommendation-box .header + p {
  margin-top: -0.75em;
}
/* ---------------------------------------------------------------------------
 * option-item
 */
.option-item {
  position: relative;
  cursor: pointer;
  display: inline-block;
  border: 1px solid #888;
  border-radius: 0.125em;
  padding: 0.375em 0.75em;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease;
  -webkit-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -moz-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  -o-transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  transition: opacity 0.15s ease, border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, background 0.15s ease, fill 0.15s ease, stroke 0.15s ease;
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.option-item > :last-child,
.option-item > .last-child {
  margin-bottom: 0;
}
.option-item .content > :last-child,
.option-item .content > .last-child {
  margin-bottom: 0;
}
.option-item .content > div > :last-child,
.option-item .content > div > .last-child {
  margin-bottom: 0;
}
.option-item.taken {
  border-color: #999999;
  background-color: transparent;
  color: #999999;
}
.option-item.taken:hover {
  border-color: #999999;
  background-color: transparent;
  color: #999999;
}
.option-item.taken:active {
  border-color: #999999;
  background-color: transparent;
  color: #999999;
}
.option-item.taken:hover {
  cursor: default;
}
.option-item.taken .hint-indicator {
  display: none;
}
.option-item.taken .pin-icon {
  color: #e1e1e1 !important;
}
.option-item.selected {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.option-item.selected:hover {
  border-color: #656565;
  background-color: #656565;
  color: #fcfcfc;
}
.option-item.selected:active {
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.option-item.selected:hover {
  cursor: inherit;
}
.option-item:hover {
  border-color: #cacaca;
  background-color: #cacaca;
  color: #333333;
}
.option-item:active {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.option-item.disabled,
.option-item.disabled:hover,
.option-item.disabled:active {
  cursor: default;
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.image-map-question-body .option-item.taken .hint-indicator {
  display: block;
}
/* ---------------------------------------------------------------------------
 * option-item-slot
 */
.option-item-slot {
  position: relative;
  min-height: 1em;
  margin-bottom: 0.375em;
}
.option-item-slot.active .drop-zone .option-item.placeholder {
  border-style: solid;
  border-color: #389de0;
  background-color: transparent;
  color: #999999;
}
.option-item-slot.active .drop-zone .option-item.placeholder:hover {
  border-color: #389de0;
  background-color: transparent;
  color: #999999;
}
.option-item-slot.active .drop-zone .option-item.placeholder:active {
  border-color: #389de0;
  background-color: transparent;
  color: #999999;
}
.option-item-slot .number {
  position: absolute;
  top: 50%;
  left: 0;
  margin: -0.5em 0 0 0;
  width: 1.5em;
  font-size: 1em;
  text-align: center;
  line-height: 1;
}
.option-item-slot .number .icon {
  font-size: 0.5em;
  position: relative;
  top: -0.3em;
}
.option-item-slot .drop-zone {
  margin-left: 1.5em;
}
.option-item-slot .drop-zone .option-item {
  display: block;
  min-height: 1.3em;
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
}
.option-item-slot .drop-zone .option-item:hover {
  border-color: #656565;
  background-color: #656565;
  color: #fcfcfc;
}
.option-item-slot .drop-zone .option-item:active {
  border-color: #333333;
  background-color: transparent;
  color: #333333;
}
.option-item-slot .drop-zone .option-item.placeholder {
  border-color: #999999;
  background-color: transparent;
  color: #fcfcfc;
  border-style: dashed;
}
.option-item-slot .drop-zone .option-item.placeholder:hover {
  border-color: #389de0;
  background-color: transparent;
  color: #fcfcfc;
}
.option-item-slot .drop-zone .option-item.placeholder:active {
  border-color: #389de0;
  background-color: transparent;
  color: #999999;
}
.option-item-slot .drop-zone .option-item.disabled,
.option-item-slot .drop-zone .option-item.disabled:hover,
.option-item-slot .drop-zone .option-item.disabled:active {
  border-color: #333333;
  background-color: #333333;
  color: #fcfcfc;
  cursor: default;
}
.option-items {
  margin-bottom: .625em;
}
.teaching {
  position: relative;
  z-index: 0;
}
.teaching > div {
  max-width: 54em;
  margin-left: auto;
  margin-right: auto;
  zoom: 1;
  margin-bottom: 1.5em;
}
.teaching > div > :last-child,
.teaching > div > .last-child {
  margin-bottom: 0;
}
.teaching > div:after {
  content: "";
  display: table;
  clear: both;
}
.teaching ol,
.teaching ul {
  margin: 0 0 0 1.5em;
  position: relative;
  left: 1em;
  padding: 0 1.5em 0 0;
}
.teaching h3 {
  font-family: 'Montserrat', 'sans-serif';
  font-weight: 400;
  text-transform: none;
  line-height: 1.1;
  font-size: 1.3em;
  margin-top: 2.30769231em;
  margin-bottom: 1.15384615em;
  max-width: 41.53846154em;
  color: #333333;
}
.teaching hr {
  margin: 0 auto 1.5em auto;
  max-width: 54em;
  clear: both;
  border: 0;
  border-top: 1px solid #ddd;
}
.teaching pre .container {
  position: relative;
}
.teaching pre .container > code {
  display: block;
}
.teaching pre .container:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1.25em;
  font-family: 'better-icon-font';
  line-height: 1;
  content: "\E081";
  font-size: 1.2em;
  color: #6d4c41;
  text-align: center;
}
.teaching blockquote > :last-child,
.teaching blockquote > .last-child {
  margin-bottom: 0;
}
.teaching blockquote > div {
  max-width: 54em;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1.5em;
}
.teaching blockquote > div > :last-child,
.teaching blockquote > div > .last-child {
  margin-bottom: 0;
}
.teaching blockquote > :first-child {
  position: relative;
}
.teaching blockquote > :first-child :before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1.25em;
  font-family: 'better-icon-font';
  line-height: 1;
  content: "\E082";
  font-size: 1.2em;
  color: #ffc108;
  text-align: center;
}
.teaching blockquote > div > * {
  padding-left: 1.5em;
}
.exercise blockquote,
.exercise pre,
.exercise pre code {
  background-color: inherit;
}
.video-section {
  clear: both;
  margin-left: 0;
  margin-right: 0;
  padding: 0.75em 0.75em;
  margin-top: -0.75em;
  margin-bottom: 0.75em;
}
.video-section > .container > :last-child,
.video-section > .container > .last-child {
  margin-bottom: 0;
}
/* ---------------------------------------------------------------------------
 * Negative margin fixes for padded boxes
 */
.teaching pre + h3 {
  margin-top: 1.73076923em;
}
.teaching blockquote + h3 {
  margin-top: 1.73076923em;
}
.teaching .video + h3 {
  margin-top: 1.73076923em;
}
.video + .exercise,
.teaching + .exercise {
  margin-top: 2.25em;
}
.toolbar {
  zoom: 1;
}
.toolbar:after {
  content: "";
  display: table;
  clear: both;
}
.toolbar .toolbar-right {
  display: inline-block;
  float: right;
}
.rtl {
  direction: rtl;
}
/* We're only applying the custom background image elements when we are "not on
 * mobile". */
@media (min-width: 900px) {
  /* We use the `jsonp-content` to fill the entire page and apply the immersive
   * background. This works alright since the jsonp-content is only visible on
   * the `/learn` page. */
  div#jsonp-content {
    background-image: url("//content.saltcompliance.com/contentfiles/images/grc-background.jpg");
    background-size: cover;
    background-position: top center;
    background-attachment: fixed;
    position: absolute;
    overflow-y: auto;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    /* The second element we change is the `site-content`. This allows us to
     * make the "actual" background behind the content a transparent white. */
    /* The table of contents uses white background to hide dots. We can't really
     * do anything about that so we give the whole thing a white background. */
    /* Exercises background */
    /* Voice-over background */
  }
  div#jsonp-content div.site-content {
    margin: auto;
    background-color: white;
    padding-bottom: 16px;
    padding-left: 2em;
    padding-right: 2em;
  }
  div#jsonp-content div.table-of-contents {
    background-color: white;
    padding: 0.75em 0.75em;
  }
  div#jsonp-content div.exercise {
    background-color: #fcfcfc;
  }
  div#jsonp-content div.voice-over.voice-over-playing {
    background-color: #fcfcfc;
  }
}
/* Styles to force ReadSpeaker not to change the style of text read on IE */
.sync_sent,
.sync_word,
.sync_word_highlighted,
.sync_sent_highlighted {
  font-size: inherit !important;
  font-family: inherit !important;
}
@media print {
  html {
    font-family: Georgia, serif;
    background: none;
    color: black;
  }
  .site-header,
  .site-header-wrapper,
  .shadow-site-header {
    display: none;
  }
  .preview-course-cell {
    page-break-inside: avoid;
    width: auto;
  }
}
[data-useragent*="rv:11.0"] .teaching ul {
  text-indent: -1.4em;
}
[data-useragent*="rv:11.0"] .teaching ol {
  text-indent: -1.8em;
}
[data-useragent*="MSIE 10.0"] .teaching ul {
  text-indent: -1.4em;
}
[data-useragent*="MSIE 10.0"] .teaching ol {
  text-indent: -1.8em;
}
.lt-ie10 .teaching ul {
  text-indent: -1.3em;
}
.lt-ie10 .teaching ol {
  text-indent: -1.8em;
}
.lt-ie8 .teaching ul {
  text-indent: -1.1em;
}
.lt-ie8 .teaching ol {
  text-indent: -1em;
}