@charset "UTF-8";

/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Correct the line height in all browsers.
 * 3. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */

/* Document
   ========================================================================== */

html {
  font-family: sans-serif;
  /* 1 */
  line-height: 1.15;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 3 */
  -webkit-text-size-adjust: 100%;
  /* 3 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers (opinionated).
 */

body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */

article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in IE.
 */

figcaption,
figure,
main {
  /* 1 */
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */

a:active,
a:hover {
  outline-width: 0;
}

/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  text-decoration: underline dotted;
  /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */

mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input {
  /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box;
  /* 1 */
  color: inherit;
  /* 2 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  white-space: normal;
  /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 */

details,
menu {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Scripting
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 */

canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */

template {
  display: none;
}

/* Hidden
   ========================================================================== */

/**
 * Add the correct display in IE 10-.
 */

[hidden] {
  display: none;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   CARD
   ========================================================================== */

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

p {
  margin-top: 0;
  line-height: 1.8em;
}

a {
  outline: none !important;
  text-decoration: none;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.hide {
  display: none;
}

/* ==========================================================================
   CARD
   ========================================================================== */

html,
body {
  height: 100%;
  background-color: #e2e8ee;
}

body {
  font-size: 14px;
  font-size: 1.4rem;
  color: #5d6670;
  font-family: "robotoregular", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.global {
  width: 100%;
  max-width: 100%;
  min-width: 980px;
  min-height: 100%;
  position: absolute;
}

#main {
  width: 100%;
  margin-bottom: 120px;
  padding-top: 0;
  display: inline-block;
  vertical-align: top;
}

.container-main {
  display: inline-block;
  vertical-align: top;
  float: left;
}

.container-main--medium {
  width: calc(70% - 30px);
  min-height: 100px;
}

.container-main--small {
  width: calc(30%);
  margin-left: 30px;
}

.container-main--small .nodata figure,
.container-main--small .nodata img {
  width: 100%;
  display: block;
}

.container-main--small .nodata .description {
  width: 100%;
}

#crisp-chatbox {
  text-indent: -9999px;
}

/* ==========================================================================
   CARD
   ========================================================================== */

h1,
h2,
h3 {
  margin: 0;
}

h1,
.alpha {
  font-size: 36px;
  font-size: 3.6rem;
}

h1 small,
.alpha small {
  font-size: 21px;
  font-size: 2.1rem;
}

h2,
.beta {
  font-size: 32px;
  font-size: 3.2rem;
}

h3,
.gama {
  font-size: 21px;
  font-size: 2.1rem;
}

h4,
.delta {
  font-size: 18px;
  font-size: 1.8rem;
}

h5,
.zeta {
  font-size: 14px;
  font-size: 1.4rem;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.footer-main {
  width: 100%;
  padding: 20px 0;
  background-color: #fff;
  bottom: 0;
  color: #5d6670;
  left: 0;
  overflow: hidden;
  position: absolute;
}

.footer-main a {
  color: inherit;
}

.footer-main a:hover {
  text-decoration: underline;
}

.footer-main__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.footer-main__copyright {
  margin: 0 auto;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   FONTS
   ========================================================================== */

@font-face {
  font-family: "robotoregular";
  src: url(d0892ec1e509308fdefabf7ec236345d.eot);
  src: url(d0892ec1e509308fdefabf7ec236345d.eot?#iefix) format("embedded-opentype"), url(01a61abf32dfca7a47812a2204c3e775.woff) format("woff"), url(a879578a7e88b2dc0f6ccad6da6906d9.ttf) format("truetype"), url(bc9c3e90129276459e68ab74bc6927aa.svg#robotoregular) format("svg");
  font-weight: 400;
  font-style: normal;
  font-display: fallback;
}

@font-face {
  font-family: "robotoregular";
  src: url(d8f01f9fb65fba2399d323507578d885.eot);
  src: url(d8f01f9fb65fba2399d323507578d885.eot?#iefix) format("embedded-opentype"), url(cdd3e1061316d24e43090e5b0687b52e.woff) format("woff"), url(e93a847aa343b4af32da570b58fa8023.ttf) format("truetype"), url(60f8756eb89ed66a3633463acfeda4dd.svg#robotoregular) format("svg");
  font-weight: 500;
  font-style: normal;
  font-display: fallback;
}

@font-face {
  font-family: "robotoregular";
  src: url(35e026d9c97fce93a4e0b3f1cf86555d.eot);
  src: url(35e026d9c97fce93a4e0b3f1cf86555d.eot?#iefix) format("embedded-opentype"), url(02f610d3ed4dbbbff5e12059b20df3fe.woff) format("woff"), url(c6f79fa68af790801f5b55a84394ed33.ttf) format("truetype"), url(59a324fb171b6ff236a026deddb76f99.svg#robotoregular) format("svg");
  font-weight: 700;
  font-style: normal;
  font-display: fallback;
}

/* ==========================================================================
   CARD
   ========================================================================== */

[class^="icon-"],
[class*=" icon-"] {
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* better font rendering  */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fe-live::after {
  content: '\2022';
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   AUDIO
   ========================================================================== */

.play-button,
.play-volume {
  width: 65px;
  height: 100%;
  padding: 0 15px;
  cursor: pointer;
  display: block;
  line-height: 46px;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  text-align: center;
}

.play-button:hover,
.play-volume:hover {
  background-color: rgba(255, 255, 255, 0.05);
}

.play-button {
  border-right: 1px solid rgba(0, 56, 113, 0.3);
}

.play-button i {
  color: #fff;
}

.play-volume {
  border-left: 1px solid #003871;
  position: relative;
}

.play-volume i {
  font-size: 18px;
  font-size: 1.8rem;
  color: #fff;
}

.play-volume .tooltip {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  width: 100px;
  height: 34px;
  padding: 0 5px;
  background: #fff;
  left: -20px;
  position: absolute;
  top: 45px;
  z-index: 9;
  display: none;
}

.play-volume .tooltip input {
  width: 100%;
  font-size: 11px;
}

.play-volume .tooltip::before {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(0, 0, 0, 0);
  border-bottom-color: #fff;
  border-width: 5px;
  margin-left: -5px;
}

.play-volume:hover .tooltip {
  display: block;
  display: flex;
}

.play-range {
  width: 100%;
  margin: 0 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
}

.play-range input {
  width: 100%;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.play-seconds {
  font-size: 12px;
  font-size: 1.2rem;
  min-width: 80px;
  color: #fff;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   FEEDBACK
   ========================================================================== */

.box-feedback {
  -webkit-transition: 0.2s ease-in width;
  -moz-transition: 0.2s ease-in width;
  -ms-transition: 0.2s ease-in width;
  -o-transition: 0.2s ease-in width;
  transition: 0.2s ease-in width;
  width: 54px;
  bottom: 20px;
  right: 20px;
  position: fixed;
  z-index: 996;
  text-align: center;
}

.box-feedback:hover {
  width: 210px;
}

.box-feedback:hover .feedback-actions {
  width: 100%;
}

.box-feedback.active {
  width: 330px;
}

.box-feedback.active::before {
  width: 100%;
  height: 100%;
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  display: block;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 9;
}

.box-feedback.active .feedback-form {
  display: block;
}

.box-feedback.active .btn-feedback-open {
  display: none;
}

.box-feedback.active .loading {
  display: none;
}

.box-feedback.success .feedback-send,
.box-feedback.success .btn-feedback-send {
  display: none;
}

.active .feedback-actions {
  width: 140px !important;
}

.success .feedback-actions {
  width: 54px !important;
}

.feedback-actions {
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  width: 54px;
  height: 54px;
  margin: 0 auto;
  background-color: #0075ea;
  color: #fff;
  display: inline-block;
  line-height: 54px;
  position: relative;
  overflow: hidden;
  text-align: center;
  vertical-align: bottom;
  z-index: 9;
}

.feedback-actions i {
  font-size: 20px;
  font-size: 2rem;
  color: inherit;
  display: inline-block;
  vertical-align: middle;
}

.feedback-actions a,
.feedback-actions button {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  width: 100%;
  height: 100%;
  background-color: transparent;
  color: inherit;
  display: block;
}

.feedback-actions button[disabled] {
  background-color: #c0cbd6;
}

.feedback-actions button[disabled]:hover {
  background-color: #c0cbd6;
}

.feedback-actions:hover {
  width: 100%;
}

.feedback-actions:hover .btn-feedback-open i {
  margin-right: 10px;
}

.feedback-actions:hover .btn-feedback-open span {
  opacity: 1;
  filter: alpha(opacity=100);
}

.btn-feedback-open {
  width: 100%;
  color: #fff;
  display: block;
}

.btn-feedback-open span {
  opacity: 0;
  filter: alpha(opacity=0);
  display: inline-block;
}

.feedback-form {
  position: relative;
  display: none;
  text-align: center;
  z-index: 99;
}

.feedback-form select,
.feedback-form textarea {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  border: 1px solid #c3ced8;
  outline: none;
}

.feedback-form select {
  -webkit-border-radius: 23px;
  -moz-border-radius: 23px;
  border-radius: 23px;
  padding: 0 20px;
  margin-bottom: 25px;
  height: 46px;
}

.feedback-form textarea {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  height: 230px;
  padding: 15px;
  resize: none;
}

.feedback-form-content {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  opacity: 0;
  filter: alpha(opacity=0);
  width: 330px;
  margin-bottom: 20px;
  background-color: #fff;
  bottom: -10px;
}

.feedback-form-content::after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(249, 250, 252, 0);
  border-top-color: #f9fafc;
  border-width: 8px;
  margin-left: -8px;
}

.feedback-header {
  font-size: 21px;
  font-size: 2.1rem;
  -webkit-border-radius: 6px 6px 0 0;
  -moz-border-radius: 6px 6px 0 0;
  border-radius: 6px 6px 0 0;
  width: 100%;
  padding: 20px;
  border-bottom: 1px solid #ddd;
  background-color: #fff;
  text-align: left;
}

.feedback-header .btn-feedback-close {
  color: inherit;
  float: right;
}

.btn-feedback-send {
  text-transform: uppercase;
}

.btn-feedback-send i {
  margin-left: 20px;
}

.feedback-content {
  -webkit-border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
  padding: 20px;
  background-color: #f9fafc;
}

.feedback-msg {
  padding: 50px;
}

.feedback-msg .sa-icon-box .sa-icon {
  margin: 0;
}

.feedback-msg > div {
  margin-bottom: 30px;
}

.feedback-msg > span {
  margin-bottom: 20px;
  display: block;
  font-size: 21px;
  font-size: 2.1rem;
}

.feedback-msg > p {
  font-size: 14px;
  font-size: 1.4rem;
  color: #afbdca;
}

/*
   ANIMATE
   ========================================================================== */

.feedback-form-content {
  -webkit-animation: enter 0.2s 1 forwards ease-in 0.2s;
  -moz-animation: enter 0.2s 1 forwards ease-in 0.2s;
  -ms-animation: enter 0.2s 1 forwards ease-in 0.2s;
  -o-animation: enter 0.2s 1 forwards ease-in 0.2s;
  animation: enter 0.2s 1 forwards ease-in 0.2s;
}

@-webkit-keyframes enter {
  from {
    opacity: 0;
    bottom: -20px;
  }

  to {
    opacity: 1;
    bottom: 0;
  }
}

@-moz-keyframes enter {
  from {
    opacity: 0;
    bottom: -20px;
  }

  to {
    opacity: 1;
    bottom: 0;
  }
}

@-ms-keyframes enter {
  from {
    opacity: 0;
    bottom: -20px;
  }

  to {
    opacity: 1;
    bottom: 0;
  }
}

@-o-keyframes enter {
  from {
    opacity: 0;
    bottom: -20px;
  }

  to {
    opacity: 1;
    bottom: 0;
  }
}

@keyframes enter {
  from {
    opacity: 0;
    bottom: -20px;
  }

  to {
    opacity: 1;
    bottom: 0;
  }
}

/* ==========================================================================
   CARD
   ========================================================================== */

.button.close {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: none;
  border: 0;
}

.close {
  font-size: 21px;
  font-size: 2.1rem;
  opacity: 0.2;
  filter: alpha(opacity=20);
  padding: 0;
  border: 0;
  background: none;
  float: right;
  font-weight: 700;
  line-height: 1;
  color: #000;
  text-shadow: 0 1px 0 #fff;
}

.alert-dismissable .close,
.alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}

.alert {
  min-height: 40px;
  padding: 15px;
  margin-bottom: 20px;
  border: 1px solid transparent;
  border-radius: 4px;
}

.alert h4 {
  margin-top: 0;
  color: inherit;
}

.alert > p,
.alert > ul {
  margin-bottom: 0;
}

.alert > p + p {
  margin-top: 5px;
}

.alert .alert-link {
  font-weight: bold;
}

.alert .alert-dismissable,
.alert .alert-dismissible {
  padding-right: 35px;
}

.alert .alert-dismissable .close,
.alert .alert-dismissible .close {
  position: relative;
  top: -2px;
  right: -21px;
  color: inherit;
}

.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.alert-success hr {
  border-top-color: #c9e2b3;
}

.alert-success .alert-link {
  color: #2b542c;
}

.alert-info {
  background-color: #d9edf7;
  border-color: #bce8f1;
  color: #31708f;
}

.alert-info hr {
  border-top-color: #a6e1ec;
}

.alert-info .alert-link {
  color: #245269;
}

.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

.alert-warning hr {
  border-top-color: #f7e1b5;
}

.alert-warning .alert-link {
  color: #66512c;
}

.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}

.alert-danger hr {
  border-top-color: #e4b9c0;
}

.alert-danger .alert-link {
  color: #843534;
}

.page-settings .growl-container,
.box-center .growl-container {
  position: absolute !important;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  left: 50%;
  right: auto !important;
  top: 30px !important;
}

.growl-message a {
  color: inherit;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.nodata {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  width: 100%;
  padding: 30px;
  background: #fff;
  display: inline-block;
  text-align: center;
  vertical-align: top;
  margin-bottom: 30px;
}

.nodata figure,
.nodata .description {
  display: inline-block;
  vertical-align: top;
}

.nodata img {
  width: 100%;
  max-width: 413px;
}

.nodata figure {
  width: 40%;
  margin: 0;
}

.nodata .description {
  width: 50%;
  text-align: center;
}

.nodata h2 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.nodata small {
  font-weight: normal;
  display: block;
}

.nodata .fe-icon {
  margin-left: 20px;
}

.nodata .box {
  width: 100%;
  padding: 50px 35px;
}

.nodata--large {
  width: 100%;
  padding: 50px;
  text-align: center;
}

.nodata--large h2 {
  margin-bottom: 30px;
}

.nodata--large h2 small {
  display: block;
}

.nodata--large .zero-data-message {
  padding: 0;
}

.nodata--inside {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   STEPS
   ========================================================================== */

.edusynch-webapp {
  /* .introjs-tooltipReferenceLayer {
    z-index: 999 !important;
  }

  .introjs-overlay {
    z-index: 997 !important;
  } */
}

.edusynch-webapp .introjs-tooltip {
  max-width: 300px;
  text-align: center;
  padding: 30px;
}

.edusynch-webapp .introjs-prevbutton,
.edusynch-webapp .introjs-nextbutton,
.edusynch-webapp .introjs-button {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  font-size: 13px;
  font-size: 1.3rem;
  padding: 0 20px;
  height: 34px;
  background: #0075ea !important;
  border: none;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  line-height: 34px;
  outline: none;
  text-shadow: none !important;
}

.edusynch-webapp .introjs-prevbutton span,
.edusynch-webapp .introjs-nextbutton span,
.edusynch-webapp .introjs-button span {
  color: inherit !important;
}

.edusynch-webapp .introjs-prevbutton + .introjs-button,
.edusynch-webapp .introjs-nextbutton + .introjs-button,
.edusynch-webapp .introjs-button + .introjs-button {
  margin-left: 10px;
}

.edusynch-webapp .introjs-prevbutton:hover,
.edusynch-webapp .introjs-nextbutton:hover,
.edusynch-webapp .introjs-button:hover {
  background-color: #003871 !important;
  text-shadow: none !important;
}

.edusynch-webapp .introjs-disabled {
  background-color: rgba(93, 102, 112, 0.4) !important;
}

.edusynch-webapp .introjs-disabled:hover {
  background-color: rgba(93, 102, 112, 0.4) !important;
  color: #fff !important;
}

.edusynch-webapp .introjs-tooltipbuttons {
  margin-top: 15px;
  text-align: center;
}

.edusynch-webapp .introjs-bullets {
  margin-top: 10px;
}

.edusynch-webapp .introjs-bullets ul li a {
  width: 10px;
  height: 10px;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   TABLES
   ========================================================================== */

.table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.table th,
.table td {
  padding: 16px 14px;
  vertical-align: top;
  text-align: left;
}

.table thead th {
  vertical-align: bottom;
  border-bottom: 2px solid #e5eef4;
}

.table tbody + tbody {
  border-top: 2px solid #e5eef4;
}

.table--centered th,
.table--centered td {
  text-align: center;
}

.table .table-cell-centered {
  text-align: center;
}

.table-bordered {
  border: 1px solid #e5eef4;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid #e5eef4;
}

.table-bordered thead th,
.table-bordered thead td {
  border-bottom-width: 2px;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: #f3f6f8;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.orb {
  -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
}

/* ==========================================================================
   CARD
   ========================================================================== */

.cambridge-shield {
  display: flex;
}

.cambridge-shield li {
  opacity: 0.3;
  filter: alpha(opacity=30);
}

.cambridge-shield .active {
  opacity: 1;
  filter: alpha(opacity=100);
}

@font-face {
  font-family: "edusynch-icon";
  src: url(b3a35b7767becc65da9808281234eb0a.eot);
  src: url(b3a35b7767becc65da9808281234eb0a.eot?#iefix) format("embedded-opentype"), url(e3118730c5a1c7bbe07e06f34e30995c.woff) format("woff"), url(d8f73d564a88fe59bee747f599d56cc8.ttf) format("truetype"), url(d68b3857d1c225c8f6a1aaa93aa85155.svg#edusynch-icon) format("svg");
  font-weight: normal;
  font-style: normal;
}

.fe-icon {
  font-family: "edusynch-icon";
  display: inline-block;
  line-height: 1;
  font-weight: normal;
  font-style: normal;
  speak: none;
  text-decoration: inherit;
  text-transform: none;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fe-alert-circle:before {
  content: "\F101";
}

.fe-analysis:before {
  content: "\F102";
}

.fe-android:before {
  content: "\F103";
}

.fe-arrow-down-small:before {
  content: "\F104";
}

.fe-arrow-drop-down:before {
  content: "\F105";
}

.fe-arrow-left-small:before {
  content: "\F106";
}

.fe-arrow-left:before {
  content: "\F107";
}

.fe-arrow-right-small:before {
  content: "\F108";
}

.fe-arrow-right:before {
  content: "\F109";
}

.fe-arrow-up-small:before {
  content: "\F10A";
}

.fe-audio:before {
  content: "\F10B";
}

.fe-avg-time:before {
  content: "\F10C";
}

.fe-boleto:before {
  content: "\F10D";
}

.fe-calendar:before {
  content: "\F10E";
}

.fe-camera:before {
  content: "\F10F";
}

.fe-cefr-two-skill:before {
  content: "\F110";
}

.fe-cefr:before {
  content: "\F111";
}

.fe-certificate:before {
  content: "\F112";
}

.fe-change:before {
  content: "\F113";
}

.fe-chart:before {
  content: "\F114";
}

.fe-check-all:before {
  content: "\F115";
}

.fe-check-circle:before {
  content: "\F116";
}

.fe-check-simulation:before {
  content: "\F117";
}

.fe-check:before {
  content: "\F118";
}

.fe-city:before {
  content: "\F119";
}

.fe-clear-all:before {
  content: "\F11A";
}

.fe-clock:before {
  content: "\F11B";
}

.fe-close:before {
  content: "\F11C";
}

.fe-comment-alert:before {
  content: "\F11D";
}

.fe-computer:before {
  content: "\F11E";
}

.fe-copy:before {
  content: "\F11F";
}

.fe-credit-card:before {
  content: "\F120";
}

.fe-custom:before {
  content: "\F121";
}

.fe-door:before {
  content: "\F122";
}

.fe-download:before {
  content: "\F123";
}

.fe-email:before {
  content: "\F124";
}

.fe-expand-exit:before {
  content: "\F125";
}

.fe-expand:before {
  content: "\F126";
}

.fe-eye:before {
  content: "\F127";
}

.fe-facebook:before {
  content: "\F128";
}

.fe-feedback:before {
  content: "\F129";
}

.fe-filter:before {
  content: "\F12A";
}

.fe-fulltest:before {
  content: "\F12B";
}

.fe-go:before {
  content: "\F12C";
}

.fe-google:before {
  content: "\F12D";
}

.fe-help:before {
  content: "\F12E";
}

.fe-info:before {
  content: "\F12F";
}

.fe-information:before {
  content: "\F130";
}

.fe-instagram:before {
  content: "\F131";
}

.fe-jump:before {
  content: "\F132";
}

.fe-key:before {
  content: "\F133";
}

.fe-linkedin:before {
  content: "\F134";
}

.fe-list:before {
  content: "\F135";
}

.fe-listening:before {
  content: "\F136";
}

.fe-lock:before {
  content: "\F137";
}

.fe-logout:before {
  content: "\F138";
}

.fe-notification:before {
  content: "\F139";
}

.fe-overall:before {
  content: "\F13A";
}

.fe-pause:before {
  content: "\F13B";
}

.fe-phone:before {
  content: "\F13C";
}

.fe-photo:before {
  content: "\F13D";
}

.fe-play:before {
  content: "\F13E";
}

.fe-practice:before {
  content: "\F13F";
}

.fe-printer:before {
  content: "\F140";
}

.fe-promo:before {
  content: "\F141";
}

.fe-question-view:before {
  content: "\F142";
}

.fe-reading_writing:before,
.fe-reading-writing:before {
  content: "\F143";
}

.fe-reading:before {
  content: "\F144";
}

.fe-referral:before {
  content: "\F145";
}

.fe-report:before {
  content: "\F146";
}

.fe-rotate-left:before {
  content: "\F147";
}

.fe-rotate-right:before {
  content: "\F148";
}

.fe-sad:before {
  content: "\F149";
}

.fe-school:before {
  content: "\F14A";
}

.fe-send:before {
  content: "\F14B";
}

.fe-settings:before {
  content: "\F14C";
}

.fe-share:before {
  content: "\F14D";
}

.fe-simulation:before {
  content: "\F14E";
}

.fe-smile:before {
  content: "\F14F";
}

.fe-speaking:before {
  content: "\F150";
}

.fe-star:before {
  content: "\F151";
}

.fe-state:before {
  content: "\F152";
}

.fe-stop:before {
  content: "\F153";
}

.fe-student:before {
  content: "\F154";
}

.fe-teacher:before {
  content: "\F155";
}

.fe-timer:before {
  content: "\F156";
}

.fe-total-time:before {
  content: "\F157";
}

.fe-trophy:before {
  content: "\F158";
}

.fe-twitter:before {
  content: "\F159";
}

.fe-upload:before {
  content: "\F15A";
}

.fe-user-detail:before {
  content: "\F15B";
}

.fe-user:before {
  content: "\F15C";
}

.fe-users:before {
  content: "\F15D";
}

.fe-whatsapp:before {
  content: "\F15E";
}

.fe-world:before {
  content: "\F15F";
}

.fe-writing:before {
  content: "\F160";
}

/* ==========================================================================
   CARD
   ========================================================================== */

.menu-dropdown-wrapper {
  min-height: 64px;
  cursor: pointer;
  display: inline-block;
  line-height: 64px;
  position: relative;
}

.menu-dropdown-wrapper:hover .menu-dropdown.menu-dropdown-default,
.menu-dropdown-wrapper .menu-dropdown.menu-dropdown--click.active {
  opacity: 1;
  filter: alpha(opacity=100);
  visibility: visible;
  top: 50px;
  z-index: 9;
  right: 1px;
}

.menu-dropdown-wrapper .menu-dropdown a {
  color: #5d6670;
}

.menu-dropdown-wrapper .menu-dropdown .link-cefr {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.menu-dropdown-wrapper .menu-dropdown .disabled:hover {
  background-color: rgba(0, 56, 113, 0.02);
}

.menu-dropdown-wrapper .menu-dropdown .disabled i,
.menu-dropdown-wrapper .menu-dropdown .disabled .text {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.menu-dropdown-wrapper .menu-dropdown .tooltip-content {
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  max-width: 300px;
  min-width: 180px;
  left: 210px;
  right: auto;
  top: 50%;
  white-space: normal;
  line-height: normal;
}

.menu-dropdown-wrapper .menu-dropdown .tooltip-content::after {
  top: 50%;
  left: auto;
  right: 100%;
  margin: -4px 0 0;
  border-bottom-color: transparent;
  border-right-color: #0075ea;
}

.menu-dropdown {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-box-shadow: 1px 1px 14px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 1px 1px 14px rgba(0, 0, 0, 0.2);
  box-shadow: 1px 1px 14px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  min-width: 220px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  top: 56px;
  visibility: hidden;
}

.menu-dropdown::after {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: white;
  border-width: 6px;
  margin-left: -6px;
}

.menu-dropdown li {
  width: 100%;
  margin: 0;
  display: block;
  text-align: left;
}

.menu-dropdown li + li {
  border-top: 1px solid #eee;
}

.menu-dropdown li a {
  -webkit-transition: 0.1s ease-in all;
  -moz-transition: 0.1s ease-in all;
  -ms-transition: 0.1s ease-in all;
  -o-transition: 0.1s ease-in all;
  transition: 0.1s ease-in all;
  padding: 15px;
  height: auto;
  line-height: 22px;
  color: #5d6670;
  display: block;
  text-shadow: none;
}

.menu-dropdown li a:hover {
  background-color: rgba(0, 56, 113, 0.05);
}

.menu-dropdown li span {
  display: inline-block;
  vertical-align: middle;
}

.user-information .menu-dropdown {
  min-width: 240px;
}

.menu-dropdown__icon {
  font-size: 12px;
  font-size: 1.2rem;
  margin-right: 10px;
}

@media (max-width: 1400px) {
  .menu-dropdown--right {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    left: auto;
    right: -5px;
  }

  .menu-dropdown--right::after {
    left: auto;
    right: 15px;
  }
}

/* ==========================================================================
   CARD
   ========================================================================== */

.tooltip {
  position: relative;
}

.tooltip:hover > .tooltip-content {
  visibility: visible;
  opacity: 1;
  filter: alpha(opacity=100);
  z-index: 3;
}

.tooltip .tooltip-content {
  visibility: hidden;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 11px;
  font-size: 1.1rem;
  -webkit-transition: opacity 0.2s ease-in-out;
  -moz-transition: opacity 0.2s ease-in-out;
  -ms-transition: opacity 0.2s ease-in-out;
  -o-transition: opacity 0.2s ease-in-out;
  transition: opacity 0.2s ease-in-out;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  padding: 8px 10px;
  background: #0075ea;
  display: block;
  position: absolute;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  top: 30px;
  left: 50%;
}

.tooltip .tooltip-content.tooltip-content-left {
  left: 6px;
  top: 35px;
}

.tooltip .tooltip-content::before,
.tooltip .tooltip-content::after {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.tooltip .tooltip-content::after {
  border-color: rgba(0, 117, 234, 0);
  border-bottom-color: #0075ea;
  border-width: 4px;
  margin-left: -4px;
}

.tooltip.large .tooltip-content {
  width: 240px;
  margin-top: 80px;
}

.tooltip-second .tooltip-content {
  -moz-box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.08);
  -webkit-box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.08);
  box-shadow: 1px 2px 2px rgba(0, 0, 0, 0.08);
  min-width: 60px;
  background-color: #fff;
  border: 1px solid #e3e9ee;
  color: #5d6670;
}

.tooltip-second .tooltip-content::after {
  border-color: rgba(255, 255, 255, 0);
  border-bottom-color: #fff;
}

.tooltip-second .tooltip-content::before {
  border-color: rgba(227, 233, 238, 0);
  border-bottom-color: #e3e9ee;
  border-width: 5px;
  margin-left: -5px;
}

.tooltip.tooltip-right .tooltip-content {
  top: -13px;
  left: 190px;
}

.tooltip.tooltip-right .tooltip-content:after {
  top: 50%;
  left: -10px;
  margin-top: -10px;
  border-width: 9px;
  border-style: solid;
  border-color: transparent #0075ea transparent transparent;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.btn {
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  font-size: 16px;
  font-size: 1.6rem;
  padding: 0 40px;
  border: none;
  color: #fff;
  display: inline-block;
  height: 48px;
  line-height: 48px;
  outline: none;
}

.btn--primary {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  background-color: #0075ea;
  cursor: pointer;
}

.btn--primary:hover {
  background-color: #003871;
}

.btn--default {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  background-color: #fff;
  cursor: pointer;
}

.btn--default:hover {
  background-color: #fff;
}

.btn--warning {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  background-color: #fac612;
  cursor: pointer;
}

.btn--warning:hover {
  background-color: #a37f03;
}

.btn--secondary {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  background-color: #11a06f;
  cursor: pointer;
}

.btn--secondary:hover {
  background-color: #30b770;
}

.btn--inverse {
  -webkit-transition: 0.2s ease-in background-color;
  -moz-transition: 0.2s ease-in background-color;
  -ms-transition: 0.2s ease-in background-color;
  -o-transition: 0.2s ease-in background-color;
  transition: 0.2s ease-in background-color;
  background-color: #fff;
  cursor: pointer;
  font-weight: bold;
}

.btn--inverse:hover {
  background-color: #fff;
}

.btn--default {
  border: 1px solid #c3ced8;
}

.btn--default,
.btn--inverse {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  color: #5d6670;
}

.btn--default:hover,
.btn--inverse:hover {
  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.btn--small {
  font-size: 12px;
  font-size: 1.2rem;
  height: 28px;
  line-height: 28px;
  padding: 0 16px;
}

.btn--medium {
  font-size: 14px;
  font-size: 1.4rem;
  height: 32px;
  line-height: 32px;
  padding: 0 20px;
}

.actions .btn {
  margin: 0 auto;
  text-align: center;
}

.actions small {
  display: block;
}

.form-sign-up .actions small a {
  display: inline;
}

button[disabled] {
  background-color: rgba(93, 102, 112, 0.4);
}

button[disabled]:hover {
  background-color: rgba(93, 102, 112, 0.4);
}

/*
   Toggle Style
   ========================================================================== */

.btn-toggle {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1) inset;
  -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1) inset;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1) inset;
  width: 50px;
  height: 20px;
  margin: 5px 0;
  background-color: #eaeff4;
  border: 1px solid #d0d0d0;
  cursor: pointer;
  position: relative;
  display: inline-block;
  user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  outline: none;
}

.btn-toggle button {
  -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  background-color: #fff;
  cursor: pointer;
  display: block;
  outline: 0;
  position: absolute;
  left: 0;
  top: 0;
  width: 26px;
  height: 26px;
  float: left;
  margin: -4px 0 0 -4px;
  border: 1px solid #D0D0D0;
  transition: left 0.3s;
}

.btn-toggle-selected {
  background-color: #5abdfa;
  border-color: transparent;
}

.btn-toggle-selected button {
  background-color: #0075ea;
  left: 26px;
  top: 0;
  margin-right: -4px;
  border: none;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

.btn-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  margin-right: 15px;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.btn-clock i {
  margin-top: -4px;
}

.btn-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.btn-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.btn-clock.minimize edusynch-counter,
.btn-clock.minimize angular-counter {
  display: none;
}

.btn-clock .tooltip-content {
  margin-top: 18px;
  min-width: 80px;
  line-height: normal;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.badge {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  font-size: 10px;
  font-size: 1rem;
  margin: 2px 0 0 5px;
  padding: 0 0.6rem;
  min-width: 20px;
  height: 20px;
  line-height: 20px;
  background-color: #ec3237;
  color: #fff;
  text-align: center;
}

.badge--simulation {
  background-color: #0075ea;
  float: right;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.modal-open {
  overflow: hidden;
}

.modal {
  display: none;
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  -webkit-overflow-scrolling: touch;
  outline: 0;
}

.modal.fade .modal-content {
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -o-transform: scale(0.7);
  transform: scale(0.7);
}

.modal.in .modal-content {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.modal .modal-title {
  font-size: 30px;
  font-size: 3rem;
  font-weight: normal;
  display: inline-block;
  padding: 10px 0;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.modal-dialog {
  -webkit-transition: 0.2s ease-in;
  -moz-transition: 0.2s ease-in;
  -ms-transition: 0.2s ease-in;
  -o-transition: 0.2s ease-in;
  transition: 0.2s ease-in;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  width: auto;
  min-width: 400px;
  max-width: 100%;
  top: 50%;
  left: 50%;
}

@media (max-height: 850px) {
  .modal-dialog {
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: 0;
  }
}

.modal-content {
  -webkit-transition: 0.2s ease-in transform;
  -moz-transition: 0.2s ease-in transform;
  -ms-transition: 0.2s ease-in transform;
  -o-transition: 0.2s ease-in transform;
  transition: 0.2s ease-in transform;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
  margin: 20px 0;
  position: relative;
  background-color: #fff;
  background-clip: padding-box;
  outline: 0;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1049;
  background-color: #e2e8ee;
}

.modal-backdrop.fade {
  opacity: 0;
  filter: alpha(opacity=0);
}

.modal-backdrop.in {
  opacity: 0.95;
  filter: alpha(opacity=95);
}

.modal-header {
  padding: 15px 30px;
  border-bottom: 1px solid #e5e5e5;
}

.modal-header--extra-content {
  display: flex;
}

.modal-header .extra-content {
  display: flex;
  flex-direction: column;
  border-left: 1px solid #ccc;
  padding-left: 30px;
  margin-left: 30px;
  flex: 1;
  justify-content: center;
}

.modal-header .extra-content h4 {
  font-weight: normal;
  font-size: 14px;
  margin: 0 0 2px;
}

.modal-header .extra-content div {
  font-weight: bold;
  font-size: 18px;
}

.modal-header .close {
  margin-top: 9px;
}

.modal-title {
  margin: 0;
  display: inline-block;
  line-height: 1.5rem;
}

.modal-body {
  position: relative;
  padding: 15px 30px;
}

.modal-footer {
  width: 100%;
  padding: 15px 30px;
  text-align: right;
  display: inline-block;
  vertical-align: top;
  border-top: 1px solid #e5e5e5;
}

.modal-footer:after {
  content: "";
  display: table;
  clear: both;
}

.modal-footer .btn + .btn {
  margin-left: 5px;
  margin-bottom: 0;
}

.modal-footer .btn-group .btn + .btn {
  margin-left: -1px;
}

.modal-footer .btn-block + .btn-block {
  margin-left: 0;
}

.modal-footer .btn {
  font-size: 14px;
  font-size: 1.4rem;
  color: #5d6670;
  text-transform: uppercase;
}

.modal-footer .btn--primary {
  color: #fff;
}

.modal-footer .btn-cancel {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  opacity: 1;
  filter: alpha(opacity=100);
  background: #fff;
  border: 1px solid #c3ced8;
  float: left;
}

.modal-footer .btn-cancel:hover {
  background: #fafafa;
}

.modal-footer .btn-confirm {
  color: #fff;
  float: right;
}

.modal-agreement .modal-footer {
  text-align: center;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   FORM
   ========================================================================== */

form input,
form select {
  font-size: 16px;
  font-size: 1.6rem;
  width: 100%;
  height: 40px;
  background: transparent;
  outline: none;
  border: none;
}

input {
  background: transparent;
  outline: none;
  border: none;
}

.select,
.select--options {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 2px solid #dde4ea;
  padding: 0 20px;
  height: 40px;
}

.select:hover,
.select--options:hover {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

label + .select,
label +
  .select--options {
  margin-top: 10px;
}

.select--options {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  font-size: 12px;
  font-size: 1.2rem;
  color: #5d6670;
  height: 34px;
  line-height: 34px;
  padding-left: 12px;
  margin-left: 10px;
  margin-bottom: 8px;
}

.select--options:hover {
  -moz-box-shadow: 0 2px 5px rgba(93, 102, 112, 0.1);
  -webkit-box-shadow: 0 2px 5px rgba(93, 102, 112, 0.1);
  box-shadow: 0 2px 5px rgba(93, 102, 112, 0.1);
}

/*
   CONTENT INPUT
   ========================================================================== */

.content-input {
  width: 100%;
  display: inline-block;
  position: relative;
}

.content-input i {
  font-size: 14px;
  font-size: 1.4rem;
  -webkit-transition: 0.3s ease-in all;
  -moz-transition: 0.3s ease-in all;
  -ms-transition: 0.3s ease-in all;
  -o-transition: 0.3s ease-in all;
  transition: 0.3s ease-in all;
  color: #aebecd;
  left: 0;
  position: absolute;
  top: 14px;
}

.content-input input {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-transition: 0.3s ease-in all;
  -moz-transition: 0.3s ease-in all;
  -ms-transition: 0.3s ease-in all;
  -o-transition: 0.3s ease-in all;
  transition: 0.3s ease-in all;
  width: 100%;
  padding-left: 30px;
  border: none;
}

.content-input input::-webkit-input-placeholder {
  color: #aebecd;
}

.content-input input::input-placeholder {
  color: #aebecd;
}

.content-input input:focus {
  padding-left: 0;
}

.content-input input:focus::-webkit-input-placeholder {
  color: rgba(221, 228, 234, 0.6);
}

.content-input input:focus ~ .content-input {
  background-color: black;
}

.content-input input:focus ~ .bar::before,
.content-input input:focus ~ .bar::after {
  opacity: 1;
  filter: alpha(opacity=100);
  width: 50%;
}

.content-input input:focus ~ i {
  left: -25px;
}

.content-input .file-input {
  height: 40px;
  display: block;
  line-height: 40px;
  text-align: left;
  padding-left: 30px;
}

.content-input .bar {
  width: 100%;
  height: 2px;
  position: relative;
  display: block;
  background-color: #aebecd;
}

.content-input .bar::before,
.content-input .bar::after {
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: 0.2s all ease-in;
  -moz-transition: 0.2s all ease-in;
  -ms-transition: 0.2s all ease-in;
  -o-transition: 0.2s all ease-in;
  transition: 0.2s all ease-in;
  content: '';
  display: block;
  width: 5px;
  height: 2px;
  background-color: #003871;
  position: absolute;
  bottom: 0;
}

.content-input .bar::before {
  left: 50%;
}

.content-input .bar::after {
  right: 50%;
}

.content-input--bordered {
  display: flex;
}

.content-input--bordered input {
  height: 48px;
  border-radius: 6px;
  border: 1px solid #E0DEEA;
  padding-left: 46px;
  transition: border-color 0.4s ease-in-out;
}

.content-input--bordered input:focus {
  border-color: #aebecd;
  padding-left: 46px;
}

.content-input--bordered input:focus ~ i {
  color: #aebecd;
  left: 16px;
  top: 16px;
  font-size: 1.6rem;
}

.content-input--bordered input.ng-invalid-email {
  border: 1px solid #ec3237;
}

.content-input--bordered input.ng-invalid-email ~ i {
  color: #ec3237;
}

.content-input--bordered i {
  color: #E0DEEA;
  left: 16px;
  top: 16px;
  font-size: 1.6rem;
}

button {
  border: none;
  outline: none;
}

input[type='number']:not(:disabled) {
  border: 1px solid #dde4ea;
  padding: 4px 8px;
}

.form-describe textarea {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  width: 100%;
  display: block;
  border: 1px solid rgba(93, 102, 112, 0.2);
  min-height: 130px;
  resize: none;
  outline: none;
  line-height: 180%;
  line-height: 1.8rem;
}

.form-describe label {
  margin-bottom: 5px;
  font-weight: bold;
  display: block;
}

.form-describe .word-count {
  margin-top: 5px;
  float: right;
  display: block;
}

.form-describe .word-count span {
  font-weight: bold;
}

.form-describe .word-count.block {
  color: #ec3237;
}

.square-checkbox {
  position: relative;
}

.square-checkbox input {
  opacity: 0.01;
  filter: alpha(opacity=1);
  width: 30px;
  height: 30px;
  margin-right: 0;
  cursor: pointer;
  position: absolute;
  left: -3px;
  top: -5px;
}

.square-checkbox .square {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  width: 22px;
  height: 22px;
  margin: 0 auto;
  display: block;
  background-color: #e2e8ee;
  cursor: pointer;
}

.square-checkbox .square.correct,
.square-checkbox.selected .square.correct {
  border-color: #30b770;
  background-color: #30b770;
  color: #fff;
}

.square-checkbox .square.wrong,
.square-checkbox.selected .square.wrong {
  border-color: #ec3237;
  background-color: #ec3237;
  color: #fff;
}

.square-checkbox.selected .square {
  border-color: #0075ea;
  background-color: #0075ea;
  color: #fff;
}

.orb-radio,
.input-radio {
  position: relative;
}

.orb-radio {
  position: relative;
}

.orb-radio input {
  opacity: 0.01;
  filter: alpha(opacity=1);
  width: 30px;
  height: 30px;
  margin-right: 0;
  cursor: pointer;
  position: absolute;
  left: -3px;
  top: -5px;
}

.orb-radio .orb {
  background-color: #e2e8ee;
  cursor: pointer;
  margin: 0;
}

.orb-radio .orb.correct {
  background-color: #30b770;
  color: #fff;
}

.orb-radio.selected .orb {
  border-color: #0075ea;
  background-color: #0075ea;
  color: #fff;
}

.orb-radio.selected .orb.correct {
  border-color: #30b770;
  background-color: #30b770;
  color: #fff;
}

.orb-radio.selected .orb.wrong {
  border-color: #ec3237;
  background-color: #ec3237;
  color: #fff;
}

.input-radio__container,
.input-radio__rounded,
.input-radio__rounded::after {
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
}

.input-radio__container {
  padding: 8px 12px;
  border: 2px solid transparent;
  display: block;
}

.input-radio__container--selected {
  border-color: #0075ea;
}

.input-radio__container--selected .input-radio__rounded {
  background: #0075ea;
  border-color: #0075ea;
}

.input-radio__container--selected .input-radio__rounded::after {
  border: 1px solid #0075ea;
}

.input-radio__rounded {
  width: 32px;
  height: 32px;
  display: inline-block;
  border: 1px solid #dde4ea;
  position: relative;
  margin-right: 8px;
}

.input-radio__rounded--small {
  width: 12px;
  height: 12px;
}

.input-radio__rounded::after {
  content: '';
  width: 150%;
  height: 150%;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.input-radio > input {
  visibility: hidden;
  height: 0;
  width: 0;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   ANSWER
   ========================================================================== */

.correct-box h2 {
  color: #1bd171;
}

.wrong-box h2 {
  color: #F27474;
}

.skip-box h2 {
  color: #F8BB86;
}

.answer-message-box {
  margin-right: 100px;
  display: inline-block;
}

.answer-message-box h2 {
  vertical-align: middle;
  display: inline-block;
  line-height: 100%;
  font-weight: normal;
  text-align: left;
}

.answer-message-box h2 em {
  font-weight: bold;
  display: block;
}

.answer-message-box.message-writing {
  margin-right: 55px;
}

.sa-icon-box .sa-icon {
  zoom: 0.6;
  -moz-transform: scale(0.6);
  width: 80px;
  height: 80px;
  border: 4px solid gray;
  -webkit-border-radius: 40px;
  border-radius: 40px;
  border-radius: 50%;
  margin: 0 30px 0 auto;
  padding: 0;
  position: relative;
  box-sizing: content-box;
  display: inline-block;
  vertical-align: middle;
}

.sa-icon-box .sa-icon.sa-error {
  border-color: #F27474;
  background: #F27474;
}

.sa-icon-box .sa-icon.sa-error .sa-x-mark {
  position: relative;
  display: block;
}

.sa-icon-box .sa-icon.sa-error .sa-line {
  position: absolute;
  height: 5px;
  width: 47px;
  background-color: white;
  display: block;
  top: 37px;
  border-radius: 2px;
}

.sa-icon-box .sa-icon.sa-error .sa-line.sa-left {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 17px;
}

.sa-icon-box .sa-icon.sa-error .sa-line.sa-right {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  right: 16px;
}

.sa-icon-box .sa-icon.sa-success {
  border-color: #1bd171;
  background-color: #1bd171;
}

.sa-icon-box .sa-icon.sa-success::before,
.sa-icon-box .sa-icon.sa-success::after {
  content: '';
  -webkit-border-radius: 40px;
  border-radius: 40px;
  border-radius: 50%;
  position: absolute;
  width: 60px;
  height: 120px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.sa-icon-box .sa-icon.sa-success::before {
  -webkit-border-radius: 120px 0 0 120px;
  border-radius: 120px 0 0 120px;
  top: -7px;
  left: -33px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transform-origin: 60px 60px;
  transform-origin: 60px 60px;
}

.sa-icon-box .sa-icon.sa-success::after {
  -webkit-border-radius: 0 120px 120px 0;
  border-radius: 0 120px 120px 0;
  top: -11px;
  left: 30px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transform-origin: 0px 60px;
  transform-origin: 0px 60px;
}

.sa-icon-box .sa-icon.sa-success .sa-placeholder {
  width: 80px;
  height: 80px;
  -webkit-border-radius: 40px;
  border-radius: 40px;
  border-radius: 50%;
  box-sizing: content-box;
  position: absolute;
  left: -4px;
  top: -4px;
  z-index: 2;
}

.sa-icon-box .sa-icon.sa-success .sa-fix {
  width: 5px;
  height: 90px;
  position: absolute;
  left: 28px;
  top: 8px;
  z-index: 1;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.sa-icon-box .sa-icon.sa-success .sa-line {
  height: 5px;
  background-color: white;
  display: block;
  border-radius: 2px;
  position: absolute;
  z-index: 2;
}

.sa-icon-box .sa-icon.sa-success .sa-line.sa-tip {
  width: 25px;
  left: 14px;
  top: 46px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.sa-icon-box .sa-icon.sa-success .sa-line.sa-long {
  width: 47px;
  right: 8px;
  top: 38px;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.sa-icon-box .sa-icon.sa-skipped {
  border-color: #F8BB86;
  background-color: #F8BB86;
}

.sa-icon-box .sa-icon.sa-skipped .sa-sub-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -4px;
  margin-left: -20px;
  width: 40px;
  height: 8px;
  background: white;
}

/*
 * Animations
 */

@-webkit-keyframes animateSuccessTip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }

  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }

  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}

@keyframes animateSuccessTip {
  0% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  54% {
    width: 0;
    left: 1px;
    top: 19px;
  }

  70% {
    width: 50px;
    left: -8px;
    top: 37px;
  }

  84% {
    width: 17px;
    left: 21px;
    top: 48px;
  }

  100% {
    width: 25px;
    left: 14px;
    top: 45px;
  }
}

@-webkit-keyframes animateSuccessLong {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  84% {
    width: 55px;
    right: 0px;
    top: 35px;
  }

  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}

@keyframes animateSuccessLong {
  0% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  65% {
    width: 0;
    right: 46px;
    top: 54px;
  }

  84% {
    width: 55px;
    right: 0px;
    top: 35px;
  }

  100% {
    width: 47px;
    right: 8px;
    top: 38px;
  }
}

@-webkit-keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  5% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  12% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg);
  }

  100% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg);
  }
}

@keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  5% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  12% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg);
  }

  100% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg);
  }
}

.animateSuccessTip {
  -webkit-animation: animateSuccessTip 0.75s;
  animation: animateSuccessTip 0.75s;
}

.animateSuccessLong {
  -webkit-animation: animateSuccessLong 0.75s;
  animation: animateSuccessLong 0.75s;
}

.sa-icon.sa-success.animate::after {
  -webkit-animation: rotatePlaceholder 4.25s ease-in;
  animation: rotatePlaceholder 4.25s ease-in;
}

@-webkit-keyframes animateErrorIcon {
  0% {
    -webkit-transform: rotateX(100deg);
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    opacity: 1;
  }
}

@keyframes animateErrorIcon {
  0% {
    -webkit-transform: rotateX(100deg);
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    opacity: 1;
  }
}

.animateErrorIcon {
  -webkit-animation: animateErrorIcon 0.5s;
  animation: animateErrorIcon 0.5s;
}

@-webkit-keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotate-loading {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes animateSkipIcon {
  0% {
    -webkit-transform: scale(0.1);
    opacity: 0;
  }

  100% {
    -webkit-transform: scale(1.1);
    opacity: 1;
  }
}

@keyframes animateSkipIcon {
  0% {
    -webkit-transform: scale(0.1);
    opacity: 0;
  }

  100% {
    -webkit-transform: scale(1.1);
    opacity: 1;
  }
}

.animateSkipIcon {
  -webkit-animation: animateSkipIcon 0.5s;
  animation: animateSkipIcon 0.5s;
}

.box-left .answer-message-box {
  margin-right: 0;
  float: left;
}

.box-left .btn-next {
  margin-top: 23px;
  float: right;
}

@media screen and (max-width: 1200px) {
  .answer-message-box.message-writing {
    margin-right: 35px;
  }

  .answer-message-box.message-writing h2 {
    font-size: 16px;
    font-size: 1.6rem;
  }

  .question__footer .btn {
    min-width: 130px;
    width: auto !important;
    padding: 0 30px !important;
  }
}

/* ==========================================================================
   CARD
   ========================================================================== */

.sticker {
  padding: 16px 20px;
}

.sticker .close {
  margin-top: -3px;
}

.sticker-link {
  color: white;
}

.sticker-success {
  background: #30b770;
  color: white;
}

.sticker-info {
  background: #2a6dcd;
  color: white;
}

.sticker-warning {
  background: #fac612;
  color: white;
}

.sticker-danger {
  background: #ec3237;
  color: white;
}

.sticker-open .header-internal {
  top: 64px;
}

.sticker-open #main {
  padding-top: 104px;
}

.sticker-open .notification-backdrop,
.sticker-open .notification-menu {
  top: 114px;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.avatar {
  margin: 0;
}

.avatar > img {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 96px;
  height: 96px;
}

.avatar--small > img {
  width: 34px;
  height: 34px;
}

.avatar--medium > img {
  width: 64px;
  height: 64px;
}

.avatar--large > img {
  width: 96px;
  height: 96px;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Disclaimer
   ========================================================================== */

.disclaimer-content h3 {
  text-align: center;
  margin-bottom: 20px;
}

.disclaimer-list {
  list-style: initial;
  padding-left: 39px;
  max-width: 680px;
}

.disclaimer-list li {
  margin-bottom: 20px;
}

.disclamer-agree {
  padding: 1.5rem 1.8rem;
  background: #f7f7f7;
  display: block;
  border-radius: 4px;
  margin-bottom: 20px;
}

.modal.disclaimer-content .modal-dialog {
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  min-width: 700px;
  position: absolute;
  left: 50%;
  top: 0;
}

/* ==========================================================================
   CARD
   ========================================================================== */

.explanation {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 320px;
  z-index: 9;
  background: #fff;
  overflow: auto;
}

.explanation h3 {
  font-size: 16px;
  font-size: 1.6rem;
  cursor: pointer;
  background: #eff3f9;
  font-weight: bold;
  text-transform: uppercase;
  position: relative;
  outline: none;
}

.explanation h3 i {
  position: absolute;
  top: 50%;
  right: 20px;
  margin-top: -8px;
}

.explanation .active h3 i {
  -ms-transform: rotate(180deg);
  /* IE 9 */
  -webkit-transform: rotate(180deg);
  /* Chrome, Safari, Opera */
  transform: rotate(180deg);
}

.explanation .good h3 {
  background: #edfcf5;
  color: #00864f;
}

.explanation .good .audio-passage__play {
  background-color: #11a06f;
}

.explanation .bad h3 {
  background: #fdeded;
  color: #a81014;
}

.explanation .bad .audio-passage__play {
  background-color: #ec3237;
}

.explanation .audio-passage__play + div {
  margin-top: 20px;
}

.explanation h3,
.explanation-content {
  padding: 1.8rem;
}

.active .explanation-content {
  display: block;
}

.explanation-content {
  display: none;
  white-space: pre-wrap;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   BOX REMAINING
   ========================================================================== */

.widget-remaining {
  width: 100%;
  min-width: 240px;
  height: 80px;
}

.widget-remaining h4 {
  font-size: 11px;
  font-size: 1.1rem;
  margin: 0;
  padding: 15px 15px 10px;
  font-weight: normal;
  line-height: normal;
  text-transform: uppercase;
}

.widget-remaining .box-footer {
  width: 100%;
  padding: 20px 0;
  border-top: 1px solid #e2e8ee;
  display: inline-block;
  text-align: center;
}

.remaining-count {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-content: center;
  -moz-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  width: 100%;
  padding: 0 15px 10px;
  vertical-align: top;
  line-height: normal;
}

.remaining-count li {
  width: 100%;
  border: none !important;
  font-weight: bold;
  text-align: left;
}

.remaining-count li.disabled {
  opacity: 0.3;
  filter: alpha(opacity=30);
}

.remaining-count i {
  margin-right: 0;
  font-weight: bold;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   PAGINATION
   ========================================================================== */

.pagination-content {
  margin: 30px auto;
  text-align: center;
  display: block;
}

.pagination {
  display: inline-block;
  text-align: center;
}

.pagination li {
  display: inline-block;
}

.pagination li + li {
  margin-left: 10px;
}

.pagination li a {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  font-size: 14px;
  font-size: 1.4rem;
  width: 32px;
  height: 32px;
  background-color: #fff;
  color: #5d6670;
  display: block;
  line-height: 32px;
}

.pagination li.active a,
.pagination li:hover a {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   MEDIA
   ========================================================================== */

.media {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
  margin-bottom: 1em;
}

.media__figure {
  margin-right: 22px;
}

.media__body {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

/* line 1, ../../source/scss/ng-img-crop.scss */

img-crop,
ui-cropper {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}

/* line 7, ../../source/scss/ng-img-crop.scss */

img-crop canvas,
ui-cropper canvas {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  outline: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  /* mobile webkit */
}

/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   OUTDATED
   ========================================================================== */

#outdated {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  text-transform: uppercase;
  z-index: 1500;
  background-color: #0075ea;
  color: #fff;
}

#outdated h6 {
  font-size: 25px;
  line-height: 25px;
  margin: 30px 0 10px;
}

#outdated p {
  font-size: 12px;
  line-height: 12px;
  margin: 0;
}

#outdated #btnUpdateBrowser {
  display: block;
  position: relative;
  padding: 10px 20px;
  margin: 30px auto 0;
  max-width: 300px;
  min-width: 230px;
  /*need for IE*/
  color: #fff;
  text-decoration: none;
  border: 2px solid #fff;
  cursor: pointer;
}

#outdated #btnUpdateBrowser:hover {
  color: #0075ea;
  background-color: #fff;
}

#outdated .last {
  display: none;
  position: absolute;
  top: 10px;
  right: 25px;
  width: 20px;
  height: 20px;
}

#outdated .last[dir='rtl'] {
  right: auto !important;
  left: 25px !important;
}

#outdated #btnCloseUpdateBrowser {
  display: none;
  position: relative;
  width: 100%;
  height: 100%;
  text-decoration: none;
  color: #fff;
  font-size: 36px;
  line-height: 36px;
}

* html #outdated {
  position: absolute;
}

/*!
 * ui-select
 * http://github.com/angular-ui/ui-select
 * Version: 0.19.7 - 2017-04-15T14:28:36.790Z
 * License: MIT
 */

/* ==========================================================================
   CARD
   ========================================================================== */

/* Style when highlighting a search. */

.ui-select-highlight {
  font-weight: bold;
}

.ui-select-offscreen {
  clip: rect(0 0 0 0) !important;
  width: 1px !important;
  height: 1px !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  outline: 0 !important;
  left: 0px !important;
  top: 0px !important;
}

.ui-select-choices-row:hover {
  background-color: #f5f5f5;
}

/* Select2 theme */

/* Mark invalid Select2 */

.ng-dirty.ng-invalid > a.select2-choice {
  border-color: #ec3237;
}

.select2-result-single {
  padding-left: 0;
}

.select2-locked > .select2-search-choice-close {
  display: none;
}

.select-locked > .ui-select-match-close {
  display: none;
}

body > .select2-container.open {
  z-index: 9;
  /* The z-index Select2 applies to the select2-drop */
}

/* Handle up direction Select2 */

.ui-select-container[theme="select2"].direction-up .ui-select-match,
.ui-select-container.select2.direction-up .ui-select-match {
  border-radius: 3px;
  /* FIXME hardcoded value :-/ */
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ui-select-container[theme="select2"].direction-up .ui-select-dropdown,
.ui-select-container.select2.direction-up .ui-select-dropdown {
  border-radius: 3px;
  /* FIXME hardcoded value :-/ */
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top-width: 1px;
  /* FIXME hardcoded value :-/ */
  border-top-style: solid;
  box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.25);
  margin-top: -4px;
  /* FIXME hardcoded value :-/ */
}

.ui-select-container[theme="select2"].direction-up .ui-select-dropdown .select2-search,
.ui-select-container.select2.direction-up .ui-select-dropdown .select2-search {
  margin-top: 4px;
  /* FIXME hardcoded value :-/ */
}

.ui-select-container[theme="select2"].direction-up.select2-dropdown-open .ui-select-match,
.ui-select-container.select2.direction-up.select2-dropdown-open .ui-select-match {
  border-bottom-color: #5897fb;
}

.ui-select-container[theme="select2"] .ui-select-dropdown .ui-select-search-hidden,
.ui-select-container[theme="select2"] .ui-select-dropdown .ui-select-search-hidden input {
  opacity: 0;
  height: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

/* Selectize theme */

/* Helper class to show styles when focus */

.selectize-input.selectize-focus {
  border-color: #007FBB !important;
}

/* Fix input width for Selectize theme */

.selectize-control.single > .selectize-input > input {
  width: 100%;
}

/* Fix line break when there's at least one item selected with the Selectize theme */

.selectize-control.multi > .selectize-input > input {
  margin: 0 !important;
}

/* Fix dropdown width for Selectize theme */

.selectize-control > .selectize-dropdown {
  width: 100%;
}

/* Mark invalid Selectize */

.ng-dirty.ng-invalid > div.selectize-input {
  border-color: #D44950;
}

/* Handle up direction Selectize */

.ui-select-container[theme="selectize"].direction-up .ui-select-dropdown {
  box-shadow: 0 -4px 8px rgba(0, 0, 0, 0.25);
  margin-top: -2px;
  /* FIXME hardcoded value :-/ */
}

.ui-select-container[theme="selectize"] input.ui-select-search-hidden {
  opacity: 0;
  height: 0;
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 0;
  width: 0;
}

/*
Version: 3.4.5 Timestamp: Mon Nov  4 08:22:42 PST 2013
*/

.select2-container {
  margin: 0;
  position: relative;
  display: inline-block;
  /* inline-block for ie7 */
  zoom: 1;
  *display: inline;
  vertical-align: middle;
}

.select2-container,
.select2-drop,
.select2-search,
.select2-search input {
  /*
  Force border-box so that % widths fit the parent
  container without overlap because of margin/padding.

  More Info : http://www.quirksmode.org/css/box.html
*/
  -webkit-box-sizing: border-box;
  /* webkit */
  -moz-box-sizing: border-box;
  /* firefox */
  box-sizing: border-box;
  /* css3 */
}

.select2-container .select2-choice {
  display: block;
  height: 40px;
  padding: 0 0 0 8px;
  overflow: hidden;
  position: relative;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: 2px solid #dde4ea;
  white-space: nowrap;
  line-height: 40px;
  text-decoration: none;
  background-clip: padding-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #fff;
}

.select2-container.select2-drop-above .select2-choice {
  border-bottom-color: #aaa;
  border-radius: 0 0 4px 4px;
  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(0.9, #fff));
  background-image: -webkit-linear-gradient(center bottom, #eee 0%, #fff 90%);
  background-image: -moz-linear-gradient(center bottom, #eee 0%, #fff 90%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0);
  background-image: linear-gradient(top, #eee 0%, #fff 90%);
}

.select2-container.select2-allowclear .select2-choice .select2-chosen {
  margin-right: 42px;
}

.select2-container .select2-choice > .select2-chosen {
  margin-right: 26px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.select2-container .select2-choice abbr {
  display: none;
  width: 12px;
  height: 12px;
  position: absolute;
  right: 24px;
  top: 8px;
  font-size: 1px;
  text-decoration: none;
  border: 0;
  cursor: pointer;
  outline: 0;
}

.select2-container.select2-allowclear .select2-choice abbr {
  display: inline-block;
}

.select2-container .select2-choice abbr:hover {
  background-position: right -11px;
  cursor: pointer;
}

.select2-drop-mask {
  border: 0;
  margin: 0;
  padding: 0;
  position: fixed;
  left: 0;
  top: 0;
  min-height: 100%;
  min-width: 100%;
  height: auto;
  width: auto;
  opacity: 0;
  z-index: 8;
  /* styles required for IE to work */
  background-color: #fff;
  filter: alpha(opacity=0);
}

.select2-drop {
  width: 100%;
  margin-top: -1px;
  position: absolute;
  z-index: 9;
  top: 100%;
  background: #fff;
  border: 1px solid #aaa;
  border-top: 0;
  border-radius: 0 0 3px 3px;
  -webkit-box-shadow: 1px 3px 4px 0px rgba(0, 0, 0, 0.11);
  box-shadow: 1px 3px 4px 0px rgba(0, 0, 0, 0.11);
}

.select2-drop-auto-width {
  border-top: 1px solid #aaa;
  width: auto;
}

.select2-drop-auto-width .select2-search {
  padding-top: 4px;
}

.select2-drop.select2-drop-above {
  margin-top: 1px;
  border-top: 1px solid #aaa;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
  -webkit-box-shadow: 0 -4px 5px rgba(0, 0, 0, 0.15);
  box-shadow: 0 -4px 5px rgba(0, 0, 0, 0.15);
}

.select2-drop-active {
  border: 1px solid #5897fb;
  border-top: none;
}

.select2-drop.select2-drop-above.select2-drop-active {
  border-top: 1px solid #5897fb;
}

.select2-container .select2-choice .select2-arrow {
  display: inline-block;
  width: 30px;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  border-radius: 0 3px 3px 0;
  background-clip: padding-box;
}

.select2-container .select2-choice .select2-arrow b {
  display: block;
  width: 100%;
  height: 100%;
  font-family: "edusynch-icon";
  text-align: center;
  line-height: 42px;
}

.select2-container .select2-choice .select2-arrow b::after {
  content: "\F104";
}

.select2-search {
  display: inline-block;
  width: 100%;
  min-height: 32px;
  margin: 0;
  padding-left: 4px;
  padding-right: 4px;
  position: relative;
  z-index: 10000;
  white-space: nowrap;
}

.select2-search input {
  width: 100%;
  height: auto !important;
  min-height: 32px;
  padding: 4px 20px 4px 5px;
  margin: 0;
  outline: 0;
  font-family: sans-serif;
  font-size: 1em;
  border: 1px solid #aaa;
  border-radius: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: #fff;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee));
  background: -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%);
  background: -moz-linear-gradient(center bottom, #fff 85%, #eee 99%);
  background: linear-gradient(top, #fff 85%, #eee 99%);
}

.select2-drop.select2-drop-above .select2-search input {
  margin-top: 4px;
}

.select2-search input.select2-active {
  background: #fff;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee));
  background: -webkit-linear-gradient(center bottom, #fff 85%, #eee 99%);
  background: -moz-linear-gradient(center bottom, #fff 85%, #eee 99%);
  background: linear-gradient(top, #fff 85%, #eee 99%);
}

.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  border: 1px solid #5897fb;
  outline: none;
  -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.select2-dropdown-open .select2-choice {
  border-bottom-color: transparent;
  -webkit-box-shadow: 0 1px 0 #fff inset;
  box-shadow: 0 1px 0 #fff inset;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.select2-dropdown-open.select2-drop-above .select2-choice,
.select2-dropdown-open.select2-drop-above .select2-choices {
  border: 1px solid #5897fb;
  border-top-color: transparent;
}

.select2-dropdown-open .select2-choice .select2-arrow {
  background: transparent;
  border-left: none;
  filter: none;
}

.select2-dropdown-open .select2-choice .select2-arrow b::after {
  content: "\F10A";
}

/* results */

.select2-results {
  max-height: 200px;
  padding: 0 0 0 4px;
  margin: 4px 0;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.select2-results ul.select2-result-sub {
  margin: 0;
  padding-left: 0;
}

.select2-results ul.select2-result-sub > li .select2-result-label {
  padding-left: 20px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 40px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 60px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 80px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 100px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 110px;
}

.select2-results ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub ul.select2-result-sub > li .select2-result-label {
  padding-left: 120px;
}

.select2-results li {
  list-style: none;
  display: list-item;
  background-image: none;
  margin-right: 2px;
}

.select2-results li.select2-result-with-children > .select2-result-label {
  font-weight: bold;
}

.select2-results .select2-result-label {
  padding: 10px;
  margin: 0;
  cursor: pointer;
  min-height: 1em;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.select2-results .select2-highlighted {
  background: #3875d7;
  color: #fff;
}

.select2-results li em {
  background: #feffde;
  font-style: normal;
}

.select2-results .select2-highlighted em {
  background: transparent;
}

.select2-results .select2-highlighted ul {
  background: #fff;
  color: #000;
}

.select2-results .select2-no-results,
.select2-results .select2-searching,
.select2-results .select2-selection-limit {
  background: #f4f4f4;
  display: list-item;
}

/*
disabled look for disabled choices in the results dropdown
*/

.select2-results .select2-disabled.select2-highlighted {
  color: #666;
  background: #f4f4f4;
  display: list-item;
  cursor: default;
}

.select2-results .select2-disabled {
  background: #f4f4f4;
  display: list-item;
  cursor: default;
}

.select2-results .select2-selected {
  display: none;
}

.select2-more-results.select2-active {
  background: #f4f4f4;
}

.select2-more-results {
  background: #f4f4f4;
  display: list-item;
}

/* disabled styles */

.select2-container.select2-container-disabled .select2-choice {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container.select2-container-disabled .select2-choice .select2-arrow {
  background-color: #f4f4f4;
  background-image: none;
  border-left: 0;
}

.select2-container.select2-container-disabled .select2-choice abbr {
  display: none;
}

/* multiselect */

.select2-container-multi .select2-choices {
  height: auto !important;
  height: 1%;
  margin: 0;
  padding: 0;
  position: relative;
  border: 1px solid #aaa;
  cursor: text;
  overflow: hidden;
  background-color: #fff;
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(1%, #eee), color-stop(15%, #fff));
  background-image: -webkit-linear-gradient(top, #eee 1%, #fff 15%);
  background-image: -moz-linear-gradient(top, #eee 1%, #fff 15%);
  background-image: linear-gradient(top, #eee 1%, #fff 15%);
}

.select2-locked {
  padding: 3px 5px 3px 5px !important;
}

.select2-container-multi .select2-choices {
  min-height: 26px;
}

.select2-container-multi.select2-container-active .select2-choices {
  outline: none;
}

.select2-container-multi .select2-choices li {
  float: left;
  list-style: none;
}

.select2-container-multi .select2-choices .select2-search-field {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.select2-container-multi .select2-choices .select2-search-field input {
  padding: 5px;
  margin: 1px 0;
  font-family: sans-serif;
  font-size: 100%;
  color: #666;
  outline: 0;
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: transparent !important;
}

.select2-container-multi .select2-choices .select2-search-field input.select2-active {
  background: #fff;
}

.select2-default {
  color: #999 !important;
}

.select2-container-multi .select2-choices .select2-search-choice {
  padding: 3px 5px 3px 18px;
  margin: 3px 0 3px 5px;
  position: relative;
  line-height: 13px;
  color: #333;
  cursor: default;
  border: 1px solid #aaaaaa;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  box-shadow: 0 0 2px #fff inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  background-clip: padding-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #e4e4e4;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#f4f4f4', GradientType=0);
  background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eee));
  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eee 100%);
}

.select2-container-multi .select2-choices .select2-search-choice .select2-chosen {
  cursor: default;
}

.select2-container-multi .select2-choices .select2-search-choice-focus {
  background: #d4d4d4;
}

.select2-search-choice-close {
  display: block;
  width: 12px;
  height: 13px;
  position: absolute;
  right: 3px;
  top: 4px;
  font-size: 1px;
  outline: none;
}

.select2-container-multi .select2-search-choice-close {
  left: 3px;
}

.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover {
  background-position: right -11px;
}

.select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close {
  background-position: right -11px;
}

/* disabled styles */

.select2-container-multi.select2-container-disabled .select2-choices {
  background-color: #f4f4f4;
  background-image: none;
  border: 1px solid #ddd;
  cursor: default;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
  padding: 3px 5px 3px 5px;
  border: 1px solid #ddd;
  background-image: none;
  background-color: #f4f4f4;
}

.select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close {
  display: none;
  background: none;
}

/* end multiselect */

.select2-result-selectable .select2-match,
.select2-result-unselectable .select2-match {
  text-decoration: underline;
}

.select2-offscreen,
.select2-offscreen:focus {
  clip: rect(0 0 0 0) !important;
  width: 1px !important;
  height: 1px !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  outline: 0 !important;
  left: 0px !important;
  top: 0px !important;
}

.select2-display-none {
  display: none;
}

.select2-measure-scrollbar {
  position: absolute;
  top: -10000px;
  left: -10000px;
  width: 100px;
  height: 100px;
  overflow: scroll;
}

/* Retina-ize icons */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
  .select2-search input {
    background-position: 100% -21px !important;
  }
}

label + .ui-select-container {
  margin-top: 10px;
}

.no-speed-up .simulation-session.speed-up-frame .session-content__left {
  display: none;
}

.no-speed-up .session-content__right .session-end__footer {
  width: 100%;
}

.no-speed-up confirmation-of-use-modal {
  display: none;
}

.no-speed-up .user-information__speed-ups {
  display: none;
}

simulation-cefr .simulation-session .session-end__footer,
simulation-custom-test-cefr .simulation-session .session-end__footer {
  width: 100%;
  left: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

.datepicker {
  border-radius: 4px;
  direction: ltr;
}

.datepicker-inline {
  width: 100%;
  max-width: 400px;
  margin: 0 auto 50px;
}

.datepicker-rtl {
  direction: rtl;
}

.datepicker-rtl.dropdown-menu {
  left: auto;
}

.datepicker-rtl table tr td span {
  float: right;
}

.datepicker-dropdown {
  -moz-box-shadow: 0 0 16px rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 0 0 16px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.15);
  top: 0;
  left: 0;
  padding: 4px 4px 15px 4px;
  position: absolute;
  z-index: 999;
  background: white;
}

.datepicker-dropdown .datepicker-days__header ul {
  background: transparent;
}

.datepicker-dropdown:before {
  content: '';
  display: inline-block;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid rgba(0, 0, 0, 0.15);
  border-top: 0;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  position: absolute;
}

.datepicker-dropdown:after {
  content: '';
  display: inline-block;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #fff;
  border-top: 0;
  position: absolute;
}

.datepicker-dropdown.datepicker-orient-left:before {
  left: 6px;
}

.datepicker-dropdown.datepicker-orient-left:after {
  left: 7px;
}

.datepicker-dropdown.datepicker-orient-right:before {
  right: 6px;
}

.datepicker-dropdown.datepicker-orient-right:after {
  right: 7px;
}

.datepicker-dropdown.datepicker-orient-bottom:before {
  top: -7px;
}

.datepicker-dropdown.datepicker-orient-bottom:after {
  top: -6px;
}

.datepicker-dropdown.datepicker-orient-top:before {
  bottom: -7px;
  border-bottom: 0;
  border-top: 7px solid rgba(0, 0, 0, 0.15);
}

.datepicker-dropdown.datepicker-orient-top:after {
  bottom: -6px;
  border-bottom: 0;
  border-top: 6px solid #fff;
}

.datepicker table {
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.datepicker table tr td,
.datepicker table tr th {
  text-align: center;
  width: 58px;
  height: 24px;
  padding: 6px 16px;
  border-radius: 2px;
  font-size: 12px;
  font-size: 1.2rem;
  border: none;
}

.datepicker table tr th {
  opacity: 0.3;
  filter: alpha(opacity=30);
  font-weight: normal;
  text-transform: uppercase;
  height: 40px;
}

.table-striped .datepicker table tr td,
.table-striped .datepicker table tr th {
  background-color: transparent;
}

.datepicker table tr td.old,
.datepicker table tr td.new {
  color: #5d6670;
}

.datepicker table tr td.day:hover,
.datepicker table tr td.focused {
  background: #edf2f5;
  cursor: pointer;
}

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  background: none;
  color: #5d6670;
  cursor: default;
}

.datepicker table tr td.highlighted {
  color: #5d6670;
  background-color: #d9edf7;
  border-color: #85c5e5;
  border-radius: 0;
}

.datepicker table tr td.highlighted:focus,
.datepicker table tr td.highlighted.focus {
  color: #5d6670;
  background-color: #afd9ee;
  border-color: #298fc2;
}

.datepicker table tr td.highlighted:hover {
  color: #5d6670;
  background-color: #afd9ee;
  border-color: #52addb;
}

.datepicker table tr td.highlighted:active,
.datepicker table tr td.highlighted.active {
  color: #5d6670;
  background-color: #afd9ee;
  border-color: #52addb;
}

.datepicker table tr td.highlighted:active:hover,
.datepicker table tr td.highlighted.active:hover,
.datepicker table tr td.highlighted:active:focus,
.datepicker table tr td.highlighted.active:focus,
.datepicker table tr td.highlighted:active.focus,
.datepicker table tr td.highlighted.active.focus {
  color: #5d6670;
  background-color: #91cbe8;
  border-color: #298fc2;
}

.datepicker table tr td.highlighted.disabled:hover,
.datepicker table tr td.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.highlighted:hover,
.datepicker table tr td.highlighted.disabled:focus,
.datepicker table tr td.highlighted[disabled]:focus,
fieldset[disabled] .datepicker table tr td.highlighted:focus,
.datepicker table tr td.highlighted.disabled.focus,
.datepicker table tr td.highlighted[disabled].focus,
fieldset[disabled] .datepicker table tr td.highlighted.focus {
  background-color: #d9edf7;
  border-color: #85c5e5;
}

.datepicker table tr td.highlighted.focused {
  background: #afd9ee;
}

.datepicker table tr td.highlighted.disabled,
.datepicker table tr td.highlighted.disabled:active {
  background: #d9edf7;
  color: #777777;
}

.datepicker table tr td.today {
  color: #5d6670;
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today:focus,
.datepicker table tr td.today.focus {
  color: #5d6670;
  background-color: #ffc966;
  border-color: #b37400;
}

.datepicker table tr td.today:hover {
  color: #5d6670;
  background-color: #ffc966;
  border-color: #f59e00;
}

.datepicker table tr td.today:active,
.datepicker table tr td.today.active {
  color: #5d6670;
  background-color: #ffc966;
  border-color: #f59e00;
}

.datepicker table tr td.today:active:hover,
.datepicker table tr td.today.active:hover,
.datepicker table tr td.today:active:focus,
.datepicker table tr td.today.active:focus,
.datepicker table tr td.today:active.focus,
.datepicker table tr td.today.active.focus {
  color: #5d6670;
  background-color: #ffbc42;
  border-color: #b37400;
}

.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today[disabled]:hover,
fieldset[disabled] .datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled:focus,
.datepicker table tr td.today[disabled]:focus,
fieldset[disabled] .datepicker table tr td.today:focus,
.datepicker table tr td.today.disabled.focus,
.datepicker table tr td.today[disabled].focus,
fieldset[disabled] .datepicker table tr td.today.focus {
  background-color: #ffdb99;
  border-color: #ffb733;
}

.datepicker table tr td.today.focused {
  background: #ffc966;
}

.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:active {
  background: #ffdb99;
  color: #777777;
}

.datepicker table tr td.range {
  color: #5d6670;
  background-color: #edf2f5;
  border-color: #bbbbbb;
  border-radius: 0;
}

.datepicker table tr td.range:focus,
.datepicker table tr td.range.focus {
  color: #5d6670;
  background-color: #d5d5d5;
  border-color: #7c7c7c;
}

.datepicker table tr td.range:hover {
  color: #5d6670;
  background-color: #d5d5d5;
  border-color: #9d9d9d;
}

.datepicker table tr td.range:active,
.datepicker table tr td.range.active {
  color: #5d6670;
  background-color: #d5d5d5;
  border-color: #9d9d9d;
}

.datepicker table tr td.range:active:hover,
.datepicker table tr td.range.active:hover,
.datepicker table tr td.range:active:focus,
.datepicker table tr td.range.active:focus,
.datepicker table tr td.range:active.focus,
.datepicker table tr td.range.active.focus {
  color: #5d6670;
  background-color: #c3c3c3;
  border-color: #7c7c7c;
}

.datepicker table tr td.range.disabled:hover,
.datepicker table tr td.range[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range:hover,
.datepicker table tr td.range.disabled:focus,
.datepicker table tr td.range[disabled]:focus,
fieldset[disabled] .datepicker table tr td.range:focus,
.datepicker table tr td.range.disabled.focus,
.datepicker table tr td.range[disabled].focus,
fieldset[disabled] .datepicker table tr td.range.focus {
  background-color: #edf2f5;
  border-color: #bbbbbb;
}

.datepicker table tr td.range.focused {
  background: #d5d5d5;
}

.datepicker table tr td.range.disabled,
.datepicker table tr td.range.disabled:active {
  color: #5d6670;
}

.datepicker table tr td.range.highlighted {
  color: #5d6670;
  background-color: #e4eef3;
  border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted:focus,
.datepicker table tr td.range.highlighted.focus {
  color: #5d6670;
  background-color: #c1d7e3;
  border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted:hover {
  color: #5d6670;
  background-color: #c1d7e3;
  border-color: #73a6c0;
}

.datepicker table tr td.range.highlighted:active,
.datepicker table tr td.range.highlighted.active {
  color: #5d6670;
  background-color: #c1d7e3;
  border-color: #73a6c0;
}

.datepicker table tr td.range.highlighted:active:hover,
.datepicker table tr td.range.highlighted.active:hover,
.datepicker table tr td.range.highlighted:active:focus,
.datepicker table tr td.range.highlighted.active:focus,
.datepicker table tr td.range.highlighted:active.focus,
.datepicker table tr td.range.highlighted.active.focus {
  color: #5d6670;
  background-color: #a8c8d8;
  border-color: #4b88a6;
}

.datepicker table tr td.range.highlighted.disabled:hover,
.datepicker table tr td.range.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.highlighted:hover,
.datepicker table tr td.range.highlighted.disabled:focus,
.datepicker table tr td.range.highlighted[disabled]:focus,
fieldset[disabled] .datepicker table tr td.range.highlighted:focus,
.datepicker table tr td.range.highlighted.disabled.focus,
.datepicker table tr td.range.highlighted[disabled].focus,
fieldset[disabled] .datepicker table tr td.range.highlighted.focus {
  background-color: #e4eef3;
  border-color: #9dc1d3;
}

.datepicker table tr td.range.highlighted.focused {
  background: #c1d7e3;
}

.datepicker table tr td.range.highlighted.disabled,
.datepicker table tr td.range.highlighted.disabled:active {
  background: #e4eef3;
  color: #777777;
}

.datepicker table tr td.range.today {
  color: #5d6670;
  background-color: #f7ca77;
  border-color: #f1a417;
}

.datepicker table tr td.range.today:focus,
.datepicker table tr td.range.today.focus {
  color: #5d6670;
  background-color: #f4b747;
  border-color: #815608;
}

.datepicker table tr td.range.today:hover {
  color: #5d6670;
  background-color: #f4b747;
  border-color: #bf800c;
}

.datepicker table tr td.range.today:active,
.datepicker table tr td.range.today.active {
  color: #5d6670;
  background-color: #f4b747;
  border-color: #bf800c;
}

.datepicker table tr td.range.today:active:hover,
.datepicker table tr td.range.today.active:hover,
.datepicker table tr td.range.today:active:focus,
.datepicker table tr td.range.today.active:focus,
.datepicker table tr td.range.today:active.focus,
.datepicker table tr td.range.today.active.focus {
  color: #5d6670;
  background-color: #f2aa25;
  border-color: #815608;
}

.datepicker table tr td.range.today.disabled:hover,
.datepicker table tr td.range.today[disabled]:hover,
fieldset[disabled] .datepicker table tr td.range.today:hover,
.datepicker table tr td.range.today.disabled:focus,
.datepicker table tr td.range.today[disabled]:focus,
fieldset[disabled] .datepicker table tr td.range.today:focus,
.datepicker table tr td.range.today.disabled.focus,
.datepicker table tr td.range.today[disabled].focus,
fieldset[disabled] .datepicker table tr td.range.today.focus {
  background-color: #f7ca77;
  border-color: #f1a417;
}

.datepicker table tr td.range.today.disabled,
.datepicker table tr td.range.today.disabled:active {
  background: #f7ca77;
  color: #777777;
}

.datepicker table tr td.selected,
.datepicker table tr td.selected.highlighted {
  color: #fff;
  background-color: #777777;
  border-color: #555555;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.selected:focus,
.datepicker table tr td.selected.highlighted:focus,
.datepicker table tr td.selected.focus,
.datepicker table tr td.selected.highlighted.focus {
  color: #fff;
  background-color: #5e5e5e;
  border-color: #161616;
}

.datepicker table tr td.selected:hover,
.datepicker table tr td.selected.highlighted:hover {
  color: #fff;
  background-color: #5e5e5e;
  border-color: #373737;
}

.datepicker table tr td.selected:active,
.datepicker table tr td.selected.highlighted:active,
.datepicker table tr td.selected.active,
.datepicker table tr td.selected.highlighted.active {
  color: #fff;
  background-color: #5e5e5e;
  border-color: #373737;
}

.datepicker table tr td.selected:active:hover,
.datepicker table tr td.selected.highlighted:active:hover,
.datepicker table tr td.selected.active:hover,
.datepicker table tr td.selected.highlighted.active:hover,
.datepicker table tr td.selected:active:focus,
.datepicker table tr td.selected.highlighted:active:focus,
.datepicker table tr td.selected.active:focus,
.datepicker table tr td.selected.highlighted.active:focus,
.datepicker table tr td.selected:active.focus,
.datepicker table tr td.selected.highlighted:active.focus,
.datepicker table tr td.selected.active.focus,
.datepicker table tr td.selected.highlighted.active.focus {
  color: #fff;
  background-color: #4c4c4c;
  border-color: #161616;
}

.datepicker table tr td.selected.disabled:hover,
.datepicker table tr td.selected.highlighted.disabled:hover,
.datepicker table tr td.selected[disabled]:hover,
.datepicker table tr td.selected.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.selected:hover,
fieldset[disabled] .datepicker table tr td.selected.highlighted:hover,
.datepicker table tr td.selected.disabled:focus,
.datepicker table tr td.selected.highlighted.disabled:focus,
.datepicker table tr td.selected[disabled]:focus,
.datepicker table tr td.selected.highlighted[disabled]:focus,
fieldset[disabled] .datepicker table tr td.selected:focus,
fieldset[disabled] .datepicker table tr td.selected.highlighted:focus,
.datepicker table tr td.selected.disabled.focus,
.datepicker table tr td.selected.highlighted.disabled.focus,
.datepicker table tr td.selected[disabled].focus,
.datepicker table tr td.selected.highlighted[disabled].focus,
fieldset[disabled] .datepicker table tr td.selected.focus,
fieldset[disabled] .datepicker table tr td.selected.highlighted.focus {
  background-color: #777777;
  border-color: #555555;
}

.datepicker table tr td.active,
.datepicker table tr td.active.highlighted {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td.active:focus,
.datepicker table tr td.active.highlighted:focus,
.datepicker table tr td.active.focus,
.datepicker table tr td.active.highlighted.focus,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.highlighted:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active.highlighted:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active.highlighted.active,
.datepicker table tr td.active:active:hover,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active:active.focus,
.datepicker table tr td.active.highlighted:active.focus,
.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.highlighted.active.focus {
  color: #fff;
  background-color: #0075ea;
  box-shadow: 0 2px 14px rgba(110, 174, 239, 0.5);
  -ms-box-shadow: 0 2px 14px rgba(110, 174, 239, 0.5);
  -moz-box-shadow: 0 2px 14px rgba(110, 174, 239, 0.5);
}

.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.highlighted.disabled:hover,
.datepicker table tr td.active[disabled]:hover,
.datepicker table tr td.active.highlighted[disabled]:hover,
fieldset[disabled] .datepicker table tr td.active:hover,
fieldset[disabled] .datepicker table tr td.active.highlighted:hover,
.datepicker table tr td.active.disabled:focus,
.datepicker table tr td.active.highlighted.disabled:focus,
.datepicker table tr td.active[disabled]:focus,
.datepicker table tr td.active.highlighted[disabled]:focus,
fieldset[disabled] .datepicker table tr td.active:focus,
fieldset[disabled] .datepicker table tr td.active.highlighted:focus,
.datepicker table tr td.active.disabled.focus,
.datepicker table tr td.active.highlighted.disabled.focus,
.datepicker table tr td.active[disabled].focus,
.datepicker table tr td.active.highlighted[disabled].focus,
fieldset[disabled] .datepicker table tr td.active.focus,
fieldset[disabled] .datepicker table tr td.active.highlighted.focus {
  background-color: #337ab7;
  border-color: #2e6da4;
}

.datepicker table tr td span {
  display: block;
  width: 23%;
  height: 54px;
  line-height: 54px;
  float: left;
  margin: 1%;
  cursor: pointer;
  border-radius: 4px;
}

.datepicker table tr td span:hover,
.datepicker table tr td span.focused {
  background: #edf2f5;
}

.datepicker table tr td span.disabled,
.datepicker table tr td span.disabled:hover {
  background: none;
  color: #777777;
  cursor: default;
}

.datepicker table tr td span.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active.disabled:hover {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.datepicker table tr td span.active:focus,
.datepicker table tr td span.active:hover:focus,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active.disabled:hover:focus,
.datepicker table tr td span.active.focus,
.datepicker table tr td span.active:hover.focus,
.datepicker table tr td span.active.disabled.focus,
.datepicker table tr td span.active.disabled:hover.focus,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active:active:hover,
.datepicker table tr td span.active:hover:active:hover,
.datepicker table tr td span.active.disabled:active:hover,
.datepicker table tr td span.active.disabled:hover:active:hover,
.datepicker table tr td span.active.active:hover,
.datepicker table tr td span.active:hover.active:hover,
.datepicker table tr td span.active.disabled.active:hover,
.datepicker table tr td span.active.disabled:hover.active:hover,
.datepicker table tr td span.active:active:focus,
.datepicker table tr td span.active:hover:active:focus,
.datepicker table tr td span.active.disabled:active:focus,
.datepicker table tr td span.active.disabled:hover:active:focus,
.datepicker table tr td span.active.active:focus,
.datepicker table tr td span.active:hover.active:focus,
.datepicker table tr td span.active.disabled.active:focus,
.datepicker table tr td span.active.disabled:hover.active:focus,
.datepicker table tr td span.active:active.focus,
.datepicker table tr td span.active:hover:active.focus,
.datepicker table tr td span.active.disabled:active.focus,
.datepicker table tr td span.active.disabled:hover:active.focus,
.datepicker table tr td span.active.active.focus,
.datepicker table tr td span.active:hover.active.focus,
.datepicker table tr td span.active.disabled.active.focus,
.datepicker table tr td span.active.disabled:hover.active.focus {
  color: #fff;
  background-color: #003871;
  border-color: #122b40;
}

.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active:hover.disabled:hover,
.datepicker table tr td span.active.disabled.disabled:hover,
.datepicker table tr td span.active.disabled:hover.disabled:hover,
.datepicker table tr td span.active[disabled]:hover,
.datepicker table tr td span.active:hover[disabled]:hover,
.datepicker table tr td span.active.disabled[disabled]:hover,
.datepicker table tr td span.active.disabled:hover[disabled]:hover,
fieldset[disabled] .datepicker table tr td span.active:hover,
fieldset[disabled] .datepicker table tr td span.active:hover:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active.disabled:focus,
.datepicker table tr td span.active:hover.disabled:focus,
.datepicker table tr td span.active.disabled.disabled:focus,
.datepicker table tr td span.active.disabled:hover.disabled:focus,
.datepicker table tr td span.active[disabled]:focus,
.datepicker table tr td span.active:hover[disabled]:focus,
.datepicker table tr td span.active.disabled[disabled]:focus,
.datepicker table tr td span.active.disabled:hover[disabled]:focus,
fieldset[disabled] .datepicker table tr td span.active:focus,
fieldset[disabled] .datepicker table tr td span.active:hover:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover:focus,
.datepicker table tr td span.active.disabled.focus,
.datepicker table tr td span.active:hover.disabled.focus,
.datepicker table tr td span.active.disabled.disabled.focus,
.datepicker table tr td span.active.disabled:hover.disabled.focus,
.datepicker table tr td span.active[disabled].focus,
.datepicker table tr td span.active:hover[disabled].focus,
.datepicker table tr td span.active.disabled[disabled].focus,
.datepicker table tr td span.active.disabled:hover[disabled].focus,
fieldset[disabled] .datepicker table tr td span.active.focus,
fieldset[disabled] .datepicker table tr td span.active:hover.focus,
fieldset[disabled] .datepicker table tr td span.active.disabled.focus,
fieldset[disabled] .datepicker table tr td span.active.disabled:hover.focus {
  background-color: #337ab7;
  border-color: #2e6da4;
}

.datepicker table tr td span.old,
.datepicker table tr td span.new {
  color: #777777;
}

.datepicker .datepicker-switch {
  font-weight: bold;
  text-align: center;
}

.datepicker .datepicker-switch,
.datepicker .prev,
.datepicker .next,
.datepicker tfoot tr th {
  cursor: pointer;
}

.datepicker tfoot tr th:hover {
  background: #edf2f5;
}

.datepicker .prev,
.datepicker .next {
  background: #cdd7e1;
  color: white;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 12px;
}

.datepicker .prev.disabled,
.datepicker .next.disabled {
  visibility: hidden;
}

.datepicker .cw {
  font-size: 10px;
  width: 12px;
  padding: 0 2px 0 5px;
  vertical-align: middle;
}

.input-group.date .input-group-addon {
  cursor: pointer;
}

.input-daterange {
  width: 100%;
}

.input-daterange input {
  text-align: center;
}

.input-daterange input:first-child {
  border-radius: 3px 0 0 3px;
}

.input-daterange input:last-child {
  border-radius: 0 3px 3px 0;
}

.input-daterange .input-group-addon {
  width: auto;
  min-width: 16px;
  padding: 4px 5px;
  line-height: 1.42857143;
  border-width: 1px 0;
  margin-left: -5px;
  margin-right: -5px;
}

.datepicker table tr td.available {
  background: #edf2f5;
}

.datepicker table tr td.available:hover {
  background: #0075ea;
  color: white;
}

.datepicker table tr td.disabled,
.datepicker table tr td.disabled:hover {
  color: #5d6670;
  background: transparent;
}

.datepicker-days__header {
  margin-bottom: 8px;
}

.datepicker-days__header ul {
  display: grid;
  -ms-display: grid;
  -moz-display: grid;
  -webkit-display: grid;
  grid-template-columns: 1fr 6fr 1fr;
  -ms-grid-template-columns: 1fr 6fr 1fr;
  -moz-grid-template-columns: 1fr 6fr 1fr;
  -webkit-grid-template-columns: 1fr 6fr 1fr;
  text-align: center;
  height: 58px;
  background: #f9f9f9;
  border-radius: 50px;
}

.datepicker-days__header li {
  align-self: center;
}

.datepicker-days__header .next,
.datepicker-days__header .prev {
  width: 32px;
  height: 32px;
  line-height: 30px;
  border-radius: 100%;
  margin: 0 10px;
}

.datepicker-days__header .next:hover,
.datepicker-days__header .prev:hover {
  background-color: #0075ea;
}

.datepicker-days__header .datepicker-switch {
  margin: 0 auto;
  padding: 10px 40px;
  border-radius: 50px;
  font-size: 16px;
  font-size: 1.6rem;
}

.datepicker-days__header .datepicker-switch:hover {
  color: white;
  background-color: #0075ea;
}

.datepicker td.available,
.datepicker .datepicker-switch,
.datapicker .prev,
.datapicker .next {
  -webkit-transition: all .2s ease-in-out;
  /* Safari */
  transition: all .2s ease-in-out;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SLIMSCROLL
   ========================================================================== */

.button-slimScroll {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  position: absolute;
  width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
  background: #fff;
  color: #5d6670;
  cursor: pointer;
  right: 1px;
  z-index: 100;
  display: none;
  align-items: center;
  justify-content: center;
}

.button-slimScroll:hover i,
.button-slimScroll:focus i {
  color: #0075ea;
}

.button-slimScroll i {
  font-size: 6px;
  font-size: 0.6rem;
}

.button-slimScroll--up {
  top: -1px;
}

.button-slimScroll--down {
  bottom: -1px;
}

.slimScrollDiv.active .button-slimScroll,
.schedule-form__available-hours .button-slimScroll {
  display: flex;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   DETAILS - ANSWER SHEET SCSS
   ========================================================================== */

.answer-sheet .question-number {
  margin: 15px 0;
}

.question-form .answer-label label:hover {
  border-color: rgba(0, 0, 0, 0);
}

.test-type {
  text-align: center;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  color: #91949e;
}

/* ==========================================================================
   ANSWER SHEET MODAL
   ========================================================================== */

.answer-sheet__modal .modal-body {
  padding: 0;
}

.answer-sheet__modal .audio-passage__play {
  margin-bottom: 0;
}

.reading-question-insert__description {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 40px;
}

.reading-question-insert__description .orb {
  -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  background-color: #e2e8ee;
  width: 22px;
  height: 22px;
  margin: 0 5px;
  cursor: auto;
  position: relative;
  top: 4px;
}

.reading-question-insert__legend {
  font-size: 18px;
  font-size: 1.8rem;
  width: 100%;
  display: block;
  text-align: center;
}

.reading-question-insert__legend small {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 20px;
  color: #0075ea;
  display: block;
}

.speaking-answersheet-question-passage--left {
  background: #003871 !important;
  color: #fff !important;
}

.speaking-answersheet-question-passage--left .question-header {
  border-bottom: none !important;
}

.speaking-answersheet-question-passage--left .question-header .title {
  margin-bottom: 0px !important;
}

.speaking-answersheet-question-passage--right {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.speaking-answersheet-question-passage--right h4 {
  margin: 4px;
}

.speaking-answersheet-question-passage--right .speaking-answer .audio-passage__play {
  background: #11a06f;
}

.speaking-answersheet-question-passage--right .box-play-question-audio {
  margin-bottom: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.analysis-detail__score,
.analysis-detail-information,
.analysis-details-feedback {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.analysis-detail__score,
.card-content.analysis-detail-information,
.card-content.analysis-details-feedback {
  padding: 0;
}

.analysis-detail__score + .card,
.analysis-detail-information + .card,
.analysis-details-feedback + .card {
  margin: 30px 0 0 30px;
}

.analysis-detail__score .fe,
.analysis-detail-information .fe,
.analysis-details-feedback .fe {
  margin-right: 10px;
}

.analysis-detail__score:hover,
.analysis-detail-information:hover,
.analysis-details-feedback:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis-details__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis-details__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS-DETAILS
   ========================================================================== */

.header-analysis-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.header-analysis-data li {
  display: inline-block;
}

.header-analysis-data li + li {
  margin-left: 15px;
}

.analysis-details__container {
  display: block;
}

.analysis-details__header {
  width: 100%;
  margin-bottom: 30px;
  flex-direction: row-reverse;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
}

.analysis-detail__score,
.analysis-detail-information {
  min-height: 180px;
}

.analysis-detail__score {
  height: 100%;
  min-width: 340px;
  margin-right: 30px;
  background-size: cover;
}

.analysis-detail__score .description {
  display: inline-block;
  vertical-align: top;
}

.analysis-detail__content {
  padding: 25px 20px 10px;
}

.analysis-detail__content .view-score-icon {
  padding: 0;
}

.view-score-icon {
  margin-right: 15px;
  display: inline-block;
}

.view-score-icon i {
  width: 96px;
  height: 96px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
}

.view-score-icon.msg-congratz i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NyA2MyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcgNjM7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Qxe2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQoJLnN0MntmaWxsOnVybCgjc3RhcjNfMl8pO30KCS5zdDN7ZmlsbDp1cmwoI3N0YXIzXzNfKTt9Cjwvc3R5bGU+CjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMjMuNDYxNiIgeTE9IjMyLjE5NDkiIHgyPSIyMy40NjE2IiB5Mj0iNjEuOTE0MyI+Cgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+Cgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3RvcC1jb2xvcjojRUI5MTAwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNyw0NS41YzAsMCwwLjEsMCwwLjEtMC4xYzIuNi0xLjEsNS4xLTMuMyw2LjgtNi4xYzE1LjgtOS44LDkuMi0xNy41LDQtMTYuMWMwLjMtMi4zLDAuNS0zLjksMC41LTMuOUg4LjYKCWMwLDAsMC4yLDEuNiwwLjUsMy45Yy01LjMtMS40LTExLjksNi4zLDQsMTYuMWMxLjcsMi44LDQuMSw1LDYuOCw2LjFjMCwwLDAuMSwwLDAuMSwwLjFjMS40LDAuNywxLjUsMi4xLDEuNSwyLjF2My41CgljMCw1LjYtNS43LDUuNS01LjcsNS41aC0wLjhWNTlIMzJ2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNUMyNS41LDQ3LjYsMjUuNSw0Ni4yLDI3LDQ1LjV6IE0zNS4yLDM2LjYKCWMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6IE05LjQsMjUuNmMwLjMsMi40LDAuOCw1LjEsMS4zLDcuOWMwLjIsMS4xLDAuNSwyLjEsMSwzLjEKCUMyLjEsMjguOCw0LjksMjQuNyw5LjQsMjUuNnoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8yXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0My40OTYyIiB5MT0iMTguNjg4NSIgeDI9IjIwLjQyNjEiIHkyPSI0OC4yNjkzIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggY2xhc3M9InN0MSIgZD0iTTI3LDQ1LjVjMCwwLDAuMSwwLDAuMS0wLjFjMi42LTEuMSw1LjEtMy4zLDYuOC02LjFjMTUuOC05LjgsOS4yLTE3LjUsNC0xNi4xYzAuMy0yLjMsMC41LTMuOSwwLjUtMy45CglzLTcuNSwwLTE0LjksMGMtMC4zLDAtMC4yLDAtMC4yLDBMMjMuNiw1OWMwLDAtMC4yLDAsMC4xLDBjNC4yLDAsOC4yLDAsOC4yLDB2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNQoJQzI1LjUsNDcuNiwyNS41LDQ2LjIsMjcsNDUuNXogTTM1LjIsMzYuNmMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6Ii8+CjxsaW5lYXJHcmFkaWVudCBpZD0ic3RhcjNfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMzQuMjM2NSIgeTE9IjcuMTI4NCIgeDI9IjM0LjIzNjUiIHkyPSIxNC44MjUxIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzIiBjbGFzcz0ic3QyIiBkPSJNMzYuMywxMC44Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMWMtMC4xLDAtMC4yLDAtMC4zLTAuMQoJYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdDMzAuNSw2LDMwLjcsNS44LDMxLDUuOGMwLDAsMCwwLDAsMGwyLjEsMGwwLjYtMgoJYzAuMS0wLjIsMC4zLTAuNCwwLjYtMC40czAuNSwwLjIsMC42LDAuNGwwLjYsMmwyLjEsMGMwLDAsMCwwLDAsMGMwLjMsMCwwLjUsMC4yLDAuNiwwLjRjMC4xLDAuMiwwLDAuNS0wLjIsMC43bC0xLjcsMS4ybDAuNywyCgljMC4xLDAuMiwwLDAuNS0wLjIsMC43QzM2LjUsMTAuOCwzNi40LDEwLjgsMzYuMywxMC44TDM2LjMsMTAuOHoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJzdGFyM18zXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIyNC4xMTU1IiB5MT0iMTAuODE3NyIgeDI9IjI0LjExNTUiIHkyPSIxOC41MTQ0Ij4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzXzFfIiBjbGFzcz0ic3QzIiBkPSJNMjYuMSwxNC41Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMQoJYy0wLjEsMC0wLjIsMC0wLjMtMC4xYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdjMC4xLTAuMiwwLjMtMC40LDAuNi0wLjRjMCwwLDAsMCwwLDAKCWwyLjEsMGwwLjYtMmMwLjEtMC4yLDAuMy0wLjQsMC42LTAuNHMwLjUsMC4yLDAuNiwwLjRsMC42LDJsMi4xLDBjMCwwLDAsMCwwLDBjMC4zLDAsMC41LDAuMiwwLjYsMC40YzAuMSwwLjIsMCwwLjUtMC4yLDAuNwoJTDI2LDExLjhsMC43LDJjMC4xLDAuMiwwLDAuNS0wLjIsMC43QzI2LjQsMTQuNSwyNi4zLDE0LjUsMjYuMSwxNC41TDI2LjEsMTQuNXoiLz4KPC9zdmc+Cg==);
}

.view-score-icon.msg-medium i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.view-score-icon.msg-low i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.analysis-detail-description {
  width: 100%;
  padding-top: 5px;
}

.analysis-detail-description > span {
  display: block;
}

.analysis-detail-description > span + span {
  margin-top: 4px;
}

.analysis-detail-description .date {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 15px;
  font-weight: bold;
}

.analysis-profile__name {
  font-size: 20px;
  font-size: 2rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.analysis-profile__email {
  margin-bottom: 5px;
}

.analysis-detail-information {
  width: 100%;
}

.analysis-detail-information__header,
.analysis-detail-data {
  width: 100%;
  padding: 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.analysis-profile span {
  display: block;
}

.avatar--analysis-detail {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 64px;
  height: 64px;
  min-width: 64px;
  margin-right: 30px;
  display: inline-block;
  background: #ddd;
}

.avatar--analysis-detail img {
  width: 100%;
  height: 100%;
}

.analysis-detail-profile {
  min-width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.analysis-detail-data {
  border-top: 1px solid #dde4ea;
  text-align: center;
}

.analysis-detail-data__item {
  width: 100%;
}

.analysis-detail-data__icon {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  color: #0075ea;
}

.analysis-detail-data__title {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 10px;
  color: #5d6670;
  display: block;
}

.view-score-text {
  font-size: 14px;
  font-size: 1.4rem;
  width: 180px;
  display: inline-block;
}

.view-score-text span {
  text-transform: capitalize;
}

.view-score-text strong {
  font-size: 18px;
}

.view-score-point {
  font-size: 52px;
  font-size: 5.2rem;
  display: block;
  font-weight: bold;
  text-align: left;
}

.view-score-point small {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 32px;
  font-size: 3.2rem;
  margin-left: 5px;
  text-align: left;
}

.view-score-point--small {
  font-size: 34px;
  font-size: 3.4rem;
  margin-top: 8px;
}

.analysis-details-feedback {
  width: 100%;
  margin: 0 0 30px;
  position: relative;
}

.analysis-details-feedback .card__header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.analysis-details-feedback select {
  margin-top: 15px;
  float: right;
}

.select-filter {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  min-width: 170px;
  height: 30px;
  padding: 5px 20px 5px 10px;
  border: 1px solid #e2e8ee;
  background-color: #fff;
  outline: none;
}

.view-feedback-content {
  display: flex;
}

.view-feedback-content h4:first-child {
  margin-top: 0;
}

.view-feedback-content h4 {
  margin-bottom: 10px;
}

.view-feedback-content > div {
  padding: 50px;
}

.view-feedback-score {
  width: 200px;
  float: left;
  text-align: center;
  padding: 10px !important;
  background-color: #cdd7e1;
}

.view-feedback-score .score {
  font-size: 24px;
  display: block;
  font-weight: bold;
}

.view-feedback-score .score small {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
  text-align: left;
}

.view-feedback-score .score-good {
  color: #30b770;
}

.view-feedback-score .score-weak {
  color: #ec3237;
}

.view-feedback-score .score-fair {
  color: #003871;
}

.view-feedback-score .text {
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 5px;
}

.view-feedback-score__item {
  padding: 35px 23px;
  border-radius: 6px;
  background-color: #ffffff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

.view-feedback-score__item + .view-feedback-score__item {
  margin-top: 15px !important;
}

.view-feedback-text {
  width: calc(100% - 300px);
  border-left: 1px solid #e2e8ee;
  float: left;
}

.analysis-feedback-graphs {
  width: 100%;
  margin-top: 30px;
  display: block;
}

.results-chart--details,
.breakdown-chart--details {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
}

.results-chart--details:hover,
.breakdown-chart--details:hover {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.share-score {
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  background-color: #0075ea;
  color: #fff;
  width: 122px;
  height: 42px;
  min-height: auto;
  line-height: 42px;
  text-align: center;
}

.share-score > .fe-icon {
  margin-right: 10px;
}

.share-score > a {
  margin-right: 10px;
}

.share-score li i {
  font-size: 16px;
  font-size: 1.6rem;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  line-height: 24px;
  text-align: center;
}

.share-score li > a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.share-score:hover .fe-arrow-up-small {
  display: inline-block;
}

.share-score:hover .fe-arrow-down-small {
  display: none;
}

.get-certificate {
  width: 100%;
  border-top: 1px solid #dde4ea;
  padding-top: 15px;
  display: block;
}

.get-certificate__button {
  margin: 0 auto;
  padding-right: 30px;
  color: #CEA910;
  display: block;
  font-weight: bold;
  position: relative;
  max-width: 160px;
}

.get-certificate__button img {
  position: absolute;
  top: 0;
  right: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   ZERO-DATA-MESSAGE
   ========================================================================== */

.zero-data-message {
  padding: 50px 35px;
}

.zero-data-message figure img {
  margin-right: 40px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   RESULTS CHART
   ========================================================================== */

div + .results-chart {
  margin-left: 30px;
}

.results-chart {
  width: calc(40% - 15px);
  padding: 30px 10px;
}

.results-chart #analysis-doughnut {
  max-width: 250px;
  margin: 0 auto;
}

.results-chart__nodata {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

.results-chart,
.breakdown-chart,
.widget-breakdown {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.results-chart,
.card-content.breakdown-chart,
.card-content.widget-breakdown {
  padding: 0;
}

.results-chart + .card,
.breakdown-chart + .card,
.widget-breakdown + .card {
  margin: 30px 0 0 30px;
}

.results-chart .fe,
.breakdown-chart .fe,
.widget-breakdown .fe {
  margin-right: 10px;
}

.results-chart:hover,
.breakdown-chart:hover,
.widget-breakdown:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis__container,
.analysis-container__page {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS
   ========================================================================== */

.nav-analysis {
  float: right;
}

.nav-analysis > li {
  float: left;
}

.nav-analysis > li + li {
  margin-left: 10px;
}

.nav-analysis > li i {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 5px;
}

.nav-analysis > li > a {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  padding: 0 15px;
  height: 40px;
  color: #5d6670;
  line-height: 38px;
  border: 1px solid #e2e8ee;
  display: block;
}

.nav-analysis > li > .disabled:hover {
  background-color: #fff;
  color: #5d6670;
  border-color: #e2e8ee;
}

.nav-analysis > li > .disabled i,
.nav-analysis > li > .disabled .text {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.nav-analysis > li > .disabled .tooltip-content {
  min-width: 150px;
  top: 35px;
  line-height: normal;
}

.nav-analysis > li a:hover,
.nav-analysis > li.active > a {
  background-color: #0075ea;
  color: #fff;
  border-color: transparent;
}

.btn-filter {
  width: 40px;
  text-align: center;
}

.btn-filter a {
  padding: 0 10px !important;
}

.btn-filter:hover a {
  border-color: #e2e8ee !important;
  background-color: transparent !important;
}

.btn-filter:hover i {
  color: #0075ea;
}

.btn-filter .menu-dropdown {
  height: 250px !important;
}

.btn-filter .menu-dropdown > span {
  padding: 15px 0;
  border-bottom: 1px solid #e2e8ee;
  display: block;
  font-weight: bold;
  line-height: normal;
}

.btn-filter .menu-dropdown li {
  line-height: 42px;
  text-align: center;
}

.btn-filter .menu-dropdown li a {
  padding: 10px !important;
  display: block;
}

.btn-filter .menu-dropdown li a.active,
.btn-filter .menu-dropdown li a:hover {
  color: #0075ea;
}

/*
   ANALYSIS
   ========================================================================== */

.analysis-container__page {
  padding: 0;
}

/*
   PERFORMANCE
   ========================================================================== */

#analysis-breakdown {
  margin-bottom: 30px;
  min-height: 150px;
}

.results-chart,
.breakdown-chart {
  height: 380px;
  position: relative;
  text-align: center;
  float: left;
}

.results-chart .title,
.breakdown-chart .title {
  font-size: 16px;
  font-size: 1.6rem;
  margin: 0 auto 40px;
  font-weight: bold;
  text-transform: uppercase;
}

.results-chart .title small,
.breakdown-chart .title small {
  font-size: 12px;
  font-size: 1.2rem;
  display: block;
  font-weight: normal;
}

.results-chart > span,
.breakdown-chart > span {
  display: block;
}

.breakdown-chart {
  width: calc(60% - 15px);
  padding: 30px;
  padding-bottom: 60px;
}

.breakdown-chart .chart-container {
  margin: 20px;
}

.results-chart--practice {
  margin-top: 30px;
}

.doughnut-legend li {
  padding-left: 15px;
}

.doughnut-legend li > span {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 10px;
  height: 10px;
  margin-top: 5px;
}

.widget-breakdown {
  width: 100%;
}

.widget-breakdown .box-header {
  text-transform: uppercase;
}

.widget-breakdown__content {
  padding: 1.2rem;
}

.widget-breakdown__values h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 10px;
  color: #2a6dcd;
}

.widget-breakdown__values > ul {
  margin-bottom: 20px;
}

.widget-breakdown__values li {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: calc(33.333% - 3px);
  min-height: 100px;
  display: inline-block;
  vertical-align: top;
  padding: 1.6rem 2rem;
  background: #f5f5f5;
}

.widget-breakdown__values label,
.widget-breakdown__values .legend {
  display: block;
}

.widget-breakdown__values .widget-value {
  font-size: 24px;
  font-size: 2.4rem;
}

.widget-breakdown__values .legend {
  font-size: 12px;
  font-size: 1.2rem;
  opacity: 0.5;
  filter: alpha(opacity=50);
  text-transform: uppercase;
}

.toefl-writing-breakdown li {
  width: calc(33.4% - 3px) !important;
}

.toefl-writing-breakdown li + li {
  border-left: 1px solid #e9e9e9;
}

.widget-breakdown--practice {
  margin-bottom: 30px;
}

.widget-breakdown--practice .widget-breakdown__values li {
  width: calc(50% - 2px);
}

.widget-breakdown--full_test .card__header {
  display: block !important;
}

.widget-breakdown--cefr .card__header {
  display: block !important;
}

/*
   BOX RESULTS FULL
   ========================================================================== */

.results-chart-full {
  width: 100%;
  margin-left: 0 !important;
  position: relative;
}

.results-chart-full .results-chart {
  width: 30%;
  margin-left: 0 !important;
  float: left;
}

.results-details {
  width: 70%;
  height: 100%;
  background-color: rgba(226, 232, 238, 0.3);
  position: absolute;
  right: 0;
}

.results-details li {
  width: 25%;
  min-height: 340px;
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  float: left;
  position: relative;
  text-align: center;
}

.results-details li:nth-child(4n+1) {
  background: rgba(255, 255, 255, 0);
}

.results-details li:nth-child(4n+2) {
  background: rgba(255, 255, 255, 0.25);
}

.results-details li:nth-child(4n+3) {
  background: rgba(255, 255, 255, 0.5);
}

.results-details li:nth-child(4n+4) {
  background: white;
}

.results-details li > div {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  position: absolute;
  display: inline-block;
  text-align: center;
  top: 50%;
  left: 50%;
}

.results-details li i {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 32px;
  height: 32px;
  margin: 0 auto 10px;
  background-color: #0075ea;
  color: #fff;
  display: inline-block;
  line-height: 32px;
}

.results-details li span {
  margin-bottom: 10px;
  display: block;
}

.results-details li .fe-check {
  background-color: #1bd171;
}

.results-details li .fe-close {
  background-color: #f27474;
}

.results-details li .fe-jump {
  background-color: #f9c631;
}

.results-details li .fe-help {
  background-color: #5d6670;
}

.results-details li .fe-help.independent {
  background-color: #01b5ff;
}

.results-details li .fe-help.integrated {
  background-color: #0075ea;
}

.results-details .value {
  font-size: 26px;
  font-size: 2.6rem;
  color: #5d6670;
  font-weight: bold;
  line-height: 100%;
}

.results-details .type {
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: uppercase;
}

.results-details .type b {
  display: block;
}

/*
   BREAKDOWN WRITING
   ========================================================================== */

.breakdown-writing {
  padding: 15px;
  background-color: #f7f8f8;
}

.breakdown-writing .title {
  margin: 10px 0;
}

.breakdown-writing .box-header {
  font-weight: bold;
}

.breakdown-writing .breakdown-content {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  width: 100%;
  background-color: #fff;
  padding: 15px 10px;
  margin-top: 10px;
  border: 1px solid #e2e8ee;
  border-bottom: 2px solid rgba(0, 117, 234, 0.4);
  display: inline-block;
  text-align: center;
  position: relative;
}

.breakdown-writing .breakdown-content + div {
  margin-top: 15px;
  border-bottom-color: rgba(0, 117, 234, 0.4);
}

.breakdown-writing .breakdown-content .type-title {
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.breakdown-writing .breakdown-content .item > span {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 10px 0;
  min-height: 65px;
  line-height: normal;
}

.breakdown-writing span {
  display: block;
}

.breakdown-writing .response,
.breakdown-writing .score {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.breakdown-writing .time,
.breakdown-writing .points {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

.breakdown-writing .points small {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal;
}

.breakdown-writing .time i {
  font-size: 14px;
  font-size: 1.4rem;
}

.breakdown-writing .max {
  font-size: 10px;
  font-size: 1rem;
  color: #aebecd;
  bottom: 5px;
  position: absolute;
  right: 7px;
  text-transform: uppercase;
}

/*
   MEDIA
   ========================================================================== */

@media (max-width: 1150px) {
  .breakdown-writing .type-title {
    margin-bottom: 0;
  }

  .breakdown-writing .breakdown-content {
    padding: 15px 5px;
  }

  .breakdown-writing .breakdown-content .item {
    padding: 0;
  }

  .breakdown-writing .score,
  .breakdown-writing .response {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .breakdown-writing .points,
  .breakdown-writing .time {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.container-main--small > .breakdown-chart {
  margin-bottom: 0;
}

.container-main--small .breakdown-chart {
  padding-bottom: 0;
  height: auto;
}

.container-main--small .breakdown-chart,
.container-main--small .results-chart {
  width: 100%;
  margin-bottom: 30px;
  float: none;
}

.container-main--small .results-chart {
  margin-left: 0;
}

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.info-analysis {
  display: none;
}

.total-simulation i {
  font-size: 14px;
  font-size: 1.4rem;
  color: #fff;
}

.analysis--simulation .info-analysis-item + .info-analysis-item {
  margin-top: 0;
}

.analysis--simulation .box-history .box-header {
  position: relative;
}

.analysis--simulation .history-timeline li:hover {
  background-color: rgba(226, 232, 238, 0.2);
}

.analysis--simulation .score-name {
  bottom: 0;
}

/*
   HISTORY FILTER
   ========================================================================== */

#history-filter {
  position: absolute;
  right: 15px;
  top: 15px;
}

/* Practice
   -------------------------------------------------------------------------- */

.analysis-details .breakdown-chart,
.analysis-details .results-chart {
  min-height: 340px;
}

/* Radar Chart
-------------------------------------------------------------------------- */

.radar-legend-simulation {
  width: 100%;
  margin: 0 auto;
  bottom: 12px;
  position: absolute;
  left: 0;
}

.radar-legend-simulation li {
  font-size: 11px;
  font-size: 1.1rem;
  padding-left: 10px !important;
  display: inline-block;
  vertical-align: top;
  text-transform: uppercase;
}

.radar-legend-simulation li + li {
  margin-left: 10px;
}

.radar-legend-simulation.radar-legend li::before {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  margin: 0 10px 0 0;
  content: '';
  display: inline-block;
  vertical-align: top;
}

.radar-legend-simulation .color-projected::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-right::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-wrong::before {
  background-color: #ec3237;
}

.analysis-simulation .total-time {
  display: none;
}

.analysis-practice-detail #totalizers-msg small {
  display: block;
}

.analysis-practice-detail .total-simulation {
  display: none;
}

.analysis-simulation-cefr .total-questions {
  display: none;
}

.button-cefr {
  text-transform: uppercase;
}

.button-cefr:hover {
  background: #ffa500 !important;
}

.active .button-cefr {
  background-color: #ffa500 !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SESSION
   ========================================================================== */

.practice__container--session {
  text-align: center;
}

.practice__container--session .btn--primary {
  width: auto;
}

.practice__container--session .percentage {
  font-size: 30px;
  font-size: 3rem;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 0;
  font-weight: bold;
  background: white;
}

.practice__container--session .percentage small {
  font-size: 60%;
}

.session {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 50px;
}

.session-invalid,
.session-valid {
  width: 100%;
  text-align: center;
}

.session__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 50px 0;
  display: block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== */

.box-session-content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 100%;
  max-width: 720px;
  margin: 0 auto 50px;
  border: 1px solid #e2e8ee;
  display: inline-block;
  overflow: hidden;
}

.box-session-left {
  width: 35%;
  padding: 40px 50px;
  float: left;
}

.box-session-left--no-score {
  padding: 18px 25px;
}

.box-session-left--no-score a {
  color: #0075ea;
}

.box-session-left .analytics-score input,
.box-session-left .analytics-score .legend {
  color: #5d6670 !important;
}

.box-session-left .analytics-score .graph {
  height: 120px;
  margin-top: 0;
}

.box-session-left .analytics-score .legend {
  font-size: 12px;
  font-size: 1.2rem;
  max-width: 70px;
  margin: -18px auto 0;
  line-height: normal;
}

.box-session-info > div {
  width: 100%;
  float: left;
}

.box-session-info .title {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: left;
}

.box-session-info .info-header {
  padding: 30px;
  border-bottom: 1px solid #e2e8ee;
}

.box-session-info .info-header > div {
  text-align: left;
}

.box-session-info .info-header .avg-time {
  width: 200px;
  float: left;
}

.box-session-info .info-header .total-time {
  max-width: 140px;
  min-width: 110px;
  float: right;
}

.box-session-info .info-header i {
  font-size: 32px;
  font-size: 3.2rem;
  margin-right: 10px;
  float: left;
}

.box-session-info .info-header .time {
  font-weight: bold;
}

.box-session-info .info-header .legend {
  font-size: 12px;
  font-size: 1.2rem;
  color: rgba(93, 102, 112, 0.8);
  text-transform: uppercase;
}

.box-session-info .info-footer {
  background-color: #f9f9f9;
}

.box-session-info .info-footer.info-independent li {
  width: 25%;
}

.box-session-info .results-details {
  width: 100%;
  position: relative;
}

.box-session-info .results-details li {
  padding: 10px;
  min-height: 120px;
  text-align: center;
}

.box-session-info .results-details li:first-child {
  border: 0;
}

.box-session-info .results-details li > span:first-child {
  display: block;
  margin: 0 auto;
}

.box-session-info .results-details li span {
  margin: 0;
}

.box-session-info .results-details .value {
  font-size: 18px;
  font-size: 1.8rem;
  padding-top: 3px;
  display: inline-block;
}

.box-session-info .results-details i {
  font-size: 12px;
  font-size: 1.2rem;
  width: 24px;
  height: 24px;
  margin: 0 5px 6px 0px;
  line-height: 24px;
}

.box-session-info .results-details .type {
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 5px;
  color: #5d6670;
  display: block;
}

.graph-cover-score input {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== */

.session-invalid .title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 0 auto 20px;
  display: block;
}

.session-invalid i {
  font-size: 64px;
  font-size: 6.4rem;
  margin-bottom: 20px;
  color: #ec3237;
}

.session-invalid a {
  color: #5d6670;
  font-weight: bold;
}

.session-invalid a:hover {
  text-decoration: underline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.practice__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.practice__content {
  padding: 0;
}

.practice__content + .card {
  margin: 30px 0 0 30px;
}

.practice__content .fe {
  margin-right: 10px;
}

.practice__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.header-internal__content,
.practice__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.practice__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   PRACTICE
   ========================================================================== */

.header-internal__content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.practice__container {
  display: block;
}

.practice__content {
  width: 100%;
  position: relative;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Simulation Exit Message
   ========================================================================== */

.modal--exit {
  z-index: 1050;
  display: block;
}

.modal-body.simulation-exit-message {
  width: 500px;
  padding: 30px 55px 40px;
}

.simulation-exit-message__title {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 30px;
  text-align: center;
}

.simulation-exit-message__content {
  display: flex;
  margin-bottom: 40px;
}

.simulation-exit-message img {
  margin-right: 20px;
}

.simulation-exit-message > b {
  font-size: 16px;
  font-size: 1.6rem;
  color: #0075ea;
  display: block;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Offline-countdown
   ========================================================================== */

.modal-body.offline-countdown {
  width: 850px;
  padding: 40px 55px 40px;
}

.offline-countdown__title {
  font-size: 20px;
  font-size: 2rem;
  line-height: 3.2rem;
  line-height: 32px;
  margin-bottom: 30px;
  text-align: center;
}

.offline-countdown__content {
  display: flex;
  margin-bottom: 40px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.offline-countdown__countdown {
  font-size: 32px;
  font-size: 3.2rem;
  margin-bottom: 20px;
  font-weight: bold;
  display: block;
  color: #0075ea;
}

.offline-countdown img {
  margin-right: 20px;
}

.offline-countdown > b {
  font-size: 16px;
  font-size: 1.6rem;
  color: #0075ea;
  display: block;
  text-align: center;
}

.offline-countdown-footer {
  text-align: center;
  padding: 20px 30px;
}

.offline-countdown-footer em {
  color: #ec3237;
  max-width: 350px;
  display: block;
  margin: 0 auto;
  font-style: normal;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Offline-countdown
   ========================================================================== */

.modal-body.roomscan-checker {
  width: 900px;
  padding: 40px 55px 0;
}

.roomscan-checker__title {
  font-size: 20px;
  font-size: 2rem;
  line-height: 3.2rem;
  line-height: 32px;
  margin-bottom: 30px;
  text-align: center;
}

.roomscan-checker__content {
  display: flex;
  margin-bottom: 40px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.roomscan-checker__countdown {
  font-size: 32px;
  font-size: 3.2rem;
  margin-bottom: 20px;
  font-weight: bold;
  display: block;
  color: #0075ea;
}

.roomscan-checker img {
  margin-right: 20px;
}

.roomscan-checker > b {
  font-size: 16px;
  font-size: 1.6rem;
  color: #0075ea;
  display: block;
  text-align: center;
}

.roomscan-checker-footer {
  text-align: center;
  padding: 20px 30px;
}

.roomscan-checker-footer em {
  color: #ec3237;
  max-width: 350px;
  display: block;
  margin: 0 auto;
  font-style: normal;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-summary {
  padding: 20px 40px;
}

.simulation-summary .simulation-summary-table__row.selected {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  color: #fff;
  background: #0075ea !important;
  outline: none;
  cursor: pointer;
}

.simulation-summary .simulation-summary-table__row.selected td {
  color: inherit;
}

.simulation-summary__header {
  margin-bottom: 12px;
}

.simulation-summary-table {
  display: table;
}

.simulation-summary-table__content {
  width: 100%;
}

.simulation-summary__thead-wrapper {
  padding-right: 14px;
  background: #e5e5e5;
}

.simulation-summary-table__thead {
  background: #e5e5e5;
  text-align: center;
}

.simulation-summary-table__thead .number {
  width: 10%;
  padding: 12px 0;
  border-right: 1px solid #ccc;
}

.simulation-summary-table__thead .description {
  width: 75%;
  border-right: 1px solid #ccc;
  padding: 12px 0;
}

.simulation-summary-table__thead .status {
  width: 15%;
  padding: 12px 0;
}

.simulation-summary-wrapper {
  margin-top: 40px;
  border: 1px solid #ccc;
  border-radius: 4px 4px 0 0;
  overflow: hidden;
}

.simulation-summary-table__row:nth-child(even) {
  background: #e5e5e5;
  cursor: pointer;
}

.simulation-summary-table__row:nth-child(odd) {
  background: #fff;
  cursor: pointer;
}

.simulation-summary-table__row .number {
  width: 10%;
  text-align: center;
  padding: 12px 0;
  border-right: 1px solid #ccc;
}

.simulation-summary-table__row .description {
  width: 75%;
  padding: 12px 0;
  border-right: 1px solid #ccc;
}

.simulation-summary-table__row .status {
  width: 15%;
  text-align: center;
  padding: 12px 0;
}

.simulation-summary-table__row .description span {
  width: 67%;
  min-height: 20px;
  padding-left: 13px;
  overflow: hidden;
  display: block;
}

.simulation-summary-table__row.answered .description {
  text-decoration: line-through;
}

.simulation-summary-table__row.disabled {
  cursor: default;
  opacity: 0.6;
  filter: alpha(opacity=60);
}

.simulation-summary-table__row.active_question {
  background: #E8F3FA;
  border: 1px solid #bed4de;
}

.simulation-summary-table__row:focus {
  outline: none;
}

.simulation-summary-table--header {
  margin-bottom: 0;
}

.simulation-summary-table--header th {
  margin-bottom: 0;
}

.simulation-summary-table--content {
  margin-top: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize .counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.counter {
  display: none !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-end {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
}

.simulation-end__content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px;
  text-align: left;
  line-height: 26px;
}

.simulation-end__content p {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

simulation-progress {
  width: calc(100% - 680px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 100%;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION VOLUME
   ========================================================================== */

.simulation-volume {
  display: inline-block;
}

.volume-wrap {
  font-size: 17px;
  color: #fff;
  background: #038ae7;
  display: flex;
  padding: 10px;
  border-radius: 100px;
  margin: 12px;
  border: 1px solid #038ae7;
  justify-content: center;
  align-items: center;
}

.simulation-volume .tooltip-content {
  height: 34px;
  top: 38px;
}

.simulation-volume .tooltip-content input {
  display: block;
  margin: 0 auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.simulation__content {
  padding: 0;
}

.simulation__content + .card {
  margin: 30px 0 0 30px;
}

.simulation__content .fe {
  margin-right: 10px;
}

.simulation__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.simulation__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.simulation__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   SIMULATION
   ========================================================================== */

[class*='simulation.'] .header,
[class*='custom_test.simulation-'] .header {
  display: none;
}

[class*='analysis.simulation.'] .header,
[class*='analysis.simulation.'] feedback {
  display: block;
}

.simulation__container.audio,
.simulation__container.listen {
  justify-content: center;
  text-align: center;
}

.simulation__container.audio .box-full,
.simulation__container.listen .box-full {
  width: 500px;
}

.simulation__content {
  width: 100%;
  min-height: 500px;
  margin: 0 auto;
  position: relative;
}

.simulation__content reading-actions {
  display: none;
}

.simulation__content .question-full {
  padding: 40px;
}

.simulation__content--question {
  width: 100%;
}

.simulation__content--audio,
.simulation__content--listen,
.simulation__content--passage {
  width: auto;
  min-height: 450px;
  overflow: hidden;
}

.simulation__content--direction_subclip,
.simulation__content--get_ready_screen,
.simulation__content--getready {
  text-align: center;
}

.simulation-steps {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 4px 8px;
  background: #003871;
  color: #fff;
  display: block;
  left: 4px;
  top: 4px;
  position: absolute;
}

.header-internal--simulation h1 {
  margin-left: 20px;
}

.header-internal--simulation h1 span {
  font-weight: normal;
}

.header-internal--simulation .content {
  max-width: 100%;
  padding: 0;
  text-align: center;
}

.header-internal--simulation .progress-content {
  width: calc(100% - 580px);
  max-width: 600px;
  display: inline-block;
}

.header-internal--simulation .progress-questions {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 30px;
  font-weight: bold;
}

.header-internal--simulation .menu-dropdown {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
  left: auto;
  right: 5px;
}

.header-internal--simulation .btn-clock .tooltip-content {
  min-width: 100px;
  text-transform: uppercase;
}

.header-internal--simulation .btn-continue-content .tooltip-content {
  min-width: 190px;
  top: 60px;
}

.simulation__settings {
  height: 60px;
  padding: 0 25px;
  margin-left: 25px;
  border-left: 1px solid rgba(93, 102, 112, 0.1);
  cursor: pointer;
  float: right;
  display: flex;
  align-items: center;
}

.simulation__settings .fe-settings {
  font-size: 24px;
  font-size: 2.4rem;
  align-self: center;
}

.box-simulation {
  padding: 70px 80px;
}

.box-simulation h2 {
  margin-bottom: 50px;
  font-weight: normal;
}

.box-simulation h2 small {
  font-size: 24px;
  font-size: 2.4rem;
  display: block;
}

.box-simulation.simulation-intro {
  width: 100%;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.box-simulation.simulation-intro .question-content--left,
.box-simulation.simulation-intro .question-content--right {
  padding: 50px;
}

.box-simulation.simulation-intro .question-content--right {
  text-align: center;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.box-simulation.simulation-intro .audio-required {
  width: 100%;
  align-self: center;
}

.box-simulation .intro-instruction--content,
.box-simulation p {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 160%;
}

.box-simulation .box-speaking-record {
  margin: 50px auto;
}

.box-simulation .box-record {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  margin-bottom: 30px;
  background-color: transparent;
  overflow: hidden;
}

.box-simulation .record-started .text,
.box-simulation .record-start .text {
  font-size: 12px;
  font-size: 1.2rem;
  max-width: 90px;
  margin: 0 auto;
}

.simulation-audio-image > img {
  display: block;
  margin: 0 auto;
}

.simulation-audio-image .custom-test-speaking__image-modal {
  display: block;
  margin: 0 auto;
  max-width: 100%;
}

.simulation-audio-image .custom-test-speaking__image-modal .btn-image-modal {
  display: block;
}

.simulation-audio-image .custom-test-speaking__image-modal .btn-image-modal p {
  margin-bottom: 5px;
}

.simulation-audio-image .custom-test-speaking__image-modal .btn-image-modal img {
  max-height: 100%;
  min-height: 415px;
}

.simulation-audio {
  max-width: 600px;
  margin: 0 auto;
  padding: 0;
  text-align: center;
}

.simulation-audio h2 {
  margin-bottom: 0;
  padding: 40px 0;
  border-bottom: 4px solid #ec3237;
}

.simulation-audio p {
  margin-bottom: 40px;
}

.simulation-audio .audio-passage__play--small {
  padding: 0 0 0 20px;
  border-radius: 0;
  width: 100%;
  max-width: 100%;
}

.simulation-audio .play-range {
  width: 448px;
  height: 34px;
  margin: 0;
  display: block;
  float: left;
}

.simulation-audio .play-volume {
  width: 50px;
  padding: 0;
  position: relative;
  float: right;
}

.simulation-audio .remain-time {
  font-size: 13px;
  font-size: 1.3rem;
  width: 60px;
  color: #fff;
  float: left;
  line-height: 35px;
  text-align: center;
}

.simulation-audio-questions {
  padding: 20px 0;
  border-bottom: 2px solid #eee;
}

.play-progress {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 100%;
  height: 5px;
  margin-top: 15px;
  display: block;
  background-color: rgba(255, 255, 255, 0.4);
}

.play-bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 10px;
  height: 100%;
  background-color: #fff;
  display: block;
}

.writing-simulation .writing-integrated .question-content--left,
.writing-simulation .writing-integrated .question-content--right {
  min-height: 380px;
}

.writing-simulation .writing-independent .question-content--left,
.writing-simulation .writing-independent .question-content--right {
  min-height: 500px;
}

.box-content {
  padding-top: 90px;
}

.wrinting-simulation .form-describe textarea {
  height: 330px;
}

.wrinting-simulation .writing-independent .form-describe textarea {
  height: 450px;
}

.simulation-confirmation {
  width: 100%;
  height: 100%;
  padding-top: 160px;
  background-color: rgba(255, 255, 255, 0.95);
  position: absolute;
  left: 0;
  text-align: center;
  top: 0;
  z-index: 981;
}

.simulation-confirmation-message {
  width: 600px;
  margin: 50px auto;
}

.simulation-confirmation-message h2 {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 15px;
}

.simulation-confirmation-message .btn {
  font-size: 14px;
  font-size: 1.4rem;
  padding: 0 35px;
  height: 40px;
  line-height: 40px;
  text-transform: uppercase;
}

.simulation-confirmation-message .btn-cancel {
  margin-right: 20px;
}

.simulation-confirmation-message .actions {
  margin-top: 50px;
}

.simulation-getready {
  text-align: center;
}

.simulation-speaking .question-content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.simulation-speaking .question-content__box {
  width: 100%;
  padding: 0 30px;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.simulation-speaking .recording-required {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.box-image-man {
  background: url(85407387438c50b7e37ccfeeba970009.jpg) center bottom;
  position: relative;
  background-size: cover;
}

.box-image-man::before,
.box-image-man::after {
  content: '';
  display: block;
  position: absolute;
  width: 100%;
  left: 0;
}

.box-image-man::before {
  height: 100%;
  background: rgba(0, 56, 113, 0.3);
  top: 0;
}

.box-image-man::after {
  height: 5px;
  background-color: #ec3237;
  bottom: 0;
}

.simulation-speaking-question h3 {
  margin-bottom: 40px;
}

.box-info-time {
  margin-top: 50px;
  font-weight: bold;
}

.box-info-time p {
  margin: 0;
}

.box-time-count {
  font-size: 24px;
  font-size: 2.4rem;
}

.box-time-count i {
  font-size: 28px;
  font-size: 2.8rem;
  margin-top: -6px;
}

.box-time-count span {
  font-size: 32px;
  font-size: 3.2rem;
  display: block;
  font-weight: bold;
}

.box-response-time-wrapper {
  margin-top: 30px;
}

.simulation-contextual-actions {
  display: inline-block;
  vertical-align: top;
}

.intro-instruction {
  margin: 0 auto;
}

.header-simulation__content--right {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.reading-simulation simulation-progress {
  width: auto;
}

.reading-simulation .simulation-progress__title {
  margin-right: 0;
}

.simulation-session {
  width: 100%;
  min-width: 550px;
  padding: 150px 50px 170px;
  text-align: center;
  position: relative;
}

.simulation-session--cefr-rl .session-end__footer {
  left: 50%;
  transform: translateX(-50%);
}

.simulation-session__title {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: normal;
  margin-bottom: 30px;
  display: block;
}

.simulation-session__title b {
  text-transform: capitalize;
}

.listening-simulation simulation-progress {
  display: none;
}

.simulation-direction-clip,
.simulation-listening-other-directions {
  padding: 100px;
  display: block;
}

.simulation-direction-clip h1 {
  margin-bottom: 30px;
}

.simulation-listening-question .question-listening,
simulation-listening-question-cefr .question-listening {
  text-align: center;
}

.simulation-listening-question .question-listening .question-content--right,
simulation-listening-question-cefr .question-listening .question-content--right {
  width: 100% !important;
  max-width: 800px;
  text-align: left;
  border: 0;
}

.simulation-listening-question .question-listening .question-content--right .question-scroll,
simulation-listening-question-cefr .question-listening .question-content--right .question-scroll {
  padding: 0;
}

.simulation-listening-done,
.simulation-speaking-done {
  padding: 100px;
  display: block;
  text-align: center;
}

.direction-highlight {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin-bottom: 20px;
  padding: 10px;
  background-color: #e2e8ee;
  text-align: center;
}

.listening-simulation-done {
  text-align: center;
}

.simulation__content camshot {
  position: absolute;
  top: 0;
  right: 0;
  border: 2px solid #003871;
  display: block;
  border-radius: 5px;
  z-index: 9;
}

.simulation__content camshot .loader {
  z-index: 9;
}

.simulation__content camshot video {
  display: block;
}

.simulation-speaking-question .question-content__box {
  margin-top: auto;
  margin-bottom: auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

.requirements__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.requirements__content {
  padding: 0;
}

.requirements__content + .card {
  margin: 30px 0 0 30px;
}

.requirements__content .fe {
  margin-right: 10px;
}

.requirements__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.requirements__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ==========================================================================
   Requirements
   ========================================================================== */

.step__content {
  padding: 50px;
  text-align: center;
  min-height: 420px;
}

.requirements__container {
  display: block;
}

.requirements__content {
  width: 100%;
  position: relative;
}

.step__content h2 small {
  display: block;
}

.requirements-navigation__content {
  display: flex;
  justify-content: space-between;
  padding: 25px 40px;
  text-align: center;
  text-align: center;
  border: 1px solid #dde4ea;
}

.requirements-navigation__content .btn-next {
  margin-left: 20px;
}

.requirements-navigation__content .btn-prev i,
.requirements-navigation__content .btn-exit i {
  margin-right: 20px;
}

.step-record .audioRecorder {
  max-width: 420px;
  position: relative;
  margin: 40px auto 0;
}

.step-welcome__content > img {
  margin-top: 38px;
}

.step-record__backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  align-items: center;
  justify-content: center;
  display: flex;
}

.step-record__backdrop-message {
  color: white;
  text-align: center;
}

.step-disclaimer__content {
  text-align: left;
  max-width: 800px;
  margin: 0 auto;
  margin-top: 40px;
}

.step-disclaimer__content h3 {
  text-align: center;
}

.step-record__substeps {
  text-align: left;
  max-width: 700px;
  margin: 50px auto 40px;
}

.step-record__substeps li + li {
  padding-top: 10px;
}

.btn--reload {
  margin: 0 auto;
}

.requirements__select-language .modal-title {
  margin-bottom: 40px;
}

.requirements__select-language .step-disclaimer__content {
  text-align: center;
}

.requirements__select-language #select--language {
  width: 200px;
  margin: 0 auto 30px;
}

.requirements__emphasis {
  color: #ec3237;
}

.requirements__world-icon {
  font-size: 90px;
  font-size: 9rem;
}

.requirements__world-icon {
  color: #0075ea;
  margin-bottom: 30px;
}

.record--playing-label {
  font-size: 12px;
  font-size: 1.2rem;
}/* ==========================================================================
   CARD
   ========================================================================== */

.passport-modal {
  width: 650px;
  text-align: center;
}

.passport-modal .modal-footer {
  border-top: transparent;
}

.passport-modal .modal-footer,
.passport-modal .cropArea {
  background-color: #F1F0F5;
}

.passport-modal .cropArea {
  padding: 30px 0;
}

.passport-modal ui-cropper {
  position: relative !important;
}

.passport-modal .preview {
  display: flex;
  justify-content: space-around;
  margin-top: 20px;
}

.passport-modal__content {
  padding: 32px 0 0;
}

.passport-modal__content > h1 {
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid #eaeaea;
  margin: 0 40px 20px;
}

.passport-modal__information {
  display: flex;
  margin: 0 40px 20px;
}

.passport-modal__text {
  text-align: left;
  margin-right: 20px;
  margin-bottom: 0;
  flex: 1 1 auto;
}

.passport-modal__text b {
  color: #ec3237;
  font-size: 12px;
}

.passport-modal__image {
  flex: 0 0 auto;
}

.passport-modal__cam .content-btn-upload {
  margin-top: 30px !important;
  padding: 40px;
}

.btns-rotate {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  margin-bottom: 20px;
}

.btns-rotate > button {
  box-shadow: 0px 2px 2px 0px #00000014;
  background-color: #FFFFFF;
  border-radius: 25px;
  font-size: 2rem;
  padding: 6px 16px;
  cursor: pointer;
  color: #5D6670;
  transition: background-color .2s ease-in-out;
}

.btns-rotate > button:hover {
  background-color: #f9f8f9;
}

.btns-rotate .btn--rotate-left {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 1px solid #F4F3F6;
}

.btns-rotate .btn--rotate-right {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Requirements Checking
   ========================================================================== */

.step-welcome__content--checking {
  display: flex;
  max-width: 700px;
  margin: 70px auto 0;
}

.step-welcome__list-instructions i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-right: 15px;
  color: #0075ea;
}

.step-welcome__list-instructions li {
  display: flex;
  align-items: center;
  text-align: left;
  padding: 15px 0;
}

.step-disclaimer__wrapper {
  background-color: rgba(226, 232, 238, 0.5);
  padding: 20px;
  margin-bottom: 20px;
}

.step-disclaimer__scroll {
  padding-right: 30px;
}

.step-fully-visible__list,
.step-double-instructions {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 1fr 1fr;
  max-width: 700px;
  margin: 70px auto 0;
}

.step-fully-visible__list li,
.step-double-instructions li {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 140px;
  margin: 0 auto;
}

.step-fully-visible__list img,
.step-double-instructions img {
  margin-bottom: 40px;
}

.step-single-instruction {
  display: flex;
  max-width: 500px;
  margin: 70px auto 0;
  text-align: left;
  align-items: center;
}

.step-single-instruction img {
  margin: 20px 45px 20px 20px;
}

.step-single-instruction p {
  width: 295px;
}

.step-double-instructions {
  grid-template-columns: 1fr 1fr;
  max-width: 500px;
}

.step-ready__image {
  margin: 40px 0;
}

.step-photo__camera {
  width: 380px;
  height: 287px;
  border: 1px solid #dde4ea;
  margin: 45px auto 0;
  border-radius: 6px;
  position: relative;
}

.step-photo__camera camshot {
  height: 100%;
  display: flex;
}

.step-photo__nav {
  max-width: 380px;
  margin: 16px auto 0;
  display: flex;
  justify-content: space-between;
}

.btn--take-photo {
  min-width: 60%;
  font-weight: bold;
  position: absolute;
  bottom: 26px;
  z-index: 9;
  left: 50%;
  height: 40px;
  line-height: 40px;
  padding: 0 18px;
  font-size: 1.4rem;
  font-weight: normal;
  transform: translate(-50%, 0);
}

.step-photo__camera {
  overflow: hidden;
  position: relative;
}

.step-photo__camera .loading {
  z-index: 8;
}

.step-photo__camera video {
  width: 100%;
}

.step-recorder__time {
  width: 56px;
  height: 56px;
  background: rgba(93, 102, 112, 0.5);
  position: absolute;
  top: 16px;
  right: 16px;
  border-radius: 50%;
  font-size: 24px;
  line-height: 54px;
  text-align: center;
  color: white;
  border: 1px solid white;
}

.step-screen-recorder > p {
  margin-bottom: 25px;
}

.step-screen-recorder .step-welcome__content figure {
  margin: 0;
}

#screen-video video {
  width: 100%;
  max-width: 550px;
}

#room-id {
  position: absolute;
  overflow: hidden;
  visibility: hidden;
}

.step-screen-recorder__shadow {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #5D6670;
  opacity: 0.9;
  transition: .2s ease-in;
}

/* ==========================================================================
   Requirements Checking Upload Your ID
   ========================================================================== */

.requirements__upload-id .modal-title {
  margin-bottom: 40px;
}

.requirements__upload-id .step-disclaimer__content {
  text-align: center;
}

.requirements__upload-id p {
  padding: 0 0 9px 0;
}

.requirements-screen-recorder .modal-title {
  margin-bottom: 16px;
}

.requirements-screen-recorder small {
  color: #ec3237;
}

.requirements-screen-recorder__content {
  margin-top: 32px;
  text-align: center;
}

.requirements_upload-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 590px;
  margin: 20px auto 40px;
}

.requirements_upload-buttons .btn--upload-id {
  border: none;
  outline: none;
  height: 140px;
  width: 48%;
  background: #F2F8FE;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.requirements_upload-buttons .btn--upload-id i {
  font-size: 16px;
  background: #DAEBFC;
  padding: 16px;
  border-radius: 50px;
  color: #0075EA;
  margin-bottom: 16px;
}

.requirements_upload-buttons .btn--upload-id .requirements__camera-icon {
  font-size: 24px;
  padding: 12px;
}

.requirements_upload-buttons .btn--upload-id span {
  font-size: 16px;
  color: #5D6670;
}

.requirements_advise-upload-id {
  width: 590px;
  background: #FDEBEB;
  border-radius: 6px;
  display: flex;
  align-items: center;
  margin: 0 auto;
}

.requirements_advise-upload-id div {
  display: block;
  align-items: flex-start;
  text-align: initial;
  font-size: 12px;
  margin: 5px 8px 5px 24px;
  padding-right: 15px;
}

.requirements_advise-upload-id img {
  border-style: none;
  margin: 24px 24px 24px 7px;
  width: 180px;
}

.requirements_advise-upload-id div span {
  color: #EC3237;
  font-size: 12px;
  font-weight: bold;
}

.requirements_advise-upload-id div .requirements__advise-text {
  color: #5D6670;
}

/* ==========================================================================
   Requirements Take Picture Your ID
   ========================================================================== */

.requirements_photo-id .picture {
  width: 380px;
  margin: 0 auto;
  height: 300px;
  border-radius: 6px;
  border: 1px solid #E1E0E7;
  display: grid;
}

.requirements_photo-id .picture img,
.requirements_photo-id .picture .icon-image {
  border-style: none;
  margin: 85px auto 0;
}

.requirements_photo-id .picture .take-photo {
  width: 64px;
}

.requirements_photo-id .picture .icon-360 {
  margin: 65px auto 0;
}

.requirements_photo-id .picture button {
  width: fit-content;
  margin: auto;
  bottom: 0;
  height: 40px;
}

.requirements_photo-id .picture button i {
  font-size: 16px;
}

/* ==========================================================================
   Requirements Passaport Upload
   ========================================================================== */

.passport-modal.passport-requirements {
  margin: 0 auto;
  text-align: center;
}

.passport-modal.passport-requirements ui-cropper {
  height: 260px !important;
}

.passport-modal.passport-requirements .cropArea {
  background-color: transparent;
}

.passport-modal.passport-requirements .upload-avatar-form {
  width: 390px;
  margin: 0 auto;
}

.passport-modal.passport-requirements .preview {
  margin-top: 20px;
  justify-content: space-between;
}

.passport-modal.passport-requirements .btns-rotate {
  margin-top: 0;
  margin-bottom: 0;
}

.btn--cancel-recording {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 10px;
  height: 40px;
  line-height: 40px;
}

.step-photo__wrapper {
  display: flex;
}

.step-photo__wrapper > div {
  width: 50%;
}

.step-photo__wrapper > div + div {
  max-width: 380px;
  margin-left: 70px;
}

.step-photo__wrapper {
  padding: 45px 0;
  max-width: 780px;
  margin: 0 auto;
}

.step-photo__wrapper .step-photo__camera {
  margin-top: 0;
}

.step-photo__image-scan {
  display: flex;
  align-items: center;
  justify-content: center;
}

.step-photo__image-scan p {
  margin-bottom: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

.dashboard-analysis {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.dashboard-analysis {
  padding: 0;
}

.dashboard-analysis + .card {
  margin: 30px 0 0 30px;
}

.dashboard-analysis .fe {
  margin-right: 10px;
}

.dashboard-analysis:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.dashboard-analysis-item__disabled .dashboard-analysis-item__icon {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.dashboard {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.card__header {
  font-size: 16px;
  font-size: 1.6rem;
  width: 100%;
  min-height: 60px;
  padding: 0 15px;
  background: rgba(93, 102, 112, 0.05);
  border-bottom: 1px solid rgba(93, 102, 112, 0.2);
  color: #5d6670;
  display: inline-block;
  font-weight: bold;
  line-height: 59px;
  vertical-align: top;
}

.card__header > i {
  font-size: 18px;
  font-size: 1.8rem;
  margin: -3px 2px 0 0;
}

.card__header--inverse {
  font-size: 14px;
  font-size: 1.4rem;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
  background: white;
}

.card__header--full {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.dashboard-analysis {
  width: 100%;
  display: inline-block;
  vertical-align: top;
}

.dashboard-analysis .fe-avg-time {
  margin-top: -4px;
}

.dashboard-analysis .icon-edusynch {
  width: 100%;
}

.dashboard-analysis .icon-edusynch i {
  padding: 13px;
}

.dashboard-analysis__overview {
  display: block;
  border-bottom: 1px solid #dde4ea;
  padding: 1.4rem;
  text-align: center;
}

.dashboard-analysis__overview ul {
  display: flex;
  justify-content: space-around;
}

.dashboard-analysis__overview li {
  min-width: calc(25% - 3px);
  display: inline-block;
}

.dashboard-analysis__overview strong {
  opacity: 0.6;
  filter: alpha(opacity=60);
  display: block;
  text-transform: uppercase;
  font-size: 75%;
}

.dashboard-analysis__overview span {
  line-height: 24px;
  line-height: 2.4rem;
}

.dashboard-analysis__content {
  width: 100%;
  text-align: left;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.dashboard-analysis__content .tooltip-score {
  width: 230px;
}

.dashboard-analysis__content .projected-score .count {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 15px;
}

.dashboard-analysis__content .go-practice {
  -webkit-transition: 0.3s ease-in all;
  -moz-transition: 0.3s ease-in all;
  -ms-transition: 0.3s ease-in all;
  -o-transition: 0.3s ease-in all;
  transition: 0.3s ease-in all;
  opacity: 0;
  filter: alpha(opacity=0);
  font-size: 10px;
  font-size: 1rem;
  bottom: 10px;
  color: #dde4ea;
  font-weight: bold;
  right: 15px;
  position: absolute;
  text-transform: uppercase;
}

.dashboard-analysis__content .go-practice i {
  font-size: 12px;
  font-size: 1.2rem;
  margin: 2px 0 0 5px;
  color: inherit;
}

.dashboard-analysis__content--speedup {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.dashboard-analysis-item--disabled {
  position: relative;
}

.dashboard-analysis-item--disabled .dashboard-analysis-item__link::after {
  opacity: 0.65;
  filter: alpha(opacity=65);
  background-color: #fff;
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.dashboard-analysis-item--disabled .tooltip-content {
  min-width: 150px;
  z-index: 99;
  top: 64%;
}

.dashboard-analysis-item--disabled .icon-edusynch {
  background-color: #dde4ea !important;
}

.dashboard-analysis-item__disabled {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  position: absolute;
}

.dashboard-analysis-item__disabled .dashboard-analysis-item__icon {
  -moz-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  font-size: 34px;
  font-size: 3.4rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  background: #fff;
  padding: 20px;
}

.dashboard-analysis-item__time {
  padding: 20px 26px;
  text-align: left;
  display: block;
}

.dashboard-analysis-item__time > span {
  width: 100%;
  margin-bottom: 15px;
  display: inline-block;
}

.dashboard-analysis-item__time > span .legend {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
}

.dashboard-analysis-item__time i {
  font-size: 14px;
  font-size: 1.4rem;
  color: #747f8c;
}

.dashboard-analysis-item__time strong {
  display: inline-block;
  margin-bottom: 8px;
}

.dashboard-analysis-item__name {
  font-size: 16px;
  font-size: 1.6rem;
  color: #5d6670;
  font-weight: bold;
  display: inline-block;
  text-align: left;
}

.dashboard-analysis-item {
  width: 25%;
  text-align: center;
}

.dashboard-analysis-item + .dashboard-analysis-item {
  border-left: 1px solid rgba(93, 102, 112, 0.2);
}

.dashboard-analysis-item__link {
  width: 100%;
  min-height: 200px;
  color: #5d6670;
  display: block;
  position: relative;
  text-align: left;
}

.dashboard-analysis-item__link:focus,
.dashboard-analysis-item__link:hover {
  background-color: rgba(221, 228, 234, 0.1);
}

.dashboard-analysis-item__link:focus .go-practice,
.dashboard-analysis-item__link:hover .go-practice {
  opacity: 1;
  filter: alpha(opacity=100);
  right: 10px;
}

.dashboard-analysis-item__header {
  display: grid;
  align-items: center;
  grid-template-columns: 48px 1fr;
  gap: 0 20px;
  padding: 20px 25px;
}

.dashboard-card__header {
  font-size: 18px;
  font-size: 1.8rem;
}

.dashboard-analysis--practice {
  margin-bottom: 30px;
}

.dashboard-analysis--simulation {
  margin-left: 0;
}

.dashboard-analysis--simulation .icon-edusynch {
  background-color: #0075ea;
}

.introjs-helperLayer {
  display: none !important;
}

.introjs-tooltiptext {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.pricing__header {
  text-align: center;
}

.pricing__header p {
  margin: 20px auto;
  max-width: 500px;
}

.pricing__container {
  margin: 40px auto;
  text-align: center;
}

.pricing__container > ul {
  margin-bottom: 30px;
}

.pricing-item {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-transition: 0.3s all ease;
  -moz-transition: 0.3s all ease;
  -ms-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  transition: 0.3s all ease;
  width: 285px;
  padding: 30px 0;
  min-height: 600px;
  background-color: #fff;
  border: 1px solid rgba(221, 228, 234, 0.5);
  cursor: pointer;
  display: inline-block;
  position: relative;
  vertical-align: top;
  text-align: center;
}

.pricing-item:hover,
.pricing-item:focus {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  -o-transform: scale(1.04);
  transform: scale(1.04);
}

.pricing-item:focus {
  outline: none;
}

.pricing-item .custom {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  text-align: center;
  width: 60px;
  height: 60px;
  line-height: 68px;
  margin: 0 auto;
  border: 2px solid rgba(0, 117, 234, 0.2);
}

.pricing-item .custom i {
  font-size: 30px;
  font-size: 3rem;
  color: #0075ea;
}

.pricing-item__header {
  width: 100%;
  height: 250px;
  display: block;
}

.pricing-item__title {
  font-size: 1.6em;
  letter-spacing: 0.03em;
}

.pricing-header__legend {
  min-height: 77px;
  padding: 2px 10px !important;
}

.pricing-item__legend {
  min-height: 75px;
  padding: 2px 10px;
  display: block;
  position: relative;
}

.pricing-item__legend::before {
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  width: 70px;
  height: 4px;
  margin-top: 10px;
  background: rgba(0, 0, 0, 0.1);
  bottom: 20px;
  content: '';
  display: block;
  left: 50%;
  position: absolute;
}

.pricing-item-price__value {
  font-size: 42px;
  font-size: 4.2rem;
  margin-bottom: 0;
  padding: 20px 0 0;
  color: #0075ea;
  font-weight: bold;
  line-height: 0.7;
  min-height: 60px;
}

.pricing-item-price__value span {
  display: inline-block;
}

.pricing-item-price__value .pricing-item__partial,
.pricing-item-price__value .pricing-item__current {
  font-size: 21px;
  font-size: 2.1rem;
  vertical-align: top;
}

.pricing-item-price__value span:last-of-type {
  vertical-align: bottom;
}

.pricing-item-price__value .old-value {
  margin-top: 15px;
  display: block;
  text-align: right;
}

.pricing-item__partial {
  padding: 0;
  color: #5d6670;
}

.checkout-total__pricing,
.pricing-item-price__text {
  font-size: 11px;
  font-size: 1.1rem;
  margin: 22px 0 0 0;
  display: block !important;
  color: #0075ea;
  font-weight: normal;
  text-transform: uppercase;
}

.checkout-total__pricing,
.pricing-item-price__text--vista {
  color: #30b770;
}

.pricing-item-price__text > span {
  display: block;
  height: 18px;
  line-height: 18px;
  margin-bottom: 5px;
}

.pricing-item__details {
  margin-bottom: 30px;
  padding: 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  font-size: 0.9em;
  list-style: none;
}

.pricing-item__details > li {
  padding: 10px 15px;
  min-height: 60px;
  text-align: left;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.pricing-item__details > li + li {
  border-top: 1px solid #e5e5e5;
}

.pricing-item__details > li:nth-child(2n+1) {
  background: rgba(226, 232, 238, 0.3);
}

.pricing-item__details > li i {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  font-size: 16px;
  font-size: 1.6rem;
  padding: 0 0.5rem;
  height: 32px;
  margin-right: 10px;
  display: block;
  line-height: 32px;
  text-align: center;
}

.pricing-item__details > li .fe-check {
  color: #30b770;
}

.pricing-item__details > li .fe-close {
  color: #dde4ea;
}

.pricing-item__details > .disabled span,
.pricing-item__details > .disabled i {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.link-custom {
  padding: 15px 20px;
  margin-bottom: 50px;
  display: inline-block;
}

.link-custom .btn {
  margin-left: 5px;
}

.pricing__ribbon-discount {
  width: 75px;
  height: 75px;
  display: block;
  position: absolute;
  overflow: hidden;
  right: -5px;
  text-align: right;
  top: -5px;
  z-index: 1;
}

.pricing__ribbon-discount span {
  font-size: 10px;
  font-size: 1rem;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  color: #fff;
  font-weight: bold;
  line-height: 20px;
  width: 100px;
  display: block;
  background: #30b770;
  box-shadow: 0 3px 10px -5px black;
  position: absolute;
  top: 19px;
  right: -21px;
  text-transform: uppercase;
  text-align: center;
}

.pricing__ribbon-discount span::before,
.pricing__ribbon-discount span::after {
  content: '';
  position: absolute;
  border-bottom: 3px solid transparent;
  border-top: 3px solid #11a06f;
  z-index: -1;
}

.pricing__ribbon-discount span::before {
  left: 0px;
  top: 100%;
  border-left: 3px solid #11a06f;
  border-right: 3px solid transparent;
}

.pricing__ribbon-discount span::after {
  right: 0%;
  top: 100%;
  border-right: 3px solid #11a06f;
  border-left: 3px solid transparent;
}

.plan--discount {
  position: relative;
}

.pricing-discount {
  font-size: 13px;
  font-size: 1.3rem;
  margin: 17px -50px 0 0;
  color: #30b770;
  text-align: right;
  text-transform: uppercase;
}

.price-discount span {
  color: #30b770;
}

.payment-method {
  margin: 0 auto;
  display: inline-block;
}

.payment-method li {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 5px;
  min-width: 60px;
  text-align: center;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
}

.payment-method li + li {
  margin-left: 10px;
}

.payment-method li img {
  max-width: 50px;
  height: 25px;
  vertical-align: middle;
}

.payment-method__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.payment-method__country {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.payment-method__title {
  margin-right: 15px;
  padding-top: 8px;
  display: inline-table;
}

.payment-method__select {
  font-size: 16px;
  font-size: 1.6rem;
  min-width: 100px;
  height: 40px;
  margin-right: 30px;
  background-color: #fff;
  border: none;
}

.payment-method__flag {
  width: 15px;
  height: 15px;
  margin-right: 15px;
  display: inline-block;
  background-color: #eee;
}

.payment-method__list {
  margin-top: 4px;
  text-align: left;
}

.payment-method__list img {
  height: 20px;
}

.payment-method--checkout {
  width: 100%;
  padding: 30px 50px;
}

.payment-method--checkout .payment-method__select {
  border: 1px solid #dde4ea;
}

.payment-method--checkout .payment-method__content {
  justify-content: flex-start;
}

.payment-method__list--checkout {
  max-width: 360px;
}

.payment-method__list--checkout li {
  margin-bottom: 5px;
  border: 1px solid #dde4ea;
}

.payment-method__list--checkout li:nth-child(5n+1) {
  margin-left: 0;
}

.payment-method__list--checkout li img {
  height: 20px;
}

/* ==========================================================================
   FALTA REFATORAR
   ========================================================================== */

.payment-history .btn-download {
  display: inline-block;
}

.payment-history .btn-download > i {
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
}

.payment-history .btn-download + .btn-download {
  margin-left: 10px;
}

.btn-pricing--customize {
  line-height: 42px;
  height: 42px;
  text-transform: uppercase;
  font-size: 14px;
  font-size: 1.4rem;
}

.old-value {
  font-size: 16px;
  font-size: 1.6rem;
  color: #dde4ea;
  display: inline-block;
  text-decoration: line-through;
}

.payment-gateway-by-country {
  margin-bottom: 50px;
  display: block;
}

.paytm-logo {
  width: 32%;
  display: inline-block;
}

.paytm-logo img {
  width: 100%;
  margin-top: 8px;
}

.payment-total {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 10px;
}

.payment-salestax {
  text-align: right;
}

.undeline {
  width: 190px;
  border: 1px solid #000;
  display: inline-block;
}

payment-india .checkout-form {
  width: 40%;
}

payment-india .payment-total {
  width: 50%;
}

@media (max-width: 1200px) {
  .pricing-item {
    width: 390px;
  }
}/* ==========================================================================
   CARD
   ========================================================================== */

.settings-sidebar,
.settings__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.settings-sidebar,
.card-content.settings__content {
  padding: 0;
}

.settings-sidebar + .card,
.settings__content + .card {
  margin: 30px 0 0 30px;
}

.settings-sidebar .fe,
.settings__content .fe {
  margin-right: 10px;
}

.settings-sidebar:hover,
.settings__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.settings__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.settings {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   SETTINGS
   ========================================================================== */

.settings-sidebar {
  width: calc(38% - 30px);
  margin-right: 30px;
  position: relative;
}

.settings__content {
  width: calc(62% - 15px);
  min-height: 425px;
  margin: 0;
}

.actions--settings {
  width: 100%;
  height: auto;
  margin-top: 40px !important;
  display: flex !important;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  text-align: center;
  position: relative;
}

.actions--settings.unique {
  justify-content: center;
}

.settings__button {
  margin: 0 !important;
}

.actions--settings__loader {
  left: 0;
  top: 0;
}

.actions--settings__loader svg {
  margin: -25px 0 0 -240px;
}

.media--settings {
  padding: 28px 20px;
  margin-bottom: 0;
  border-bottom: 1px solid #e5eef4;
  position: relative;
}

.media--settings__name,
.media--settings__email {
  display: block;
  word-break: break-all;
}

.media--settings__name {
  font-size: 18px;
  font-size: 1.8rem;
  margin-top: 20px;
  margin-bottom: 5px;
}

.media--settings__email {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-weight: bold;
}

.avatar--settings,
.avatar--settings__button {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}

.avatar--settings {
  padding: 2px;
  border: 1px solid #ccc;
  position: relative;
  text-align: center;
}

.avatar--settings img {
  vertical-align: middle;
}

.avatar--settings__button {
  width: 32px;
  height: 32px;
  line-height: 31px;
  position: absolute;
  top: 4px;
  right: -4px;
  background: #0075ea;
  color: white;
  -webkit-transition: background-color 0.2s ease-in-out;
  -moz-transition: background-color 0.2s ease-in-out;
  -ms-transition: background-color 0.2s ease-in-out;
  -o-transition: background-color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out;
}

.avatar--settings__button:hover {
  background-color: #51a8ff;
}

.settings-sidebar__nav a {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  padding: 24px 21px;
  display: block;
  border-left: 4px solid transparent;
  color: #5d6670;
}

.settings-sidebar__nav a:hover,
.settings-sidebar__nav .active {
  background-color: #f6f9fb;
  border-left: 4px solid #0075ea;
}

.upload-image {
  width: 100%;
  height: 120%;
  background: #fff;
  position: absolute;
  text-align: center;
  /* border: 1px dotted #ccc; */
  top: 0;
  left: 0;
  padding: 2rem;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.upload-image .upload-title {
  margin-bottom: 26px;
  position: relative;
}

.upload-image .btn-cancel {
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
  background: none;
  position: absolute;
  left: 0;
  top: 12px;
}

.upload-image form {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  border: 3px dashed rgba(0, 0, 0, 0.2);
  width: 100%;
  height: 300px;
  position: relative;
  margin-bottom: 30px;
}

.upload-image .btn--small {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 40px;
  height: 40px;
  display: block;
  color: #5d6670;
  background-color: #fff;
  bottom: 10px;
  line-height: 40px;
  position: absolute;
  text-align: center;
}

.upload-image .btn--small.done {
  right: 0;
  background-color: #11a06f;
  color: #fff;
}

.upload-image .feedback {
  width: 100%;
  bottom: -100px;
  position: absolute;
}

.upload-image .feedback > span {
  display: block;
}

.settings__button--save {
  cursor: pointer;
  right: 0;
}

.content-btn-upload {
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  position: relative;
  overflow: hidden;
  height: 40px;
}

.content-btn-upload .btn-upload {
  width: 200px;
  height: 40px;
}

.content-btn-upload .progress {
  line-height: 15px;
  position: absolute;
  left: 0;
  width: 100%;
  height: 40px;
  display: inline-block;
  top: 0;
}

.content-btn-upload .progress div {
  width: 0;
  height: 40px;
  background: rgba(0, 0, 0, 0.5);
  line-height: 40px;
}

.connect-social {
  margin-top: 40px !important;
}

.connect-social > span {
  display: block;
  margin-bottom: 20px;
}

.connect-social i {
  font-size: 16px;
  font-size: 1.6rem;
  margin-top: -3px;
  color: inherit;
}

.connect-social li + li {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e2e8ee;
}

.connect-social li > span {
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 5px;
  display: inline-block;
  text-transform: uppercase;
}

.connect-social .btn-toggle {
  float: right;
}

.connect-social .tip-status {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  font-size: 9px;
  font-size: 0.9rem;
  margin-left: 5px;
  padding: 3px 5px;
  color: #5d6670;
  display: inline-block;
  font-weight: bold;
  border: 1px solid #eee;
}

.license-list {
  width: 360px;
  margin: 0 auto;
}

.license-list i {
  color: #a2b5c9;
}

.license-list li {
  width: 60px;
  position: relative;
}

.license-list li::after {
  content: '-';
  color: #dde4ea;
  display: block;
  position: absolute;
  right: -15px;
  top: 10px;
}

.license-list li + li {
  margin: 0 0 0 20px;
}

.license-list li input {
  padding: 0;
  text-align: center;
}

.license-list li:first-child::after,
.license-list li:last-child::after {
  display: none;
}

.form-settings .license-list li {
  width: 270px;
  position: relative;
  display: inline-block;
}

.form-settings .license-list li:first-child {
  width: 20px;
}

/*
   FORM SETTINGS
   ========================================================================== */

.form-settings {
  width: 100%;
  padding: 35px 50px;
}

.form-settings li {
  width: 100%;
  display: inline-block;
}

.form-settings li + li {
  margin-top: 20px;
}

.form-settings .input-2 {
  width: 100%;
  float: left;
}

.form-settings .input-2 > ul > li {
  width: 45%;
  float: left;
}

.form-settings .input-2 > ul > li + li {
  margin: 0;
  float: right;
}

.form-settings .btn--primary i {
  margin-left: 15px;
}

.form-settings .box-password {
  width: 100%;
  margin: 10px 0 20px;
  display: inline-block;
}

.form-settings-license-details header {
  position: relative;
  padding-left: 70px;
  border-bottom: 1px solid #e5eef4;
  margin-bottom: 30px;
  padding-bottom: 15px;
}

.form-settings-license-details .sa-icon-box {
  position: absolute;
  top: 0;
  left: 0;
}

.form-settings-license-details h2 {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: normal;
}

.form-settings-license-details h2 strong {
  display: block;
  margin-bottom: 20px;
}

.form-settings-license-details h3 {
  font-size: 14px;
  font-size: 1.4rem;
  color: #aebecd;
  text-transform: uppercase;
}

.form-settings-license-details li {
  height: 25px;
  font-size: 12px;
  font-size: 1.2rem;
}

.form-settings-license-details li + li {
  margin: 0;
}

.form-settings-license-details b {
  width: 80px;
  text-transform: uppercase;
}

.form-settings-license-details ul {
  margin-top: 20px;
}

.change-password {
  float: right;
}

.change-password label {
  float: left;
  cursor: pointer;
}

.change-password input {
  width: 16px;
  height: auto;
  margin: 4px 10px 0 0;
  float: left;
}

.form-settings-license-boxes {
  width: 45%;
  display: inline-block;
  vertical-align: top;
}

.form-settings-license-boxes + .form-settings-license-boxes {
  width: 54%;
}

.form-settings-license-boxes + .form-settings-license-boxes li {
  width: 49%;
  height: 30px;
  text-align: left;
}

.form-settings-license-boxes + .form-settings-license-boxes h3 {
  text-align: center;
}

.form-settings-license-boxes + .form-settings-license-boxes .license-box__cefr-title {
  text-align: left;
}

.form-settings-license-boxes + .form-settings-license-boxes .license-test {
  display: inline-block;
  width: 49%;
  margin-top: 17px;
  font-size: 13px;
}

.form-settings-license-boxes + .form-settings-license-boxes .license-test--cefr {
  width: 100%;
}

.form-settings-license-boxes + .form-settings-license-boxes .license-test--cefr b {
  width: 160px;
}

.form-settings-license-boxes .license-test {
  vertical-align: top;
}

.form-settings-license-boxes .license-test__full b,
.form-settings-license-boxes .license-test__partials b {
  display: inline-block;
  width: 96px;
}

.form-settings-license-boxes .license-test__full b {
  width: 96px;
  display: inline-block;
}

.form-settings-license-boxes .license-test__partials li {
  display: block;
  width: 100%;
}

/*
  SOCIAL CONNECTION
  =========================================================================== */

.orb-connection {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
}

.orb-connection:before {
  color: white;
}

.orb-facebook {
  background-color: #5472bd;
  background-image: -moz-linear-gradient(top, #6382cf, #3e5ba3);
  background-image: -ms-linear-gradient(top, #6382cf, #3e5ba3);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#6382cf), to(#3e5ba3));
  background-image: -webkit-linear-gradient(top, #6382cf, #3e5ba3);
  background-image: -o-linear-gradient(top, #6382cf, #3e5ba3);
  background-image: linear-gradient(top, #6382cf, #3e5ba3);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6382cf', endColorstr='#3e5ba3', GradientType=0), #6382cf, #3e5ba3;
}

.orb-google {
  background-color: #e44226;
  background-image: -moz-linear-gradient(top, #f45438, #cb270a);
  background-image: -ms-linear-gradient(top, #f45438, #cb270a);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f45438), to(#cb270a));
  background-image: -webkit-linear-gradient(top, #f45438, #cb270a);
  background-image: -o-linear-gradient(top, #f45438, #cb270a);
  background-image: linear-gradient(top, #f45438, #cb270a);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f45438', endColorstr='#cb270a', GradientType=0), #f45438, #cb270a;
}

/*
  Image uploader
  =========================================================================== */

.cropArea {
  background: #f7f7f7;
}

.progress {
  display: block;
  width: 100%;
  border: 3px groove #CCC;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 999;
}

.progress div {
  background: rgba(0, 0, 0, 0.3);
  width: 0;
  height: 100%;
}

img-crop,
ui-cropper {
  height: 290px !important;
  position: absolute !important;
  top: 0;
  left: 0;
}

ui-cropper {
  height: 400px !important;
}

.content-btn-upload {
  margin-top: 100px !important;
  height: auto !important;
  margin: auto;
}

.content-btn-upload span {
  font-size: 20px;
  font-size: 2rem;
  opacity: 0.4;
  filter: alpha(opacity=40);
  display: block;
  margin-bottom: 20px;
}

.preview .btn--default {
  float: left;
}

.preview .btn--default + .btn {
  float: right;
}

.form-list input:focus + .tooltip-content.tooltip-content-left {
  -webkit-transition: left 0.2s ease-in;
  -moz-transition: left 0.2s ease-in;
  -ms-transition: left 0.2s ease-in;
  -o-transition: left 0.2s ease-in;
  transition: left 0.2s ease-in;
  left: -19px;
}

.payment-history-zero-data {
  margin-top: 90px;
}

.actions--license {
  text-align: center;
}

.form-license__button {
  margin-top: 40px;
}

.social-connections__title {
  margin-bottom: 20px;
  display: block;
}

#select--language {
  max-width: 200px;
  display: block;
}

#select--timezone {
  min-width: 200px;
  width: 100%;
}

.settings .referral-code {
  box-shadow: 0 0 0;
  padding: 35px 50px;
}

.settings .referral-code:hover {
  box-shadow: 0 0 0;
}

.settings .referral-code .card__header {
  background-color: transparent;
  border-color: transparent;
}/* ==========================================================================
   CARD
   ========================================================================== */

payment-enabled {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

payment-enabled.card-content {
  padding: 0;
}

payment-enabled + .card {
  margin: 30px 0 0 30px;
}

payment-enabled .fe {
  margin-right: 10px;
}

payment-enabled:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

payment-enabled {
  width: 800px;
  height: 380px;
  display: flex;
  margin: 0 auto;
  position: relative;
}

.payment-enabled__content {
  display: flex;
  padding: 80px;
}

.payment-enabled__image img {
  position: absolute;
  right: 40px;
  bottom: 40px;
}

.payment-enabled__email {
  font-size: 21px;
  font-size: 2.1rem;
  color: #0075ea;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--full_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* @TODO ARRUMAR VARIAVEIS AQUI, COMECEI A CONSERTAR MAS ACHO Q
  VAI SER MELHOR FAZER UM PENTE FINO DEPOIS */

.reading-questions .question__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin-bottom: 30px !important;
  display: block;
  color: #5d6670;
}

.reading-questions .question-item {
  width: 100%;
  margin-bottom: 0;
  color: #5d6670;
  display: inline-block;
  vertical-align: top;
}

.reading-questions .question-item + .question-item {
  margin-top: 30px;
}

.question-scroll {
  width: 100%;
  padding-right: 20px;
  overflow: hidden;
}

.question-item em {
  color: #ec3237;
  text-decoration: underline;
}

.question-passage .question-scroll {
  height: 460px;
}

.id-info-select {
  width: 22%;
  position: absolute;
  top: 4px;
  left: 65px;
}

.id-info-select select {
  font-size: 13px;
  border: 1px solid #ccc;
  border-radius: 30px;
  padding: 10px;
}

.id-info-label {
  width: 70%;
  margin-left: 150px;
}

.id-info-label:hover {
  border-color: #fff !important;
}

.diagram-closed-dec {
  background: #eaeaea;
  padding: 10px 20px;
  margin: 22px auto;
}

.diagram-closed-alternatives {
  float: left;
  width: 48%;
  margin: 4px;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

.matching-question-body {
  background: #e2e4e6;
  padding: 12px;
  margin-bottom: 10px;
}

.matching-question-body-head {
  font-size: 18px;
}

.correct-answer-tooltip {
  font-size: 15px !important;
  height: 24px !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Writing question type 01
   ========================================================================== */

.time-spend {
  font-size: 14px;
  font-weight: 600;
  margin-top: 10px;
  display: block;
}

.writing-task1-passage-image {
  text-align: center;
  margin: 10px auto;
}

.writing-task1-passage-image img {
  width: 100%;
  height: 100%;
}

.writing-task1-question {
  white-space: pre-wrap;
  margin: 10px auto;
  font-weight: 600;
  font-size: 14px;
}

.writing-task1-question-header {
  margin-bottom: 10px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.writing-task2-question-content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  padding: 10px 30px;
  background: #d1ecf1;
  border: 1px solid #bee5eb;
  color: #0c5460;
}

.writing-task2-step-2 {
  white-space: pre-wrap;
  margin: 20px auto;
}

.bold-font {
  font-weight: bold;
}

.task2-description {
  width: 100% !important;
  min-height: 350px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question-list--linline .answers-ielts {
  display: inline;
}

.orb-inline {
  display: inline-block;
}

simulation-partial-writing-ielts-academic .question-content--left,
simulation-partial-writing-ielts-academic .question-content--right {
  min-height: auto;
}

.listening-diagram-image {
  text-align: center;
  margin-bottom: 30px;
}

.listening-diagram-image img {
  width: 60%;
}

.matching-question-body {
  background: #e2e4e6;
  padding: 12px;
  margin-bottom: 10px;
}

.diagram-closed-dec {
  background: #eaeaea;
  padding: 10px 20px;
}

.diagram-closed-alternatives {
  float: left;
  width: 48%;
  margin: 4px;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   QUESTIONS
   ========================================================================== */

.question__section {
  font-size: 26px;
  font-size: 2.6rem;
  margin-bottom: 30px;
  display: block;
}

[class$="-answer-wrong"] input[type=text],
[class$="-answer-wrong"] select {
  color: #ec3237;
  border-color: #ec3237;
}

[class$="-answer-correct"] input[type=text],
[class$="-answer-correct"] select {
  color: #11a06f;
  border-color: #11a06f;
}

.question-phrase {
  font-size: 18px;
  font-size: 1.8rem;
  width: 100%;
  margin-bottom: 40px;
  padding: 20px;
  background-color: #f6f8fa;
  color: #5d6670;
  display: block;
  font-weight: bold;
}

.question-full {
  width: 100%;
  padding: 40px 40px 110px;
  position: relative;
}

.question-full .question-content {
  padding: 0;
}

/*
   QUESTION PARTIAL, EXPAND AND CLOSE PASSAGE
   ========================================================================== */

.question-expand .question-content--left {
  width: 0%;
  visibility: hidden;
  overflow: hidden;
}

.question-expand .question-content--left .question-content {
  opacity: 0;
  filter: alpha(opacity=0);
}

.question-expand .question-content--right {
  width: 100%;
  visibility: visible;
}

.question-expand .paragraph-header-text {
  text-align: center;
}

.question-partial .question-content--left,
.question-partial .question-content--right {
  width: 50%;
  visibility: visible;
}

.question-partial .question-content--left .question-content,
.question-partial .question-content--right .question-content {
  -webkit-transition: 0.8s ease-in all;
  -moz-transition: 0.8s ease-in all;
  -ms-transition: 0.8s ease-in all;
  -o-transition: 0.8s ease-in all;
  transition: 0.8s ease-in all;
  opacity: 1;
  filter: alpha(opacity=100);
}

.passage-close .question-content--left {
  width: 100%;
  visibility: visible;
}

.passage-close .question-content--right {
  width: 0%;
  height: 0;
  border-left: 0;
  visibility: hidden;
  overflow: hidden;
}

.passage-close .question-content--right .question-content {
  opacity: 0;
  filter: alpha(opacity=0);
}

.btn-open {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 12px;
  font-size: 1.2rem;
  height: 34px;
  padding: 0 30px;
  line-height: 34px;
  left: 50%;
  position: absolute;
  text-transform: uppercase;
  top: 0;
  visibility: hidden;
  z-index: 99;
}

.passage-close .btn-open {
  visibility: visible;
}

.audio-test {
  padding: 80px 0;
  text-align: center;
}

.audio-test p {
  margin-bottom: 30px;
}

@keyframes pulse {
  50% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
  }
}

.box-audio {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  width: 100px;
  height: 100px;
  padding: 20px;
  margin: 70px auto;
  cursor: pointer;
  display: block;
  background-color: #0075ea;
  position: relative;
  border: none;
  outline: none;
}

.box-audio::after,
.box-audio::before {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: #0075ea;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.box-audio::before {
  opacity: 0.1;
  filter: alpha(opacity=10);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}

.box-audio::after {
  opacity: 0.05;
  filter: alpha(opacity=5);
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -o-transform: scale(1.4);
  transform: scale(1.4);
}

.box-audio i {
  font-size: 26px;
  font-size: 2.6rem;
  color: #fff;
}

.box-audio ng-md-icon {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
}

.intro-stop::after,
.intro-stop::before {
  animation-name: pulse;
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 3;
}

.btn--primary-play {
  margin-bottom: 40px;
  font-weight: normal;
}

.btn--primary-play span {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  width: 25px;
  height: 25px;
  margin: 12px 0 0 20px;
  background-color: #fff;
  display: block;
  float: right;
}

.btn--primary-play .fe-check {
  margin: -4px 0 0 10px;
}

.audio-test-limit {
  padding: 0;
}

.audio-test-limit .question-content--right {
  padding-top: 70px;
}

.audio-test-limit .notice {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 16px;
  font-size: 1.6rem;
  width: 60%;
  display: block;
  text-align: center;
  top: 50%;
  left: 50%;
  position: absolute;
}

.audio-test-limit .notice i {
  font-size: 42px;
  font-size: 4.2rem;
  margin: 0 auto 15px;
  color: #778ea7;
  display: block;
}

.audio-test-limit .box-speaking-record {
  margin: 0 auto 20px;
}

.question-scroll-content .scroll-down {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transition: 0.3s ease-in opacity;
  -moz-transition: 0.3s ease-in opacity;
  -ms-transition: 0.3s ease-in opacity;
  -o-transition: 0.3s ease-in opacity;
  transition: 0.3s ease-in opacity;
  font-size: 9px;
  font-size: 0.9rem;
  padding: 4px 10px;
  color: #5d6670;
  bottom: 0;
  right: 5px;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
}

.question-scroll-content .scroll-down i {
  margin: 0 !important;
  display: block;
}

.question-scroll-content:hover .scroll-down {
  opacity: 0;
  filter: alpha(opacity=0);
}

.question-type-table .wrap-question-table {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: adjust-lightness(#e2e8ee, 5);
  border: 1px solid #d7dce2;
  overflow: hidden;
}

.question-type-table .question-table thead {
  background: #d7dce2;
  border: 1px solid #d7dce2;
}

.question-type-table .question-table tr td:not(:first-child) {
  text-align: center;
  border-left: 1px solid #d7dce2;
}

.slimScrollDiv {
  margin-bottom: 0;
  padding-right: 14px;
  margin-right: -10px;
}

.widget-history__content .slimScrollDiv,
.widget-leaderboard .slimScrollDiv {
  padding-right: 0;
  margin-right: 0;
}

/* @TODO
  > Melhor fazer isso aqui com transform =T esse lance de -9px ou -5px pode ser q fique diferente nos browsers
========================================================================== */

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

.tooltip .tooltiptext {
  visibility: hidden;
  white-space: nowrap;
  background-color: #0075ea;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 8px;
  line-height: normal;
  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  top: -6px;
  left: 110%;
  /* Fade in tooltip */
  transition: opacity 0.3s;
}

.tooltip .tooltiptext.below {
  word-break: break-word;
  z-index: 1;
  bottom: 48px;
  top: auto;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltiptext.below::after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  border-top-color: #0075ea;
  margin-left: -5px;
  margin-top: 0;
}

.tooltip .tooltiptext::after {
  height: 0;
  width: 0;
  content: "";
  position: absolute;
  pointer-events: none;
  top: 50%;
  right: 100%;
  margin-top: -9px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #0075ea transparent transparent;
}

/*
   ANSWERS
   ========================================================================== */

.answers-ielts {
  margin-bottom: 5px;
  line-height: 40px;
}

.answers-ielts input,
.answers-ielts select {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin: 5px 0;
  border: 1px solid #ccc;
}

.answers-ielts input {
  min-width: 150px;
  padding: 8px;
}

.answers-ielts select {
  min-width: 100px;
  padding: 5px;
  text-transform: none;
}

.answers-ielts label {
  margin-left: 5px;
}

/*
   Ielts Question Sentence Completion (For both Reading and Listening)
   ========================================================================== */

.ielts-question-sentence-completion .alternative-desc {
  line-height: 40px;
  margin-bottom: 14px;
  display: block;
}

.ielts-question-sentence-completion input {
  margin: 0 !important;
}

/* Ielts Question Matching (For both Reading and Listening)
   ==========================================================*/

.matching-name-item {
  font-weight: bold;
  margin-right: 15px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   DETAILS - ANSWER SHEET SCSS
   ========================================================================== */

.answer-sheet .question-number {
  margin: 15px 0;
}

.question-form .answer-label label:hover {
  border-color: rgba(0, 0, 0, 0);
}

.test-type {
  text-align: center;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  color: #91949e;
}

.answer-sheet__modal .correct-answer label,
.answer-sheet__modal .correct-answer label:hover {
  border-color: #11a06f;
}

.answer-sheet__modal .correct-answer.selected-answer label,
.answer-sheet__modal .correct-answer.selected-answer label:hover {
  background-color: #ddfbf1;
}

.answer-sheet__modal .wrong-answer label,
.answer-sheet__modal .wrong-answer label:hover {
  border-color: #ec3237;
}

.answer-sheet__modal .wrong-answer.selected-answer label,
.answer-sheet__modal .wrong-answer.selected-answer label:hover {
  background-color: #fce3e4;
}

.answer-view-more {
  cursor: pointer;
}

/* ==========================================================================
   ANSWER SHEET MODAL
   ========================================================================== */

.answer-sheet__modal .modal-body {
  padding: 0;
}

.answer-sheet__modal .audio-passage__play {
  margin-bottom: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

.analysis-detail__score,
.analysis-detail-information,
.analysis-details-feedback {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.analysis-detail__score,
.card-content.analysis-detail-information,
.card-content.analysis-details-feedback {
  padding: 0;
}

.analysis-detail__score + .card,
.analysis-detail-information + .card,
.analysis-details-feedback + .card {
  margin: 30px 0 0 30px;
}

.analysis-detail__score .fe,
.analysis-detail-information .fe,
.analysis-details-feedback .fe {
  margin-right: 10px;
}

.analysis-detail__score:hover,
.analysis-detail-information:hover,
.analysis-details-feedback:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis-details__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis-details__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS-DETAILS
   ========================================================================== */

.header-analysis-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.header-analysis-data li {
  display: inline-block;
}

.header-analysis-data li + li {
  margin-left: 15px;
}

.analysis-details__container {
  display: block;
}

.analysis-details__header {
  width: 100%;
  margin-bottom: 30px;
  flex-direction: row-reverse;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
}

.analysis-detail__score,
.analysis-detail-information {
  min-height: 180px;
}

.analysis-detail__score {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  min-width: 340px;
  margin-right: 0px;
  margin-left: 30px;
}

.analysis-detail__score .description {
  display: inline-block;
  vertical-align: top;
}

.view-score-icon {
  margin-right: 15px;
  display: inline-block;
}

.view-score-icon i {
  width: 96px;
  height: 96px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
}

.view-score-icon.msg-congratz i {
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAA/CAYAAABw8ZE3AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAG10lEQVRo3u2af4wcZRnHP887O7sL9dreQS+9O2htSAxUQ7X0D6ExemJFCcYrrVIslHC18g8paAP/IMo/RhBNQDTWCCY0aMRADbTYNlBqkIqKVQoSSahQer3Wdu/2yvV+7OzOvI9/7N7e7l23tzOz1zuiT/JmZ+d933k/7zvf93nfeWZgllju1cVbc68u3hqmjsw0NEBu/8UOcLL0tzW9sieY9fDevo4NQAvQBtxdOv0gcAzIpjp7t81e+F1t7wBLamQfTn3x+JKz1TeNBgqlXc+uwLM78SwT0k48e8VU1Rs68lG06z254HLg4ITTy1I3ZF6fqm6iEdBl7eZtG0UNA3zf29cxpXbFs9eXDntLvx3AGuDcwJOz9zFZu3cV6cwRYJuqCtAsIlkAVZ0LjBQebVmCOPvMoi902/eeGwF+Re15MA3wnl0BPA5cV3XeJPdg818rgbcAAxXgnoj4qvoNICUig6Vaq+pttmGar6Xd5FdPvjEGLiJWVZuAgojkVDU1ATyUNWbkqdSuHENEUNtGUbu90wEOjXSVnl2Cpy+aS27tJOd/HM++QJC+dLrAG2qqmlDV5or/F6iqKR03qWq6dJwqaX522P8CeFJV580070T4uRXHcyrAXVU9ryKvaaZZ/2+NspqLVO7A4nYgHfnKVo0zWOiIC2hOF15xuvryZ8qrvUgpP6a4yEQzBTNYiMsOxX3O4bDw78VqUgHVuOAKHK2VeTb4I/HhY6I7knO6+vwI8Bpv5CU+vIoMTNUEALk/L1oGbAY+BcwDTgOXxGnc7RmOR2/EqmAFRB0ZUMf82oz6W5yv9Ptl+Nwri24DHgHceK01GP4Mpq7JAJcmVmeyidyfLr4a1Z8xfhdOAf+m6CY/0ugOhTIjgTrioZoUXxMAUrAL1DUvA0sNyl0oghKg3I7Smr6qZ0X6qp6PofylPPEiJY2VVFiVWJ2Zk7i+zw3muTdrQnxUkXxwmf/0hcsMliuxgOWJ9Mqen6ZX9ow7Z8tbpbxoSSRGx0EK9u9jKMlr/vOEneN+p5xv5EaDaqrU0zcmC0zfijd6Me6aiOesy75fiWPPc3aU862eb1DeKZ348GR4/hVPNtGTipyciCOjwfKKMgeMKLtEQZQu7w8XJasKK/8s5UVK8UaetyfN31xwZ2ntsOLZ7QbVR1DNo3oRqrdVFk595ugRVLORZUMMeNhfyZLftfBKMxx8AgVNmJec9dnTJtXZexjLw6VJ9j1vb0e1fCyvRZ6wMeaLFOzuMQRvb0fSDPnPEFiAgMDeDGPRA+VelNdRmlCe9l7oOL9C9wdnQPOKrwfKcnm/sFtGgwUoqGu+nbgxe7QMn/pcr4fqGlSPo7oc1e3e8+1F/av+I/IIRrxjKnLK2TDgARS2tz5uBgudWFDX7Ejc0Hd/uVNlfa86dgjLNViypd/fenvaU1heigwRVfNGXgMoPNX6mBksbCiN+H7J2S9XOZSJM9rb3b4U+D2wGNgLrAb+RnGrEMqcjIcUbNhqaNJs1KT5khn2u1DQpHlW8rbL6R6o2qee8THQ29XWATwFfBJ4E/grcOs5gTfia9q8LSPBZQiqSecniZv6N5+paM1nWO+5Nhd4ALiTohCcsPAm4yF++JEv9lw8dc1a96b+nbWKTBkl9na2XQdspRj0PyfwmjRvAp3uLdnM2crVFeL2diycB/wA2FRvHQDTn0fyIeCN5DVp7nE39P+wnuKh4vPeMwu3AHVdGMBkQ8AbGVVHFrnd2b66rx8GHtWHUH0+7j598jZCUYf1YcBDw6e6TgQo61EO1eWv610PEuYht3vgd6EGMvTIA6nVJzJYPo/l3an3NlMndc02d+PAN8NyRIIHSK058S6qK1H9Y+RdJagmzYPupoFbojBEhgdIrT15HOWzKPej+CGX/yFNmmvdTQN3R2weaNDbQO/J1qXAvcBaKgJZ5lQe8Sq8jSM5TZhfihfckdg86IduaDrgy534zYIrgD3ABUX4QhleXbNfCrYzcUdjoq/Q4A8nUusyB1C+WxWnLD5MD0nefrqR4NDA97BlU315/LiY1HDI3TxY1wdAMwtvGRd5pb+fBms4vFTuuMeeRzXy5c4tfNULhWq//gGAt1TFfj5Y8ErrJHDLhdMB3/BvzFC9elKsMtB2/4GmObMaPv9YSytK96QQt1VDgodnLXz+0Zb5KM+iNI/rXMZvQl43Fn409/ZGwsfeHuR/0fwhYB1wHxOec2U4gJEJTt6Vgxj5lrtl8MUZgc//vPnrFOM57cBHqfHqR4YDGK2xQhl8jAwB/fh6uXvP0EhYjmjeRlkOXFtHudpuMiBBoPOB+UR87xURPoTjniYfD/BfhhQUmvkuZKQAAAAASUVORK5CYII=);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NyA2MyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcgNjM7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Qxe2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQoJLnN0MntmaWxsOnVybCgjc3RhcjNfMl8pO30KCS5zdDN7ZmlsbDp1cmwoI3N0YXIzXzNfKTt9Cjwvc3R5bGU+CjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMjMuNDYxNiIgeTE9IjMyLjE5NDkiIHgyPSIyMy40NjE2IiB5Mj0iNjEuOTE0MyI+Cgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+Cgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3RvcC1jb2xvcjojRUI5MTAwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNyw0NS41YzAsMCwwLjEsMCwwLjEtMC4xYzIuNi0xLjEsNS4xLTMuMyw2LjgtNi4xYzE1LjgtOS44LDkuMi0xNy41LDQtMTYuMWMwLjMtMi4zLDAuNS0zLjksMC41LTMuOUg4LjYKCWMwLDAsMC4yLDEuNiwwLjUsMy45Yy01LjMtMS40LTExLjksNi4zLDQsMTYuMWMxLjcsMi44LDQuMSw1LDYuOCw2LjFjMCwwLDAuMSwwLDAuMSwwLjFjMS40LDAuNywxLjUsMi4xLDEuNSwyLjF2My41CgljMCw1LjYtNS43LDUuNS01LjcsNS41aC0wLjhWNTlIMzJ2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNUMyNS41LDQ3LjYsMjUuNSw0Ni4yLDI3LDQ1LjV6IE0zNS4yLDM2LjYKCWMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6IE05LjQsMjUuNmMwLjMsMi40LDAuOCw1LjEsMS4zLDcuOWMwLjIsMS4xLDAuNSwyLjEsMSwzLjEKCUMyLjEsMjguOCw0LjksMjQuNyw5LjQsMjUuNnoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8yXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0My40OTYyIiB5MT0iMTguNjg4NSIgeDI9IjIwLjQyNjEiIHkyPSI0OC4yNjkzIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggY2xhc3M9InN0MSIgZD0iTTI3LDQ1LjVjMCwwLDAuMSwwLDAuMS0wLjFjMi42LTEuMSw1LjEtMy4zLDYuOC02LjFjMTUuOC05LjgsOS4yLTE3LjUsNC0xNi4xYzAuMy0yLjMsMC41LTMuOSwwLjUtMy45CglzLTcuNSwwLTE0LjksMGMtMC4zLDAtMC4yLDAtMC4yLDBMMjMuNiw1OWMwLDAtMC4yLDAsMC4xLDBjNC4yLDAsOC4yLDAsOC4yLDB2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNQoJQzI1LjUsNDcuNiwyNS41LDQ2LjIsMjcsNDUuNXogTTM1LjIsMzYuNmMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6Ii8+CjxsaW5lYXJHcmFkaWVudCBpZD0ic3RhcjNfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMzQuMjM2NSIgeTE9IjcuMTI4NCIgeDI9IjM0LjIzNjUiIHkyPSIxNC44MjUxIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzIiBjbGFzcz0ic3QyIiBkPSJNMzYuMywxMC44Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMWMtMC4xLDAtMC4yLDAtMC4zLTAuMQoJYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdDMzAuNSw2LDMwLjcsNS44LDMxLDUuOGMwLDAsMCwwLDAsMGwyLjEsMGwwLjYtMgoJYzAuMS0wLjIsMC4zLTAuNCwwLjYtMC40czAuNSwwLjIsMC42LDAuNGwwLjYsMmwyLjEsMGMwLDAsMCwwLDAsMGMwLjMsMCwwLjUsMC4yLDAuNiwwLjRjMC4xLDAuMiwwLDAuNS0wLjIsMC43bC0xLjcsMS4ybDAuNywyCgljMC4xLDAuMiwwLDAuNS0wLjIsMC43QzM2LjUsMTAuOCwzNi40LDEwLjgsMzYuMywxMC44TDM2LjMsMTAuOHoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJzdGFyM18zXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIyNC4xMTU1IiB5MT0iMTAuODE3NyIgeDI9IjI0LjExNTUiIHkyPSIxOC41MTQ0Ij4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzXzFfIiBjbGFzcz0ic3QzIiBkPSJNMjYuMSwxNC41Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMQoJYy0wLjEsMC0wLjIsMC0wLjMtMC4xYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdjMC4xLTAuMiwwLjMtMC40LDAuNi0wLjRjMCwwLDAsMCwwLDAKCWwyLjEsMGwwLjYtMmMwLjEtMC4yLDAuMy0wLjQsMC42LTAuNHMwLjUsMC4yLDAuNiwwLjRsMC42LDJsMi4xLDBjMCwwLDAsMCwwLDBjMC4zLDAsMC41LDAuMiwwLjYsMC40YzAuMSwwLjIsMCwwLjUtMC4yLDAuNwoJTDI2LDExLjhsMC43LDJjMC4xLDAuMiwwLDAuNS0wLjIsMC43QzI2LjQsMTQuNSwyNi4zLDE0LjUsMjYuMSwxNC41TDI2LjEsMTQuNXoiLz4KPC9zdmc+Cg==);
}

.view-score-icon.msg-medium i {
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABECAYAAACWJYUzAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAEw0lEQVRo3u2ZfYhUVRTAf29bd1YrSUuldLXRWt3XrqumZRlZgaVJCIYISdgHFmEI0sfrDyVkDVSiIDIsYyXBoD9aMgXzq3U2NzY0M6mVXNjNSqymVrB2ffe9d+/tj5nNN7PjzntvZ0aMDlyYe+595/fOuffOPfc+7GN1bfaxulGUWMqQ2kXqbfaRWqPU4L1IvRCpV5YavA+pQepNdqtpZnewW82Rdqs5oghgjiLpRjIUyQ67xaz4F9pijkPShuSlgoMr721XhtT7DakxpJ5mSL0eQDTXVBlSHzKkvtWQekHhPQbw1D48Rbq8IPZPfhpPHcJTk9K6erF/8pggBu3jUyfZx6cOCQjWe/E06VKGp9/H0xN9OgNPz8sLPVJbj6veqpx2wg0Eji04dQapv0tPskuVhwaEtpozcNRBHPVe8FCnvN7n8zBXmSc+uSXnWhfNNTMNRx8wHP2L4ehPBws+jKfX+epj8HR9P+ie6juw5QFsOQJbnsOWS8Se6uuCg6VuQeoL6bC2IPUCpF6H1Ad94Z7f313lINS7CHUaoe5DqEaEMvOBM0IndsR3AjFgcWxZV29aNxY4AYwEmmPLuh7ox/5oYjnQDowBFsaWdh4O7jFgSL3ckPrhPihAbFnXGUPqZ9Pr/G5n+83X9Ht7oZYaQo02hJofBBpKnMYJ25zGCdppnLAwQ791fJmzdfyXztbxM8PYKwvcU+pVSN3Zb1k5ajSOeq5ixU9HC+ppBmNL1V3OlqrPiwYYEL55XEn37f+OhA6b1dRdAwwD+P2c4OSPf/mbT7c1VP9RcLDV1L0BsPrqOcAXgFltDdXf57MVfDmlZE6e9qHAPUEMhQUXzGYxwIGk3F+xmrqHAbOB6y/R/4YANmfMXntqySXaOtsaqr8G3+SymrrrgV1AVdC3zjG5gshO4FF/qN8MAx2ELAIW+UNd53cG+LvAwJuAyvTv6X6wPyVdvXHxyA8LSZ299tQXXFxq5ZdtVv8PvnLAImEOFwnzycvh8SZgTUnBImHOAlYA35YMLBLmVcA7aRvHS+nxM8BMAOXp0ngsEuYo4LW+utvrhc6po3q8Cei7kPlt+CMdZ4oOFglzDrDcpzoW5c1DgUXCLAc2k5kkRjq6hPX4eSDjcK6VLq7HImHeCKzL1nu98pso4PIQfV8Hhmcr3V6voWvjqAvpaoxUsn8eWBO3kr8OCiwS5v3AY7na3B738RzqJLB6IJt5Qy0S5hBSEyqnuD0yl/rluJUcMAsMMsZPADU5WzS4vV62thX4IJ/RIKE+C2wndTzxS51ne1O00n6dB6yMW0mdz2hecGxu+25gd7ZeJMxGt8ebkqV+O24lA/1vD2aTmOH2ZIT5LPBq0IejbhKVwG1Z4BfjVvJ8UcHAVKDcN7Ga41YyVB4eFXy7FBLlaQAXCP09IyrYP75vxK3kyVKDfwbWRzEQZT+uAGrT47s6biUjHe6ieFwLVLg93mdxK/lxxIhFAk9XrhLSUauiQqOCf3B7vafiVrJjMOAw+zEAsbntBbmPvnIPbVHFf+vzJ6nvDgA9gJPv4ZC3PtdycWg3+Me4A7gz/fvqdCmWdPhD/QqpJK3Y8hXwYcbtrdXUPRZ4EBgdxELIUCugE9jV1lDt/AOIAT0xFGiY9AAAAABJRU5ErkJggg==);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.view-score-icon.msg-low i {
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABECAYAAACWJYUzAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAEw0lEQVRo3u2ZfYhUVRTAf29bd1YrSUuldLXRWt3XrqumZRlZgaVJCIYISdgHFmEI0sfrDyVkDVSiIDIsYyXBoD9aMgXzq3U2NzY0M6mVXNjNSqymVrB2ffe9d+/tj5nNN7PjzntvZ0aMDlyYe+595/fOuffOPfc+7GN1bfaxulGUWMqQ2kXqbfaRWqPU4L1IvRCpV5YavA+pQepNdqtpZnewW82Rdqs5oghgjiLpRjIUyQ67xaz4F9pijkPShuSlgoMr721XhtT7DakxpJ5mSL0eQDTXVBlSHzKkvtWQekHhPQbw1D48Rbq8IPZPfhpPHcJTk9K6erF/8pggBu3jUyfZx6cOCQjWe/E06VKGp9/H0xN9OgNPz8sLPVJbj6veqpx2wg0Eji04dQapv0tPskuVhwaEtpozcNRBHPVe8FCnvN7n8zBXmSc+uSXnWhfNNTMNRx8wHP2L4ehPBws+jKfX+epj8HR9P+ie6juw5QFsOQJbnsOWS8Se6uuCg6VuQeoL6bC2IPUCpF6H1Ad94Z7f313lINS7CHUaoe5DqEaEMvOBM0IndsR3AjFgcWxZV29aNxY4AYwEmmPLuh7ox/5oYjnQDowBFsaWdh4O7jFgSL3ckPrhPihAbFnXGUPqZ9Pr/G5n+83X9Ht7oZYaQo02hJofBBpKnMYJ25zGCdppnLAwQ791fJmzdfyXztbxM8PYKwvcU+pVSN3Zb1k5ajSOeq5ixU9HC+ppBmNL1V3OlqrPiwYYEL55XEn37f+OhA6b1dRdAwwD+P2c4OSPf/mbT7c1VP9RcLDV1L0BsPrqOcAXgFltDdXf57MVfDmlZE6e9qHAPUEMhQUXzGYxwIGk3F+xmrqHAbOB6y/R/4YANmfMXntqySXaOtsaqr8G3+SymrrrgV1AVdC3zjG5gshO4FF/qN8MAx2ELAIW+UNd53cG+LvAwJuAyvTv6X6wPyVdvXHxyA8LSZ299tQXXFxq5ZdtVv8PvnLAImEOFwnzycvh8SZgTUnBImHOAlYA35YMLBLmVcA7aRvHS+nxM8BMAOXp0ngsEuYo4LW+utvrhc6po3q8Cei7kPlt+CMdZ4oOFglzDrDcpzoW5c1DgUXCLAc2k5kkRjq6hPX4eSDjcK6VLq7HImHeCKzL1nu98pso4PIQfV8Hhmcr3V6voWvjqAvpaoxUsn8eWBO3kr8OCiwS5v3AY7na3B738RzqJLB6IJt5Qy0S5hBSEyqnuD0yl/rluJUcMAsMMsZPADU5WzS4vV62thX4IJ/RIKE+C2wndTzxS51ne1O00n6dB6yMW0mdz2hecGxu+25gd7ZeJMxGt8ebkqV+O24lA/1vD2aTmOH2ZIT5LPBq0IejbhKVwG1Z4BfjVvJ8UcHAVKDcN7Ga41YyVB4eFXy7FBLlaQAXCP09IyrYP75vxK3kyVKDfwbWRzEQZT+uAGrT47s6biUjHe6ieFwLVLg93mdxK/lxxIhFAk9XrhLSUauiQqOCf3B7vafiVrJjMOAw+zEAsbntBbmPvnIPbVHFf+vzJ6nvDgA9gJPv4ZC3PtdycWg3+Me4A7gz/fvqdCmWdPhD/QqpJK3Y8hXwYcbtrdXUPRZ4EBgdxELIUCugE9jV1lDt/AOIAT0xFGiY9AAAAABJRU5ErkJggg==);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.analysis-detail-description {
  width: 100%;
  padding-top: 5px;
}

.analysis-detail-description > span {
  display: block;
}

.analysis-detail-description > span + span {
  margin-top: 4px;
}

.analysis-detail-description .date {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 15px;
  font-weight: bold;
}

.analysis-profile__name {
  font-size: 20px;
  font-size: 2rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.analysis-profile__email {
  margin-bottom: 5px;
}

.id-time-date-info {
  width: 100px;
  line-height: 22px;
  font-size: 11px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: right;
  color: #5d6670;
  margin-right: 16px;
}

.id-time-date-info .id-info {
  color: #003871;
  font-size: 18px;
  font-weight: bold;
}

.id-time-date-info span {
  display: inline-block;
}

.report-header-right .answer-sheet {
  display: inline-block;
  border-radius: 43px;
  background-color: #003871;
  text-align: center;
  line-height: 42px;
  padding: 0px 18px;
  margin-right: 12px;
}

.report-header-right .answer-sheet a {
  color: #fff !important;
}

.analysis-detail-data {
  border-top: 1px solid #dde4ea;
  text-align: center;
}

.analysis-detail-data__item {
  width: 100%;
}

.analysis-detail-data__icon {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  color: #0075ea;
}

.analysis-detail-data__title {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 10px;
  color: #5d6670;
  display: block;
}

.view-score-text {
  font-size: 14px;
  font-size: 1.4rem;
  width: 180px;
  display: inline-block;
}

.view-score-text span {
  text-transform: capitalize;
}

.view-score-text strong {
  font-size: 18px;
}

.analysis-details-feedback {
  width: 100%;
  margin: 0 0 30px;
  position: relative;
}

.analysis-details-feedback .card__header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.analysis-details-feedback select {
  margin-top: 15px;
  float: right;
}

.select-filter {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  min-width: 170px;
  height: 30px;
  padding: 5px 20px 5px 10px;
  border: 1px solid #e2e8ee;
  background-color: #fff;
  outline: none;
}

.view-feedback-content {
  display: flex;
}

.view-feedback-content h4:first-child {
  margin-top: 0;
}

.view-feedback-content h4 {
  margin-bottom: 10px;
}

.view-feedback-score {
  width: 200px;
  padding: 10px !important;
  float: left;
  background-color: #cdd7e1;
  text-align: center;
}

.view-feedback-score .score {
  font-size: 24px;
  display: block;
  font-weight: bold;
}

.view-feedback-score .score small {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
  text-align: left;
}

.view-feedback-score .ielts-score {
  font-size: 62px;
  font-size: 6.2rem;
  display: block;
  font-weight: bold;
}

.view-feedback-score .ielts-score small {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
  text-align: left;
}

.view-feedback-score .ielts-score-good,
.view-feedback-score .score-good {
  color: #30b770;
}

.view-feedback-score .ielts-score-limited,
.view-feedback-score .ielts-score-weak,
.view-feedback-score .score-limited,
.view-feedback-score .score-weak {
  color: #ec3237;
}

.view-feedback-score .ielts-score-fair,
.view-feedback-score .score-fair {
  color: #003871;
}

.view-feedback-score .text {
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 5px;
}

.view-feedback-score .category-band-header {
  padding-bottom: 5px;
}

.view-feedback-score--ielts {
  padding: 10px !important;
}

.view-feedback-score--ielts .view-feedback-score__item {
  padding: 15px 30px;
}

.view-feedback-score__item {
  padding: 35px 23px;
  border-radius: 6px;
  background-color: #ffffff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

.view-feedback-score__item + .view-feedback-score__item {
  margin-top: 15px !important;
}

.view-feedback-score__item--only {
  padding: 40px !important;
}

.view-feedback-score__item--featured {
  padding: 40px 50px !important;
  margin-bottom: 20px;
  background-color: #0075ea;
  color: #fff;
}

.view-feedback-score__item--featured .score {
  color: inherit;
}

.view-feedback-score__item--featured .score small {
  color: inherit;
}

.view-feedback-text {
  width: calc(100% - 300px);
  border-left: 1px solid #e2e8ee;
  float: left;
  min-height: 750px;
}

.analysis-feedback-graphs {
  width: 100%;
  margin-top: 30px;
  display: block;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

.widget-scheduled-interview {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.widget-scheduled-interview {
  padding: 0;
}

.widget-scheduled-interview + .card {
  margin: 30px 0 0 30px;
}

.widget-scheduled-interview .fe {
  margin-right: 10px;
}

.widget-scheduled-interview:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   PERFORMANCE-CHART
   ========================================================================== */

.widget-scheduled-interview {
  width: 100%;
  margin-bottom: 30px;
}

.widget-scheduled-interview .btn--schedule {
  text-transform: capitalize;
}

.widget-scheduled-interview__content,
.widget-scheduled-interview .dashboard-interview__zero-data {
  padding: 30px;
}

.widget-scheduled-interview__title {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 18px;
}

.widget-scheduled-interview__info-list {
  margin-bottom: 30px;
}

.widget-scheduled-interview__info-list li {
  margin-bottom: 10px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.results-chart,
.breakdown-chart,
.widget-breakdown {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.results-chart,
.card-content.breakdown-chart,
.card-content.widget-breakdown {
  padding: 0;
}

.results-chart + .card,
.breakdown-chart + .card,
.widget-breakdown + .card {
  margin: 30px 0 0 30px;
}

.results-chart .fe,
.breakdown-chart .fe,
.widget-breakdown .fe {
  margin-right: 10px;
}

.results-chart:hover,
.breakdown-chart:hover,
.widget-breakdown:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis__container,
.analysis-container__page {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS
   ========================================================================== */

.nav-analysis {
  float: right;
}

.nav-analysis > li {
  float: left;
}

.nav-analysis > li + li {
  margin-left: 10px;
}

.nav-analysis > li i {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 5px;
}

.nav-analysis > li > a {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  padding: 0 15px;
  height: 40px;
  color: #5d6670;
  line-height: 38px;
  border: 1px solid #e2e8ee;
  display: block;
}

.nav-analysis > li > .disabled:hover {
  background-color: #fff;
  color: #5d6670;
  border-color: #e2e8ee;
}

.nav-analysis > li > .disabled i,
.nav-analysis > li > .disabled .text {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.nav-analysis > li > .disabled .tooltip-content {
  min-width: 150px;
  top: 35px;
  line-height: normal;
}

.nav-analysis > li a:hover,
.nav-analysis > li.active > a {
  background-color: #0075ea;
  color: #fff;
  border-color: transparent;
}

.btn-filter {
  width: 40px;
  text-align: center;
}

.btn-filter a {
  padding: 0 10px !important;
}

.btn-filter:hover a {
  border-color: #e2e8ee !important;
  background-color: transparent !important;
}

.btn-filter:hover i {
  color: #0075ea;
}

.btn-filter .menu-dropdown {
  height: 250px !important;
}

.btn-filter .menu-dropdown > span {
  padding: 15px 0;
  border-bottom: 1px solid #e2e8ee;
  display: block;
  font-weight: bold;
  line-height: normal;
}

.btn-filter .menu-dropdown li {
  line-height: 42px;
  text-align: center;
}

.btn-filter .menu-dropdown li a {
  padding: 10px !important;
  display: block;
}

.btn-filter .menu-dropdown li a.active,
.btn-filter .menu-dropdown li a:hover {
  color: #0075ea;
}

/*
   ANALYSIS
   ========================================================================== */

.analysis-container__page {
  padding: 0;
}

/*
   PERFORMANCE
   ========================================================================== */

#analysis-breakdown {
  margin-bottom: 30px;
  min-height: 150px;
}

.results-chart,
.breakdown-chart {
  height: 380px;
  position: relative;
  text-align: center;
  float: left;
}

.results-chart .title,
.breakdown-chart .title {
  font-size: 16px;
  font-size: 1.6rem;
  margin: 0 auto 40px;
  font-weight: bold;
  text-transform: uppercase;
}

.results-chart .title small,
.breakdown-chart .title small {
  font-size: 12px;
  font-size: 1.2rem;
  display: block;
  font-weight: normal;
}

.results-chart > span,
.breakdown-chart > span {
  display: block;
}

.breakdown-chart {
  width: calc(60% - 15px);
  padding: 30px;
  padding-bottom: 60px;
}

.breakdown-chart .chart-container {
  margin: 20px;
}

.breakdown-chart--large {
  width: 100%;
  height: auto;
}

.results-chart--practice {
  margin-top: 30px;
}

.doughnut-legend li {
  padding-left: 15px;
}

.doughnut-legend li > span {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 10px;
  height: 10px;
  margin-top: 5px;
}

.widget-breakdown {
  width: 100%;
}

.widget-breakdown .box-header {
  text-transform: uppercase;
}

.widget-breakdown__content {
  padding: 1.2rem;
}

.widget-breakdown__values h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 10px;
  color: #2a6dcd;
}

.widget-breakdown__values li {
  width: calc(50% - 3px);
  min-height: 100px;
  display: inline-block;
  vertical-align: top;
  padding: 1.6rem 2rem;
  background: #f5f5f5;
}

.widget-breakdown__values label,
.widget-breakdown__values .legend {
  display: block;
}

.widget-breakdown__values .widget-value {
  font-size: 24px;
  font-size: 2.4rem;
}

.widget-breakdown__values .widget-value.widget-value--pendig {
  font-size: 90%;
  font-weight: bold;
}

.widget-breakdown__values .legend {
  font-size: 12px;
  font-size: 1.2rem;
  opacity: 0.5;
  filter: alpha(opacity=50);
  text-transform: uppercase;
}

.widget-breakdown--simulation .widget-breakdown__values li,
.widget-breakdown--full_test .widget-breakdown__values li {
  width: calc(33.3% - 4px);
}

.widget-breakdown--practice {
  margin-bottom: 30px;
}

.widget-breakdown--practice .widget-breakdown__values li {
  width: calc(50% - 2px);
}

.widget-breakdown--full_ielts .card__header {
  display: block !important;
}

.widget-breakdown--cefr .card__header {
  display: block !important;
}

.widget-breakdown--simulation .card__header {
  display: block !important;
}

/*
   BOX RESULTS FULL
   ========================================================================== */

.results-chart-full {
  width: 100%;
  margin-left: 0 !important;
  position: relative;
}

.results-chart-full .results-chart {
  width: 30%;
  margin-left: 0 !important;
  float: left;
}

.results-details {
  width: 70%;
  height: 100%;
  background-color: rgba(226, 232, 238, 0.3);
  position: absolute;
  right: 0;
}

.results-details li {
  width: 25%;
  min-height: 340px;
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  float: left;
  position: relative;
  text-align: center;
}

.results-details li:nth-child(4n+1) {
  background: rgba(255, 255, 255, 0);
}

.results-details li:nth-child(4n+2) {
  background: rgba(255, 255, 255, 0.25);
}

.results-details li:nth-child(4n+3) {
  background: rgba(255, 255, 255, 0.5);
}

.results-details li:nth-child(4n+4) {
  background: white;
}

.results-details li > div {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  position: absolute;
  display: inline-block;
  text-align: center;
  top: 50%;
  left: 50%;
}

.results-details li i {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 32px;
  height: 32px;
  margin: 0 auto 10px;
  background-color: #0075ea;
  color: #fff;
  display: inline-block;
  line-height: 32px;
}

.results-details li span {
  margin-bottom: 10px;
  display: block;
}

.results-details li .fe-check {
  background-color: #1bd171;
}

.results-details li .fe-close {
  background-color: #f27474;
}

.results-details li .fe-jump {
  background-color: #f9c631;
}

.results-details li .fe-help {
  background-color: #5d6670;
}

.results-details li .fe-help.independent {
  background-color: #01b5ff;
}

.results-details li .fe-help.integrated {
  background-color: #0075ea;
}

.results-details li .fe-help.part-one {
  background-color: #2ccf75;
}

.results-details li .fe-help.part-two {
  background-color: #2b7dce;
}

.results-details li .fe-help.part-three {
  background-color: #1fb6fc;
}

.results-details .value {
  font-size: 26px;
  font-size: 2.6rem;
  color: #5d6670;
  font-weight: bold;
  line-height: 100%;
}

.results-details .type {
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: uppercase;
}

.results-details .type b {
  display: block;
}

/*
   BREAKDOWN WRITING
   ========================================================================== */

.breakdown-writing {
  padding: 15px;
  background-color: #f7f8f8;
}

.breakdown-writing .title {
  margin: 10px 0;
}

.breakdown-writing .box-header {
  font-weight: bold;
}

.breakdown-writing .breakdown-content {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  width: 100%;
  background-color: #fff;
  padding: 15px 10px;
  margin-top: 10px;
  border: 1px solid #e2e8ee;
  border-bottom: 2px solid rgba(0, 117, 234, 0.4);
  display: inline-block;
  text-align: center;
  position: relative;
}

.breakdown-writing .breakdown-content + div {
  margin-top: 15px;
  border-bottom-color: rgba(0, 117, 234, 0.4);
}

.breakdown-writing .breakdown-content .type-title {
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.breakdown-writing .breakdown-content .item > span {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 10px 0;
  min-height: 65px;
  line-height: normal;
}

.breakdown-writing span {
  display: block;
}

.breakdown-writing .response,
.breakdown-writing .score {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.breakdown-writing .time,
.breakdown-writing .points {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

.breakdown-writing .points small {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal;
}

.breakdown-writing .time i {
  font-size: 14px;
  font-size: 1.4rem;
}

.breakdown-writing .max {
  font-size: 10px;
  font-size: 1rem;
  color: #aebecd;
  bottom: 5px;
  position: absolute;
  right: 7px;
  text-transform: uppercase;
}

/*
   MEDIA
   ========================================================================== */

@media (max-width: 1150px) {
  .breakdown-writing .type-title {
    margin-bottom: 0;
  }

  .breakdown-writing .breakdown-content {
    padding: 15px 5px;
  }

  .breakdown-writing .breakdown-content .item {
    padding: 0;
  }

  .breakdown-writing .score,
  .breakdown-writing .response {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .breakdown-writing .points,
  .breakdown-writing .time {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.container-main--small > .breakdown-chart {
  margin-bottom: 0;
}

.container-main--small .breakdown-chart {
  padding-bottom: 0;
  height: auto;
}

.container-main--small .breakdown-chart,
.container-main--small .results-chart {
  width: 100%;
  margin-bottom: 30px;
  float: none;
}

.container-main--small .results-chart {
  margin-left: 0;
}

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.info-analysis {
  display: none;
}

.total-simulation i {
  font-size: 14px;
  font-size: 1.4rem;
  color: #fff;
}

.analysis--practice .info-analysis-practice {
  display: block;
}

.analysis--simulation .info-analysis-item + .info-analysis-item {
  margin-top: 0;
}

.analysis--simulation .box-history .box-header {
  position: relative;
}

.analysis--simulation .history-timeline li:hover {
  background-color: rgba(226, 232, 238, 0.2);
}

.analysis--simulation .score-name {
  bottom: 0;
}

/*
   HISTORY FILTER
   ========================================================================== */

#history-filter {
  position: absolute;
  right: 15px;
  top: 15px;
}

/* Radar Chart
-------------------------------------------------------------------------- */

.radar-legend-simulation {
  width: 100%;
  margin: 0 auto;
  bottom: 12px;
  position: absolute;
  left: 0;
}

.radar-legend-simulation li {
  font-size: 11px;
  font-size: 1.1rem;
  padding-left: 10px !important;
  display: inline-block;
  vertical-align: top;
  text-transform: uppercase;
}

.radar-legend-simulation li + li {
  margin-left: 10px;
}

.radar-legend-simulation.radar-legend li::before {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  content: '';
  display: inline-block;
  vertical-align: top;
}

.radar-legend-simulation .color-projected::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-right::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-wrong::before {
  background-color: #ec3237;
}

.analysis-simulation .total-time {
  display: none;
}

.analysis-practice-detail #totalizers-msg small {
  display: block;
}

.analysis-practice-detail .total-simulation {
  display: none;
}

.analysis-simulation-cefr .total-questions {
  display: none;
}

.button-cefr {
  text-transform: uppercase;
}

.button-cefr:hover {
  background: #ffa500 !important;
}

.active .button-cefr {
  background-color: #ffa500 !important;
}

.speaking-breakdown-score {
  border: 1px solid #f5f0f0;
  padding: 15px;
  border-radius: 10px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  width: 22%;
  text-align: center;
  min-height: 100px;
}

.speaking-breakdown__content {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 25px;
}

.speaking-breakdown-score .subcategory {
  color: #647a96;
  font-size: 14px;
}

.speaking-breakdown-score .cat-score {
  font-size: 24px;
  font-weight: 800;
  margin-top: 6px;
}

.speaking-breakdown-score-good {
  color: #30b770;
}

.speaking-breakdown-score-limited,
.speaking-breakdown-score-weak {
  color: #ec3237;
}

.speaking-breakdown-score-fair {
  color: #003871;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== */

.box-session-info .results-details .ielts-speaking-session-list {
  display: flex;
}

.box-session-info .results-details li.ielts-speaking-session {
  width: 20%;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== */

.session-invalid .title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 0 auto 20px;
  display: block;
}

.session-invalid i {
  font-size: 64px;
  font-size: 6.4rem;
  margin-bottom: 20px;
  color: #ec3237;
}

.session-invalid a {
  color: #5d6670;
  font-weight: bold;
}

.session-invalid a:hover {
  text-decoration: underline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.practice__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.practice__content {
  padding: 0;
}

.practice__content + .card {
  margin: 30px 0 0 30px;
}

.practice__content .fe {
  margin-right: 10px;
}

.practice__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.header-internal__content,
.practice__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.practice__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   PRACTICE
   ========================================================================== */

.header-internal__content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.practice__container {
  display: block;
}

.practice__content {
  width: 100%;
  position: relative;
}

.writing-question-counter h3 {
  margin-bottom: 0;
  margin-top: 18px;
  font-weight: bold;
}

writing-question-task2 .explanation {
  bottom: 0;
  height: 350px;
  top: auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
  font-weight: bold;
  font-size: 20px;
}

.simulation-directions__text {
  font-size: 16px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize ng-counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.btn-clock.hide-all {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

simulation-progress {
  width: calc(100% - 680px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: 300px;
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 300px;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.ielts-summary-screen-reading .simulation-summary-table--header {
  margin-top: 0;
  box-shadow: none;
}

.ielts-summary-screen-reading .simulation-summary__thead-wrapper {
  padding-right: 16px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.simulation__content {
  padding: 0;
}

.simulation__content + .card {
  margin: 30px 0 0 30px;
}

.simulation__content .fe {
  margin-right: 10px;
}

.simulation__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.simulation__content {
  width: 100%;
  min-height: 500px;
  margin: 0 auto;
  position: relative;
}

.simulation__content reading-actions {
  display: none;
}

.simulation__content .question-full {
  padding: 40px;
}

.simulation__content.\--has-antifraud .simulation-listening-question--list-all {
  padding-top: 80px;
}

.simulation__content--question {
  width: 100%;
}

.simulation__content--audio,
.simulation__content--listen,
.simulation__content--passage {
  width: auto;
  min-height: 450px;
  overflow: hidden;
}

.simulation__content--direction_subclip,
.simulation__content--get_ready_screen,
.simulation__content--getready {
  text-align: center;
}

.simulation-steps {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 4px 8px;
  background: #003871;
  color: #fff;
  display: block;
  left: 4px;
  top: 4px;
  position: absolute;
}

.header-internal--simulation h1 {
  margin-left: 20px;
}

.header-internal--simulation h1 span {
  font-weight: normal;
}

.header-internal--simulation .content {
  max-width: 100%;
  padding: 0;
  text-align: center;
}

.header-internal--simulation .progress-content {
  width: calc(100% - 580px);
  max-width: 600px;
  display: inline-block;
}

.header-internal--simulation .progress-questions {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 30px;
  font-weight: bold;
}

.header-internal--simulation .menu-dropdown {
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
  transform: translate(0, 0);
  left: auto;
  right: 5px;
}

.header-internal--simulation .btn-clock .tooltip-content {
  min-width: 100px;
  text-transform: uppercase;
}

.header-internal--simulation .btn-continue-content .tooltip-content {
  min-width: 190px;
  top: 60px;
}

.header-internal--simulation .btn-speaking-continue-content .tooltip-content {
  top: 40px !important;
}

.simulation__settings.menu-dropdown-wrapper {
  height: 60px;
  padding: 0 25px;
  margin-left: 25px;
  border-left: 1px solid rgba(93, 102, 112, 0.1);
  cursor: pointer;
  float: right;
  line-height: 60px;
}

.simulation__settings.menu-dropdown-wrapper .fe-settings {
  font-size: 24px;
  font-size: 2.4rem;
}

.simulation__settings.menu-dropdown-wrapper:hover .menu-dropdown-default {
  right: 5px;
}

.simulation__settings.menu-dropdown-wrapper:hover .menu-dropdown-default::after {
  left: auto;
  right: 25px;
}

.play-range {
  position: relative;
}

.play-range__total {
  width: 100%;
}

.play-range__buffering,
.play-range__progress,
.play-range__total {
  display: block;
  position: absolute;
  left: 0;
  top: 22px;
  height: 8px;
  background: rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}

.simulation-listening-question .question-listening,
.simulation-listening-question-cefr .question-listening {
  text-align: center;
}

.simulation-listening-question .question-listening .question-content--right,
.simulation-listening-question-cefr .question-listening .question-content--right {
  width: 100% !important;
  max-width: 800px;
  text-align: left;
  border: 0;
}

.simulation-listening-question .question-listening .question-content--right .question-scroll,
.simulation-listening-question-cefr .question-listening .question-content--right .question-scroll {
  padding: 0;
}

.direction-highlight {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  margin-bottom: 20px;
  padding: 10px;
  background-color: #e2e8ee;
  text-align: center;
}

.play-button--only-read {
  cursor: default;
}

.simulation-listening-question--list-all {
  padding: 35px;
  padding-left: 45px;
  width: 60%;
  float: left;
}

.simulation-listening__question-item {
  padding-right: 30px;
  margin-bottom: 50px;
}

@media screen and (max-width: 1060px) {
  .header-internal.header-internal--simulation h1 {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: normal;
  }

  .header-internal.header-internal--simulation h4 {
    font-size: 13px;
    font-size: 1.3rem;
    margin-left: 10px;
  }
}

.simulation-session.speed-up-frame {
  display: flex;
  flex-direction: row;
  padding: 0;
  height: 100%;
  flex: 1;
  font-size: 16px;
}

.lrw-session-text {
  padding: 0px 40px;
}

.session-content__left {
  background-color: #003871;
  flex: 2;
  color: #fff;
}

.session-content__right {
  flex: 3;
  padding-top: 100px;
}

.speed-up__header {
  font-weight: bold;
  margin-top: 80px;
}

.timer-size {
  font-size: 80px;
  margin-top: 35px;
  position: relative;
}

.speed-up__arrow {
  position: absolute;
  top: 0px;
  right: 0px;
  border-radius: 50%;
  background-color: #1bd171;
  width: 24px;
  height: 24px;
  font-size: 20px;
}

.icon-position {
  font-size: 15px;
}

.timer-text {
  font-weight: bold;
}

.speed-up__text {
  font-size: 14px;
  padding: 20px 40px;
}

.speed-up-button {
  width: 126px;
  height: 42px;
  border-radius: 43px;
  background-color: #1bd171;
  color: #fff;
  cursor: pointer;
  margin-top: 20px;
}

.session-end__footer {
  position: absolute;
  bottom: 80px;
  width: 60%;
}

.session-end__footer a {
  margin: 0px 15px;
}.atc-btn-group {
  background-color: #fff;
  color: #000;
  border: 1px solid #c0c0c0;
  border-radius: 50px;
  height: 2.25em;
  line-height: 2.25em;
  font-size: 14px;
  display: inline-block;
  position: relative;
  font-family: Helvetica, Arial, sans-serif;
  box-sizing: border-box;
  padding: 0;
  cursor: pointer;
}

.atc-btn-group:hover {
  background-color: #e8e8e8;
}

.atc-btn-group.active {
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  background-color: #e8e8e8;
}

.atc-btn-group .atc-dropdown {
  position: absolute;
  list-style: none;
  left: 0;
  margin: 0;
  padding: 0;
  top: 2.25em;
  border-radius: 3px;
  background-color: #fff;
  border: 1px solid #c0c0c0;
  box-sizing: border-box;
  width: 12em;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.16), 0 3px 5px rgba(0, 0, 0, 0.23);
}

.atc-btn-group .atc-dropdown > li {
  box-sizing: border-box;
  border-radius: 3px;
  padding: 0 18px;
}

.atc-btn-group .atc-dropdown > li > a {
  color: #000;
  text-decoration: none;
}

.atc-btn-group .atc-dropdown > li:hover {
  background-color: #e8e8e8;
}

.atc-btn-group > span {
  vertical-align: middle;
  padding: 0 18px;
  display: inline-block;
  -webkit-appearance: none;
}

.atc-btn-group .caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid\9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}/* ==========================================================================
   CARD
   ========================================================================== */

.schedule-form,
.schedule__container--table {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.schedule-form,
.card-content.schedule__container--table {
  padding: 0;
}

.schedule-form + .card,
.schedule__container--table + .card {
  margin: 30px 0 0 30px;
}

.schedule-form .fe,
.schedule__container--table .fe {
  margin-right: 10px;
}

.schedule-form:hover,
.schedule__container--table:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.schedule__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.schedule__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.header-internal .header-internal__content--schedule > h1 {
  font-size: 16px;
  font-size: 1.6rem;
}

.header-internal .schedule__category {
  font-weight: normal;
}

.schedule__available-amount {
  margin-left: 28px;
  padding-left: 28px;
  border-left: 1px solid #dde4ea;
  align-self: center;
}

.schedule__available-amount b {
  color: #30b770;
}

.schedule__available-amount .zero-amount {
  color: #ec3237;
}

.schedule__container--initial {
  display: block;
}

.schedule-form {
  width: 100%;
}

.schedule-interviews {
  display: grid;
  grid-column-gap: 30px;
  grid-template-columns: 1fr 1.2fr;
}

.schedule-form__content {
  padding: 30px;
}

.schedule-form {
  margin-bottom: 30px;
}

.schedule-form__content {
  display: grid;
  grid-gap: 30px;
  justify-content: space-between;
  grid-column-gap: 30px;
  grid-template-columns: 1fr 1fr;
}

.schedule__list-of-itens {
  display: grid;
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  margin-bottom: 30px;
  grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
}

.schedule-form__legend {
  text-align: center;
}

.schedule-form__legend li {
  display: inline-block;
  margin-right: 20px;
}

.schedule-form__legend i {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 12px;
  height: 12px;
  margin-right: 15px;
  display: inline-block;
  border: 1px solid #dde4ea;
}

.schedule-form__legend .schedule-legend__available {
  border-color: #dde4ea;
  background: #dde4ea;
}

.schedule-form__legend .schedule-legend__selected {
  border-color: #0075ea;
  background: #0075ea;
}

.schedule-timezone {
  margin-bottom: 20px;
  max-width: 300px;
}

.btn--confirm-schedule {
  margin-top: 40px;
  float: right;
}

.schedule-interviews__table .fe-icon {
  font-size: 18px;
  font-size: 1.8rem;
}

.schedule-interviews__table small {
  display: block;
}

.schedule-interviews__table td {
  vertical-align: middle;
}

.schedule-interviews .fe-check {
  color: #30b770;
}

.schedule-interviews .fe-close {
  color: #5d6670;
}

.schedule-interviews .fe-live {
  color: #30b770;
}

.schedule-interviews .fe-calendar {
  color: #e2e8ee;
}

.schedule-interviews__content {
  position: relative;
}

.schedule-interviews__content .loader {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.schedule-interviews__content .loader.active {
  opacity: 0.8;
  filter: alpha(opacity=80);
}

.schedule-interviews dir-pagination-controls {
  display: grid;
  padding: 30px 0;
}

.schedule-form__content--zero-data {
  min-height: 280px;
  align-items: center;
}

.schedule-form__content--zero-data figure {
  text-align: center;
}

.schedule-form__content--zero-data .gama {
  max-width: 300px;
  font-weight: normal;
  margin: 0 auto;
  margin-bottom: 20px;
}

.schedule-form__content--zero-data b {
  font-weight: bold;
}

.schedule-form__zero-data-text {
  text-align: center;
}

schedule-result {
  text-align: center;
  display: block;
  margin-top: 60px;
}

.schedule__container--table .slimScrollDiv {
  padding-right: 0;
  margin-right: 0;
}

.schedule-interviews__zero-data {
  display: flex;
  min-height: 400px;
  justify-content: center;
  align-items: center;
}

.schedule-interviews__zero-data figure {
  align-items: center;
}

.datepicker-days__header .next:hover,
.datepicker-days__header .prev:hover {
  background-color: #0075ea;
}

.datepicker-days__header .datepicker-switch:hover {
  background-color: #0075ea;
}

.datepicker table tr td.available:hover {
  background: #0075ea;
}

.datepicker table tr td.active:focus,
.datepicker table tr td.active.highlighted:focus,
.datepicker table tr td.active.focus,
.datepicker table tr td.active.highlighted.focus,
.datepicker table tr td.active:hover,
.datepicker table tr td.active.highlighted:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active.highlighted:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active.highlighted.active,
.datepicker table tr td.active:active:hover,
.datepicker table tr td.active.highlighted:active:hover,
.datepicker table tr td.active.active:hover,
.datepicker table tr td.active.highlighted.active:hover,
.datepicker table tr td.active:active:focus,
.datepicker table tr td.active.highlighted:active:focus,
.datepicker table tr td.active.active:focus,
.datepicker table tr td.active.highlighted.active:focus,
.datepicker table tr td.active:active.focus,
.datepicker table tr td.active.highlighted:active.focus,
.datepicker table tr td.active.active.focus,
.datepicker table tr td.active.highlighted.active.focus {
  background-color: #0075ea;
}

.datepicker table tr td span.active.disabled:hover.active.focus {
  background-color: #0075ea;
}

.schedule-form__warning-text {
  color: #ec3237;
}

.schedule-form__available-hours h2 {
  margin-bottom: 10px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.schedule-result {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.schedule-result {
  padding: 0;
}

.schedule-result + .card {
  margin: 30px 0 0 30px;
}

.schedule-result .fe {
  margin-right: 10px;
}

.schedule-result:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.schedule-result {
  padding: 50px;
  max-width: 500px;
  margin: 0 auto 70px;
  text-align: center;
}

.schedule-result .btn-return {
  margin-top: 20px;
  margin-right: 20px;
}

.schedule-result__icon-success,
.schedule-result__icon-error {
  margin-top: 25px;
  margin-bottom: 25px;
  position: relative;
  display: inline-block;
}

.schedule-result__icon-success .fe-email {
  font-size: 96px;
  font-size: 9.6rem;
  color: #dde4ea;
}

.schedule-result__icon-error {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  background: #ec3237;
  color: #fff;
  padding: 15px;
  font-size: 3.4rem;
}

.schedule-result__icon-badge {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 30px;
  height: 30px;
  background-color: #30b770;
  color: #fff;
  display: block;
  line-height: 26px;
  position: absolute;
  right: -5px;
  text-align: center;
  top: 5px;
}

.schedule-result__actions > li {
  display: inline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.interview-status {
  text-align: center;
}

.dashboard-interview__zero-data {
  padding: 0 20px;
  text-align: center;
}

.dashboard-interview__zero-data img {
  width: 80%;
  max-width: 156px;
  margin: 25px auto;
}

.dashboard-interview__zero-data .btn--schedule {
  text-transform: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

.dashboard-analysis--toeic .dashboard-analysis-item__name small {
  display: block;
  font-weight: normal;
}

.dashboard-analysis--toeic.dashboard-analysis--practice .dashboard-analysis-item {
  width: 50%;
}

.dashboard-analysis--toeic.dashboard-analysis--simulation .dashboard-analysis-item {
  width: 33.333%;
}

.dashboard-analysis--toeic.dashboard-analysis--simulation .dashboard-analysis-item.\--half {
  width: 50%;
}

.dashboard-analysis--toeic.dashboard-analysis--simulation .dashboard-analysis-item.\--full {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   PASSAGE LISTENING IMAGE
   ========================================================================== */

.passage-listening-image {
  display: block;
  width: 100%;
  height: calc(100% - 220px);
}

.passage-listening-image figure {
  width: 100%;
  height: 100%;
}

.passage-listening-image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.question-listening .question-passage.question-passage--without-image {
  background: #003871;
  border-radius: 6px 0 0 6px;
}

.question-form--empty-label label {
  min-height: 50px;
}

.passage-listening.passage-listening--without-image {
  background: none;
  height: auto;
}

.passage-listening.passage-listening--without-image::before {
  display: none;
}

.passage-listening.passage-listening--without-image .title,
.passage-listening.passage-listening--without-image p {
  text-align: left;
  color: white;
}

.passage-listening.passage-listening--without-image .title {
  padding: 68px 0 30px 54px;
}

.passage-listening.passage-listening--without-image p {
  padding-left: 54px;
  margin-bottom: 30px;
}

.passage-listening.passage-listening--without-image .audio-passage__play.audio-passage__play--small {
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  bottom: auto;
  left: auto;
  margin-left: 54px;
  position: relative;
  max-width: 72%;
}

.passage-listening.passage-listening--without-image .loader.loader-audio {
  border-radius: 50px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question--question-multiple .question-form {
  margin-bottom: 40px;
}

.reading-questions--simulation {
  text-align: center;
}

.reading-questions--simulation .question-content--left {
  margin: 0 auto;
  float: none;
}

.question-passage .retry-content {
  top: 15px;
  left: 15px;
  z-index: 9;
  right: auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   DETAILS - ANSWER SHEET SCSS
   ========================================================================== */

.answer-sheet .question-number {
  margin: 15px 0;
}

.question-form .answer-label label:hover {
  border-color: rgba(0, 0, 0, 0);
}

.test-type {
  text-align: center;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  color: #91949e;
}

.answer-sheet__modal .correct-answer label,
.answer-sheet__modal .correct-answer label:hover {
  border-color: #11a06f;
}

.answer-sheet__modal .correct-answer.selected-answer label,
.answer-sheet__modal .correct-answer.selected-answer label:hover {
  background-color: #ddfbf1;
}

.answer-sheet__modal .wrong-answer label,
.answer-sheet__modal .wrong-answer label:hover {
  border-color: #ec3237;
}

.answer-sheet__modal .wrong-answer.selected-answer label,
.answer-sheet__modal .wrong-answer.selected-answer label:hover {
  background-color: #fce3e4;
}

.answer-view-more {
  cursor: pointer;
}

/* ==========================================================================
   ANSWER SHEET MODAL
   ========================================================================== */

.answer-sheet__modal .modal-body {
  padding: 0;
}

.answer-sheet__modal .audio-passage__play {
  margin-bottom: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   ANALYSIS-DETAILS
   ========================================================================== */

.view-feedback-score--toeic-lr .score {
  font-size: 18px;
  font-size: 1.8rem;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   TOTALIZERS
   ========================================================================== */

.totalizers-itens__text,
.totalizers-msg--practice {
  line-height: 18px;
  line-height: 1.8rem;
  color: #fff;
  text-align: center;
  display: block;
}

.totalizers-itens__text i,
.totalizers-msg--practice i {
  font-size: 46px;
  font-size: 4.6rem;
  display: block;
  color: #0075ea;
  margin-bottom: 20px;
}

.totalizers-msg--practice {
  padding: 0 5%;
  width: calc(100% - 230px);
}

.totalizers-itens__text i {
  margin-bottom: 12px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}

.overview-categories__item .legend {
  display: block;
  margin: 8px 0 25px 0;
}

.overview-categories__item .total-time .legend {
  margin-bottom: 0;
}

.results-chart--single {
  width: 50%;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   ANALYSIS
   ========================================================================== */

.results-chart--single {
  margin-left: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

questions-counter-practice {
  padding: 23px 20px 0 20px;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SESSION
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   PRACTICE
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

.simulation-intro-toeic__center {
  min-width: 350px;
  text-align: left;
}

.simulation-intro-toeic__time {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
  margin-bottom: 40px;
  font-weight: bold;
  color: #0075ea;
}

.simulation-intro-toeic__list-parts span {
  font-size: 16px;
  font-size: 1.6rem;
  display: inline-block;
  width: 240px;
  margin-right: 20px;
  margin-bottom: 20px;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.btn-clock.hide-all {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.simulation-directions--toeic .question-content--left {
  padding: 50px;
  background-color: #f6f9fb;
}

.simulation-directions--toeic .question-content--right {
  padding: 50px;
  background: none;
}

.simulation-directions--toeic .title,
.simulation-directions--toeic .subtitle {
  margin-bottom: 30px;
}

.simulation-directions--toeic .subtitle {
  font-weight: normal;
}

.simulation-directions--toeic .audio--example {
  margin-bottom: 30px;
  display: block;
}

.simulation-directions--toeic .image--example {
  margin: 0;
}

.simulation-directions--toeic .image--example figcaption {
  margin-bottom: 8px;
}

simulation-listening-passage-toeic-lr {
  display: block;
  width: 100%;
  position: fixed;
  top: 63px;
  left: 0;
  z-index: 105;
  background-color: #2a6dcd;
}

simulation-listening-passage-toeic-lr .audio-passage__play {
  max-width: 1240px;
  margin: 0 auto;
}

.question--centered {
  display: flex;
  justify-content: center;
}

.question--centered .question-content--right {
  border-left: 0;
}

.simulation__container--listening {
  margin-top: 94px;
}

.question-content--multiple-passages .question-content {
  min-width: auto;
}

.question-content--left.question-content--total {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   RESULTS CHART
   ========================================================================== */

div + .results-chart {
  margin-left: 30px;
}

.results-chart {
  width: calc(40% - 15px);
  padding: 30px 10px;
}

.results-chart #analysis-doughnut {
  max-width: 250px;
  margin: 0 auto;
}

.results-chart__nodata {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SESSION
   ========================================================================== */

.practice__container--session {
  text-align: center;
}

.practice__container--session .btn--primary {
  width: auto;
}

.practice__container--session .percentage {
  font-size: 30px;
  font-size: 3rem;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 0;
  font-weight: bold;
  background: white;
}

.practice__container--session .percentage small {
  font-size: 60%;
}

.session {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 50px;
}

.session-invalid,
.session-valid {
  width: 100%;
  text-align: center;
}

.session__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 50px 0;
  display: block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== */

.box-session-content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 100%;
  max-width: 720px;
  margin: 0 auto 50px;
  border: 1px solid #e2e8ee;
  display: inline-block;
  overflow: hidden;
}

.box-session-left {
  width: 35%;
  padding: 40px 50px;
  float: left;
}

.box-session-left--no-score {
  padding: 18px 25px;
}

.box-session-left--no-score a {
  color: #0075ea;
}

.box-session-left .analytics-score input,
.box-session-left .analytics-score .legend {
  color: #5d6670 !important;
}

.box-session-left .analytics-score .graph {
  height: 120px;
  margin-top: 0;
}

.box-session-left .analytics-score .legend {
  font-size: 12px;
  font-size: 1.2rem;
  max-width: 70px;
  margin: -18px auto 0;
  line-height: normal;
}

.box-session-info {
  width: 65%;
  float: left;
  border-left: 1px solid #e2e8ee;
}

.box-session-info > div {
  width: 100%;
  float: left;
}

.box-session-info .title {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: left;
}

.box-session-info .info-header {
  padding: 30px;
  border-bottom: 1px solid #e2e8ee;
}

.box-session-info .info-header > div {
  text-align: left;
}

.box-session-info .info-header .avg-time {
  width: 200px;
  float: left;
}

.box-session-info .info-header .total-time {
  max-width: 140px;
  min-width: 110px;
  float: right;
}

.box-session-info .info-header i {
  font-size: 32px;
  font-size: 3.2rem;
  margin-right: 10px;
  float: left;
}

.box-session-info .info-header .time {
  font-weight: bold;
}

.box-session-info .info-header .legend {
  font-size: 12px;
  font-size: 1.2rem;
  color: rgba(93, 102, 112, 0.8);
  text-transform: uppercase;
}

.box-session-info .info-footer {
  background-color: #f9f9f9;
}

.box-session-info .info-footer.info-independent--cefr li {
  width: 50%;
}

.box-session-info .results-details {
  width: 100%;
  position: relative;
}

.box-session-info .results-details li {
  padding: 10px;
  min-height: 120px;
  text-align: center;
}

.box-session-info .results-details li:first-child {
  border: 0;
}

.box-session-info .results-details li > span:first-child {
  display: block;
  margin: 0 auto;
}

.box-session-info .results-details li span {
  margin: 0;
}

.box-session-info .results-details .value {
  font-size: 18px;
  font-size: 1.8rem;
  padding-top: 3px;
  display: inline-block;
}

.box-session-info .results-details i {
  font-size: 12px;
  font-size: 1.2rem;
  width: 24px;
  height: 24px;
  margin: 0 5px 6px 0px;
  line-height: 24px;
}

.box-session-info .results-details .type {
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 5px;
  color: #5d6670;
  display: block;
}

.graph-cover-score input {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== */

.session-invalid .title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 0 auto 20px;
  display: block;
}

.session-invalid i {
  font-size: 64px;
  font-size: 6.4rem;
  margin-bottom: 20px;
  color: #ec3237;
}

.session-invalid a {
  color: #5d6670;
  font-weight: bold;
}

.session-invalid a:hover {
  text-decoration: underline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.practice__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.practice__content {
  padding: 0;
}

.practice__content + .card {
  margin: 30px 0 0 30px;
}

.practice__content .fe {
  margin-right: 10px;
}

.practice__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.header-internal__content,
.practice__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.practice__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   PRACTICE
   ========================================================================== */

.header-internal__content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.practice__container {
  display: block;
}

.practice__content {
  width: 100%;
  position: relative;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize .counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.counter {
  display: none !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-end {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
}

.simulation-end__content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px;
  text-align: left;
  line-height: 26px;
}

.simulation-end__content p {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-progress {
  width: calc(100% - 840px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress.\--cefr-rl {
  max-width: 220px;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 100%;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION VOLUME
   ========================================================================== */

.simulation-volume {
  display: inline-block;
}

.volume-wrap {
  font-size: 17px;
  color: #fff;
  background: #038ae7;
  display: flex;
  padding: 10px;
  border-radius: 100px;
  margin: 12px;
  border: 1px solid #038ae7;
  justify-content: center;
  align-items: center;
}

.simulation-volume .tooltip-content {
  height: 34px;
  top: 38px;
}

.simulation-volume .tooltip-content input {
  display: block;
  margin: 0 auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

.dashboard-analysis--single-full-test {
  margin-bottom: 30px;
}

.dashboard-analysis--single-full-test .dashboard-analysis__content {
  padding: 20px 80px;
}

.dashboard-analysis--single-full-test .btn--primary {
  min-width: 280px;
  margin-left: 50px;
}

.dashboard-analysis--cefr-lr .dashboard-analysis-item__name small {
  display: block;
  font-weight: normal;
}

.dashboard-analysis--cefr-lr.dashboard-analysis--practice .dashboard-analysis-item {
  width: 50%;
}

.dashboard-analysis--cefr-lr.dashboard-analysis--simulation .dashboard-analysis-item {
  width: 33.333%;
}

.dashboard-analysis--cefr-lr.dashboard-analysis--simulation .dashboard-analysis-item.\--half {
  width: 50%;
}

.dashboard-analysis--cefr-lr.dashboard-analysis--simulation .dashboard-analysis-item.\--full {
  width: 100%;
}

.dashboard-analysis__totalizers {
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  border-bottom: 1px solid #dde4ea;
}

.dashboard-analysis__totalizers li:not(:first-child) {
  text-align: center;
  display: block;
  padding: 1.4rem;
}

.dashboard-analysis__totalizers strong {
  opacity: 0.6;
  filter: alpha(opacity=60);
  display: block;
  text-transform: uppercase;
  font-size: 75%;
}

.dashboard-analysis__totalizers span {
  line-height: 24px;
  line-height: 2.4rem;
}

.dashboard-analysis__totalizers--custom {
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
}

.dashboard-analysis__content {
  position: relative;
}

.dashboard-analysis__mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
}

.dashboard-analysis__mask > .tooltip {
  width: 100%;
  height: 100%;
}

.dashboard-analysis__mask .tooltip-content {
  top: 80px;
}

.dashboard-analysis__lock-icon {
  font-size: 28px;
  font-size: 2.8rem;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 100%;
  background: #fff;
  padding: 15px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   RESULTS CHART
   ========================================================================== */

div + .results-chart {
  margin-left: 30px;
}

.results-chart {
  width: calc(40% - 15px);
  padding: 30px 10px;
}

.results-chart #analysis-doughnut {
  max-width: 250px;
  margin: 0 auto;
}

.results-chart__nodata {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SESSION
   ========================================================================== */

.practice__container--session {
  text-align: center;
}

.practice__container--session .btn--primary {
  width: auto;
}

.practice__container--session .percentage {
  font-size: 30px;
  font-size: 3rem;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 0;
  font-weight: bold;
  background: white;
}

.practice__container--session .percentage small {
  font-size: 60%;
}

.session {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 50px;
}

.session-invalid,
.session-valid {
  width: 100%;
  text-align: center;
}

.session__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 50px 0;
  display: block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== */

.box-session-content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 100%;
  max-width: 720px;
  margin: 0 auto 50px;
  border: 1px solid #e2e8ee;
  display: inline-block;
  overflow: hidden;
}

.box-session-left {
  width: 35%;
  padding: 40px 50px;
  float: left;
}

.box-session-left--no-score {
  padding: 18px 25px;
}

.box-session-left--no-score a {
  color: #0075ea;
}

.box-session-left .analytics-score input,
.box-session-left .analytics-score .legend {
  color: #5d6670 !important;
}

.box-session-left .analytics-score .graph {
  height: 120px;
  margin-top: 0;
}

.box-session-left .analytics-score .legend {
  font-size: 12px;
  font-size: 1.2rem;
  max-width: 70px;
  margin: -18px auto 0;
  line-height: normal;
}

.box-session-info {
  width: 65%;
  float: left;
  border-left: 1px solid #e2e8ee;
}

.box-session-info > div {
  width: 100%;
  float: left;
}

.box-session-info .title {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: left;
}

.box-session-info .info-header {
  padding: 30px;
  border-bottom: 1px solid #e2e8ee;
}

.box-session-info .info-header > div {
  text-align: left;
}

.box-session-info .info-header .avg-time {
  width: 200px;
  float: left;
}

.box-session-info .info-header .total-time {
  max-width: 140px;
  min-width: 110px;
  float: right;
}

.box-session-info .info-header i {
  font-size: 32px;
  font-size: 3.2rem;
  margin-right: 10px;
  float: left;
}

.box-session-info .info-header .time {
  font-weight: bold;
}

.box-session-info .info-header .legend {
  font-size: 12px;
  font-size: 1.2rem;
  color: rgba(93, 102, 112, 0.8);
  text-transform: uppercase;
}

.box-session-info .info-footer {
  background-color: #f9f9f9;
}

.box-session-info .info-footer.info-independent--cefr li {
  width: 50%;
}

.box-session-info .results-details {
  width: 100%;
  position: relative;
}

.box-session-info .results-details li {
  padding: 10px;
  min-height: 120px;
  text-align: center;
}

.box-session-info .results-details li:first-child {
  border: 0;
}

.box-session-info .results-details li > span:first-child {
  display: block;
  margin: 0 auto;
}

.box-session-info .results-details li span {
  margin: 0;
}

.box-session-info .results-details .value {
  font-size: 18px;
  font-size: 1.8rem;
  padding-top: 3px;
  display: inline-block;
}

.box-session-info .results-details i {
  font-size: 12px;
  font-size: 1.2rem;
  width: 24px;
  height: 24px;
  margin: 0 5px 6px 0px;
  line-height: 24px;
}

.box-session-info .results-details .type {
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 5px;
  color: #5d6670;
  display: block;
}

.graph-cover-score input {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== */

.session-invalid .title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 0 auto 20px;
  display: block;
}

.session-invalid i {
  font-size: 64px;
  font-size: 6.4rem;
  margin-bottom: 20px;
  color: #ec3237;
}

.session-invalid a {
  color: #5d6670;
  font-weight: bold;
}

.session-invalid a:hover {
  text-decoration: underline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.practice__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.practice__content {
  padding: 0;
}

.practice__content + .card {
  margin: 30px 0 0 30px;
}

.practice__content .fe {
  margin-right: 10px;
}

.practice__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.header-internal__content,
.practice__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.practice__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   PRACTICE
   ========================================================================== */

.header-internal__content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.practice__container {
  display: block;
}

.practice__content {
  width: 100%;
  position: relative;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize .counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.counter {
  display: none !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-end {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
}

.simulation-end__content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px;
  text-align: left;
  line-height: 26px;
}

.simulation-end__content p {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-progress {
  width: calc(100% - 840px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 100%;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION VOLUME
   ========================================================================== */

.simulation-volume {
  display: inline-block;
}

.volume-wrap {
  font-size: 17px;
  color: #fff;
  background: #038ae7;
  display: flex;
  padding: 10px;
  border-radius: 100px;
  margin: 12px;
  border: 1px solid #038ae7;
  justify-content: center;
  align-items: center;
}

.simulation-volume .tooltip-content {
  height: 34px;
  top: 38px;
}

.simulation-volume .tooltip-content input {
  display: block;
  margin: 0 auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

.dashboard-analysis--cefr .icon-edusynch {
  background: #ffa500;
}

.dashboard-analysis--cefr .icon-edusynch.\--cefr-two-skill {
  background: #11a06f;
}

.dashboard-analysis--cefr .icon-edusynch.\--cefr-two-skill i {
  font-size: 18px;
  font-size: 1.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 48px;
}

.dashboard-analysis-item__description {
  display: block;
}

.dashboard-analysis--single-full-test {
  margin-bottom: 30px;
}

.dashboard-analysis--single-full-test .dashboard-analysis__content {
  padding: 20px 80px;
}

.dashboard-analysis--single-full-test .btn--primary {
  min-width: 280px;
  margin-left: 50px;
}

.dashboard-analysis__totalizers {
  display: grid;
  align-items: center;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  border-bottom: 1px solid #dde4ea;
}

.dashboard-analysis__totalizers li:not(:first-child) {
  text-align: center;
  display: block;
  padding: 1.4rem;
}

.dashboard-analysis__totalizers strong {
  opacity: 0.6;
  filter: alpha(opacity=60);
  display: block;
  text-transform: uppercase;
  font-size: 75%;
}

.dashboard-analysis__totalizers span {
  line-height: 24px;
  line-height: 2.4rem;
}

.dashboard-analysis__totalizers--custom {
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
}

.dashboard-analysis__content {
  position: relative;
}

.dashboard-analysis__mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
}

.dashboard-analysis__mask > .tooltip {
  width: 100%;
  height: 100%;
}

.dashboard-analysis__mask .tooltip-content {
  top: 80px;
}

.dashboard-analysis__lock-icon {
  font-size: 28px;
  font-size: 2.8rem;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 100%;
  background: #fff;
  padding: 15px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--cefr .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   DETAILS - ANSWER SHEET SCSS
   ========================================================================== */

.answer-sheet .question-number {
  margin: 15px 0;
}

.question-form .answer-label label:hover {
  border-color: rgba(0, 0, 0, 0);
}

.test-type {
  text-align: center;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: bold;
  color: #91949e;
}

/* ==========================================================================
   ANSWER SHEET MODAL
   ========================================================================== */

.answer-sheet__modal .modal-body {
  padding: 0;
}

.answer-sheet__modal .audio-passage__play {
  margin-bottom: 0;
}

.reading-question-insert__description {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 40px;
}

.reading-question-insert__description .orb {
  -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.1);
  background-color: #e2e8ee;
  width: 22px;
  height: 22px;
  margin: 0 5px;
  cursor: auto;
  position: relative;
  top: 4px;
}

.reading-question-insert__legend {
  font-size: 18px;
  font-size: 1.8rem;
  width: 100%;
  display: block;
  text-align: center;
}

.reading-question-insert__legend small {
  font-size: 14px;
  font-size: 1.4rem;
  margin-top: 20px;
  color: #0075ea;
  display: block;
}

.speaking-answersheet-question-passage--left {
  background: #003871 !important;
  color: #fff !important;
}

.speaking-answersheet-question-passage--left .question-header {
  border-bottom: none !important;
}

.speaking-answersheet-question-passage--left .question-header .title {
  margin-bottom: 0px !important;
}

.speaking-answersheet-question-passage--right {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.speaking-answersheet-question-passage--right h4 {
  margin: 4px;
}

.speaking-answersheet-question-passage--right .speaking-answer .audio-passage__play {
  background: #11a06f;
}

.speaking-answersheet-question-passage--right .box-play-question-audio {
  margin-bottom: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.analysis-detail__score,
.analysis-detail-information,
.analysis-details-feedback {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.analysis-detail__score,
.card-content.analysis-detail-information,
.card-content.analysis-details-feedback {
  padding: 0;
}

.analysis-detail__score + .card,
.analysis-detail-information + .card,
.analysis-details-feedback + .card {
  margin: 30px 0 0 30px;
}

.analysis-detail__score .fe,
.analysis-detail-information .fe,
.analysis-details-feedback .fe {
  margin-right: 10px;
}

.analysis-detail__score:hover,
.analysis-detail-information:hover,
.analysis-details-feedback:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis-details__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis-details__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS-DETAILS
   ========================================================================== */

.header-analysis-data {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.header-analysis-data li {
  display: inline-block;
}

.header-analysis-data li + li {
  margin-left: 15px;
}

.analysis-details__container {
  display: block;
}

.analysis-details__header {
  width: 100%;
  margin-bottom: 30px;
  flex-direction: row-reverse;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
}

.analysis-detail__score,
.analysis-detail-information {
  min-height: 180px;
}

.analysis-detail__score {
  height: 100%;
  min-width: 340px;
  margin-right: 30px;
  background-size: cover;
}

.analysis-detail__score .description {
  display: inline-block;
  vertical-align: top;
}

analysis-details-simulation-cefr .analysis-detail__score {
  margin-right: 0;
}

.analysis-detail__content {
  padding: 25px 20px 10px;
}

.analysis-detail__content .view-score-icon {
  padding: 0;
}

.view-score-icon {
  margin-right: 15px;
  display: inline-block;
}

.view-score-icon i {
  width: 96px;
  height: 96px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
}

.view-score-icon.msg-congratz i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NyA2MyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcgNjM7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Qxe2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQoJLnN0MntmaWxsOnVybCgjc3RhcjNfMl8pO30KCS5zdDN7ZmlsbDp1cmwoI3N0YXIzXzNfKTt9Cjwvc3R5bGU+CjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMjMuNDYxNiIgeTE9IjMyLjE5NDkiIHgyPSIyMy40NjE2IiB5Mj0iNjEuOTE0MyI+Cgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+Cgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3RvcC1jb2xvcjojRUI5MTAwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNyw0NS41YzAsMCwwLjEsMCwwLjEtMC4xYzIuNi0xLjEsNS4xLTMuMyw2LjgtNi4xYzE1LjgtOS44LDkuMi0xNy41LDQtMTYuMWMwLjMtMi4zLDAuNS0zLjksMC41LTMuOUg4LjYKCWMwLDAsMC4yLDEuNiwwLjUsMy45Yy01LjMtMS40LTExLjksNi4zLDQsMTYuMWMxLjcsMi44LDQuMSw1LDYuOCw2LjFjMCwwLDAuMSwwLDAuMSwwLjFjMS40LDAuNywxLjUsMi4xLDEuNSwyLjF2My41CgljMCw1LjYtNS43LDUuNS01LjcsNS41aC0wLjhWNTlIMzJ2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNUMyNS41LDQ3LjYsMjUuNSw0Ni4yLDI3LDQ1LjV6IE0zNS4yLDM2LjYKCWMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6IE05LjQsMjUuNmMwLjMsMi40LDAuOCw1LjEsMS4zLDcuOWMwLjIsMS4xLDAuNSwyLjEsMSwzLjEKCUMyLjEsMjguOCw0LjksMjQuNyw5LjQsMjUuNnoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8yXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0My40OTYyIiB5MT0iMTguNjg4NSIgeDI9IjIwLjQyNjEiIHkyPSI0OC4yNjkzIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggY2xhc3M9InN0MSIgZD0iTTI3LDQ1LjVjMCwwLDAuMSwwLDAuMS0wLjFjMi42LTEuMSw1LjEtMy4zLDYuOC02LjFjMTUuOC05LjgsOS4yLTE3LjUsNC0xNi4xYzAuMy0yLjMsMC41LTMuOSwwLjUtMy45CglzLTcuNSwwLTE0LjksMGMtMC4zLDAtMC4yLDAtMC4yLDBMMjMuNiw1OWMwLDAtMC4yLDAsMC4xLDBjNC4yLDAsOC4yLDAsOC4yLDB2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNQoJQzI1LjUsNDcuNiwyNS41LDQ2LjIsMjcsNDUuNXogTTM1LjIsMzYuNmMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6Ii8+CjxsaW5lYXJHcmFkaWVudCBpZD0ic3RhcjNfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMzQuMjM2NSIgeTE9IjcuMTI4NCIgeDI9IjM0LjIzNjUiIHkyPSIxNC44MjUxIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzIiBjbGFzcz0ic3QyIiBkPSJNMzYuMywxMC44Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMWMtMC4xLDAtMC4yLDAtMC4zLTAuMQoJYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdDMzAuNSw2LDMwLjcsNS44LDMxLDUuOGMwLDAsMCwwLDAsMGwyLjEsMGwwLjYtMgoJYzAuMS0wLjIsMC4zLTAuNCwwLjYtMC40czAuNSwwLjIsMC42LDAuNGwwLjYsMmwyLjEsMGMwLDAsMCwwLDAsMGMwLjMsMCwwLjUsMC4yLDAuNiwwLjRjMC4xLDAuMiwwLDAuNS0wLjIsMC43bC0xLjcsMS4ybDAuNywyCgljMC4xLDAuMiwwLDAuNS0wLjIsMC43QzM2LjUsMTAuOCwzNi40LDEwLjgsMzYuMywxMC44TDM2LjMsMTAuOHoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJzdGFyM18zXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIyNC4xMTU1IiB5MT0iMTAuODE3NyIgeDI9IjI0LjExNTUiIHkyPSIxOC41MTQ0Ij4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzXzFfIiBjbGFzcz0ic3QzIiBkPSJNMjYuMSwxNC41Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMQoJYy0wLjEsMC0wLjIsMC0wLjMtMC4xYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdjMC4xLTAuMiwwLjMtMC40LDAuNi0wLjRjMCwwLDAsMCwwLDAKCWwyLjEsMGwwLjYtMmMwLjEtMC4yLDAuMy0wLjQsMC42LTAuNHMwLjUsMC4yLDAuNiwwLjRsMC42LDJsMi4xLDBjMCwwLDAsMCwwLDBjMC4zLDAsMC41LDAuMiwwLjYsMC40YzAuMSwwLjIsMCwwLjUtMC4yLDAuNwoJTDI2LDExLjhsMC43LDJjMC4xLDAuMiwwLDAuNS0wLjIsMC43QzI2LjQsMTQuNSwyNi4zLDE0LjUsMjYuMSwxNC41TDI2LjEsMTQuNXoiLz4KPC9zdmc+Cg==);
}

.view-score-icon.msg-medium i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.view-score-icon.msg-low i {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

.analysis-detail-description {
  width: 100%;
  padding-top: 5px;
}

.analysis-detail-description > span {
  display: block;
}

.analysis-detail-description > span + span {
  margin-top: 4px;
}

.analysis-detail-description .date {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 15px;
  font-weight: bold;
}

.analysis-profile__name {
  font-size: 20px;
  font-size: 2rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.analysis-profile__email {
  margin-bottom: 5px;
}

.analysis-detail-information {
  width: 100%;
}

.analysis-detail-information__header,
.analysis-detail-data {
  width: 100%;
  padding: 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.analysis-profile span {
  display: block;
}

.avatar--analysis-detail {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 64px;
  height: 64px;
  min-width: 64px;
  margin-right: 30px;
  display: inline-block;
  background: #ddd;
}

.avatar--analysis-detail img {
  width: 100%;
  height: 100%;
}

.analysis-detail-data {
  border-top: 1px solid #dde4ea;
  text-align: center;
}

.analysis-detail-data__item {
  width: 100%;
}

.analysis-detail-data__icon {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  color: #0075ea;
}

.analysis-detail-data__title {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 10px;
  color: #5d6670;
  display: block;
}

.view-score-text {
  font-size: 14px;
  font-size: 1.4rem;
  width: 180px;
  display: inline-block;
}

.view-score-text span {
  text-transform: capitalize;
}

.view-score-text strong {
  font-size: 18px;
}

.analysis-details-feedback {
  width: 100%;
  margin: 0 0 30px;
  position: relative;
}

.analysis-details-feedback .card__header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.analysis-details-feedback select {
  margin-top: 15px;
  float: right;
}

.select-filter {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  min-width: 170px;
  height: 30px;
  padding: 5px 20px 5px 10px;
  border: 1px solid #e2e8ee;
  background-color: #fff;
  outline: none;
}

.view-feedback-content {
  display: flex;
}

.view-feedback-content h4:first-child {
  margin-top: 0;
}

.view-feedback-content h4 {
  margin-bottom: 10px;
}

.view-feedback-content > div {
  padding: 50px;
}

.view-feedback-score {
  width: 200px;
  float: left;
  text-align: center;
  padding: 10px !important;
  background-color: #cdd7e1;
}

.view-feedback-score .score {
  font-size: 24px;
  display: block;
  font-weight: bold;
}

.view-feedback-score .score small {
  opacity: 0.5;
  filter: alpha(opacity=50);
  font-size: 24px;
  font-size: 2.4rem;
  color: #5d6670;
  text-align: left;
}

.view-feedback-score .score-good {
  color: #30b770;
}

.view-feedback-score .score-weak {
  color: #ec3237;
}

.view-feedback-score .score-fair {
  color: #003871;
}

.view-feedback-score .text {
  text-transform: uppercase;
  display: inline-block;
  margin-bottom: 5px;
}

.view-feedback-text {
  width: calc(100% - 300px);
  border-left: 1px solid #e2e8ee;
  float: left;
}

.analysis-feedback-graphs {
  width: 100%;
  margin-top: 30px;
  display: block;
}

.results-chart--details,
.breakdown-chart--details {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  border: none;
}

.results-chart--details:hover,
.breakdown-chart--details:hover {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.share-score {
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  background-color: #0075ea;
  color: #fff;
  width: 122px;
  height: 42px;
  min-height: auto;
  line-height: 42px;
  text-align: center;
}

.share-score > .fe-icon {
  margin-right: 10px;
}

.share-score > a {
  margin-right: 10px;
}

.share-score li i {
  font-size: 16px;
  font-size: 1.6rem;
  width: 24px;
  height: 24px;
  margin-right: 10px;
  line-height: 24px;
  text-align: center;
}

.share-score li > a {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.share-score:hover .fe-arrow-up-small {
  display: inline-block;
}

.share-score:hover .fe-arrow-down-small {
  display: none;
}

.get-certificate {
  width: 100%;
  border-top: 1px solid #dde4ea;
  padding-top: 15px;
  display: block;
}

.get-certificate__button {
  margin: 0 auto;
  padding-right: 30px;
  color: #CEA910;
  display: block;
  font-weight: bold;
  position: relative;
  max-width: 160px;
}

.get-certificate__button img {
  position: absolute;
  top: 0;
  right: 0;
}

.analysis-detail__content--cambridge {
  text-align: center;
}

.analysis-detail__content--cambridge .description,
.analysis-detail__content--cambridge .view-score-text {
  width: auto;
  display: block;
}

.analysis-detail__content--cambridge .view-score-text {
  margin-bottom: 10px;
}

.analysis-detail__score score-cambridge {
  display: flex;
  justify-content: center;
  margin: 20px 0;
}

.analysis-detail__score .cambridge-shield img {
  width: 38px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   ZERO-DATA-MESSAGE
   ========================================================================== */

.zero-data-message {
  padding: 50px 35px;
}

.zero-data-message figure img {
  margin-right: 40px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   RESULTS CHART
   ========================================================================== */

div + .results-chart {
  margin-left: 30px;
}

.results-chart {
  width: calc(40% - 15px);
  padding: 30px 10px;
}

.results-chart #analysis-doughnut {
  max-width: 250px;
  margin: 0 auto;
}

.results-chart__nodata {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

.results-chart,
.breakdown-chart,
.widget-breakdown {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.results-chart,
.card-content.breakdown-chart,
.card-content.widget-breakdown {
  padding: 0;
}

.results-chart + .card,
.breakdown-chart + .card,
.widget-breakdown + .card {
  margin: 30px 0 0 30px;
}

.results-chart .fe,
.breakdown-chart .fe,
.widget-breakdown .fe {
  margin-right: 10px;
}

.results-chart:hover,
.breakdown-chart:hover,
.widget-breakdown:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.analysis__container,
.analysis-container__page {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.analysis__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   ANALYSIS
   ========================================================================== */

.nav-analysis {
  float: right;
}

.nav-analysis > li {
  float: left;
}

.nav-analysis > li + li {
  margin-left: 10px;
}

.nav-analysis > li i {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 5px;
}

.nav-analysis > li > a {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
  padding: 0 15px;
  height: 40px;
  color: #5d6670;
  line-height: 38px;
  border: 1px solid #e2e8ee;
  display: block;
}

.nav-analysis > li > .disabled:hover {
  background-color: #fff;
  color: #5d6670;
  border-color: #e2e8ee;
}

.nav-analysis > li > .disabled i,
.nav-analysis > li > .disabled .text {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.nav-analysis > li > .disabled .tooltip-content {
  min-width: 150px;
  top: 35px;
  line-height: normal;
}

.nav-analysis > li a:hover,
.nav-analysis > li.active > a {
  background-color: #0075ea;
  color: #fff;
  border-color: transparent;
}

.btn-filter {
  width: 40px;
  text-align: center;
}

.btn-filter a {
  padding: 0 10px !important;
}

.btn-filter:hover a {
  border-color: #e2e8ee !important;
  background-color: transparent !important;
}

.btn-filter:hover i {
  color: #0075ea;
}

.btn-filter .menu-dropdown {
  height: 250px !important;
}

.btn-filter .menu-dropdown > span {
  padding: 15px 0;
  border-bottom: 1px solid #e2e8ee;
  display: block;
  font-weight: bold;
  line-height: normal;
}

.btn-filter .menu-dropdown li {
  line-height: 42px;
  text-align: center;
}

.btn-filter .menu-dropdown li a {
  padding: 10px !important;
  display: block;
}

.btn-filter .menu-dropdown li a.active,
.btn-filter .menu-dropdown li a:hover {
  color: #0075ea;
}

/*
   ANALYSIS
   ========================================================================== */

.analysis-container__page {
  padding: 0;
}

/*
   PERFORMANCE
   ========================================================================== */

#analysis-breakdown {
  margin-bottom: 30px;
  min-height: 150px;
}

.results-chart,
.breakdown-chart {
  height: 380px;
  position: relative;
  text-align: center;
  float: left;
}

.results-chart .title,
.breakdown-chart .title {
  font-size: 16px;
  font-size: 1.6rem;
  margin: 0 auto 40px;
  font-weight: bold;
  text-transform: uppercase;
}

.results-chart .title small,
.breakdown-chart .title small {
  font-size: 12px;
  font-size: 1.2rem;
  display: block;
  font-weight: normal;
}

.results-chart > span,
.breakdown-chart > span {
  display: block;
}

.breakdown-chart {
  width: calc(60% - 15px);
  padding: 30px;
  padding-bottom: 60px;
}

.breakdown-chart .chart-container {
  margin: 20px;
}

.results-chart--practice {
  margin-top: 30px;
}

.doughnut-legend li {
  padding-left: 15px;
}

.doughnut-legend li > span {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 10px;
  height: 10px;
  margin-top: 5px;
}

.widget-breakdown {
  width: 100%;
}

.widget-breakdown .box-header {
  text-transform: uppercase;
}

.widget-breakdown__content {
  padding: 1.2rem;
}

.widget-breakdown__values h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 10px;
  color: #2a6dcd;
}

.widget-breakdown__values > ul {
  margin-bottom: 20px;
}

.widget-breakdown__values li {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  width: calc(33.333% - 3px);
  min-height: 100px;
  display: inline-block;
  vertical-align: top;
  padding: 1.6rem 2rem;
  background: #f5f5f5;
}

.widget-breakdown__values label,
.widget-breakdown__values .legend {
  display: block;
}

.widget-breakdown__values .widget-value {
  font-size: 24px;
  font-size: 2.4rem;
}

.widget-breakdown__values .legend {
  font-size: 12px;
  font-size: 1.2rem;
  opacity: 0.5;
  filter: alpha(opacity=50);
  text-transform: uppercase;
}

.cambridge-writing-breakdown li {
  width: calc(33.4% - 3px) !important;
}

.cambridge-writing-breakdown li + li {
  border-left: 1px solid #e9e9e9;
}

.widget-breakdown--practice {
  margin-bottom: 30px;
}

.widget-breakdown--practice .widget-breakdown__values li {
  width: calc(50% - 2px);
}

.widget-breakdown--full_test .card__header {
  display: block !important;
}

.widget-breakdown--cefr .card__header {
  display: block !important;
}

/*
   BOX RESULTS FULL
   ========================================================================== */

.results-chart-full {
  width: 100%;
  margin-left: 0 !important;
  position: relative;
}

.results-chart-full .results-chart {
  width: 30%;
  margin-left: 0 !important;
  float: left;
}

.results-details {
  width: 70%;
  height: 100%;
  background-color: rgba(226, 232, 238, 0.3);
  position: absolute;
  right: 0;
}

.results-details li {
  width: 25%;
  min-height: 340px;
  border-left: 1px solid rgba(0, 0, 0, 0.05);
  float: left;
  position: relative;
  text-align: center;
}

.results-details li:nth-child(4n+1) {
  background: rgba(255, 255, 255, 0);
}

.results-details li:nth-child(4n+2) {
  background: rgba(255, 255, 255, 0.25);
}

.results-details li:nth-child(4n+3) {
  background: rgba(255, 255, 255, 0.5);
}

.results-details li:nth-child(4n+4) {
  background: white;
}

.results-details li > div {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  margin: 0 auto;
  position: absolute;
  display: inline-block;
  text-align: center;
  top: 50%;
  left: 50%;
}

.results-details li i {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 32px;
  height: 32px;
  margin: 0 auto 10px;
  background-color: #0075ea;
  color: #fff;
  display: inline-block;
  line-height: 32px;
}

.results-details li span {
  margin-bottom: 10px;
  display: block;
}

.results-details li .fe-check {
  background-color: #1bd171;
}

.results-details li .fe-close {
  background-color: #f27474;
}

.results-details li .fe-jump {
  background-color: #f9c631;
}

.results-details li .fe-help {
  background-color: #5d6670;
}

.results-details li .fe-help.independent {
  background-color: #01b5ff;
}

.results-details li .fe-help.integrated {
  background-color: #0075ea;
}

.results-details .value {
  font-size: 26px;
  font-size: 2.6rem;
  color: #5d6670;
  font-weight: bold;
  line-height: 100%;
}

.results-details .type {
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: uppercase;
}

.results-details .type b {
  display: block;
}

/*
   BREAKDOWN WRITING
   ========================================================================== */

.breakdown-writing {
  padding: 15px;
  background-color: #f7f8f8;
}

.breakdown-writing .title {
  margin: 10px 0;
}

.breakdown-writing .box-header {
  font-weight: bold;
}

.breakdown-writing .breakdown-content {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  width: 100%;
  background-color: #fff;
  padding: 15px 10px;
  margin-top: 10px;
  border: 1px solid #e2e8ee;
  border-bottom: 2px solid rgba(0, 117, 234, 0.4);
  display: inline-block;
  text-align: center;
  position: relative;
}

.breakdown-writing .breakdown-content + div {
  margin-top: 15px;
  border-bottom-color: rgba(0, 117, 234, 0.4);
}

.breakdown-writing .breakdown-content .type-title {
  font-size: 14px;
  font-size: 1.4rem;
  margin-bottom: 5px;
  font-weight: bold;
}

.breakdown-writing .breakdown-content .item > span {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 10px 0;
  min-height: 65px;
  line-height: normal;
}

.breakdown-writing span {
  display: block;
}

.breakdown-writing .response,
.breakdown-writing .score {
  font-size: 12px;
  font-size: 1.2rem;
  margin-bottom: 5px;
  text-transform: uppercase;
}

.breakdown-writing .time,
.breakdown-writing .points {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
}

.breakdown-writing .points small {
  font-size: 12px;
  font-size: 1.2rem;
  font-weight: normal;
}

.breakdown-writing .time i {
  font-size: 14px;
  font-size: 1.4rem;
}

.breakdown-writing .max {
  font-size: 10px;
  font-size: 1rem;
  color: #aebecd;
  bottom: 5px;
  position: absolute;
  right: 7px;
  text-transform: uppercase;
}

/*
   MEDIA
   ========================================================================== */

@media (max-width: 1150px) {
  .breakdown-writing .type-title {
    margin-bottom: 0;
  }

  .breakdown-writing .breakdown-content {
    padding: 15px 5px;
  }

  .breakdown-writing .breakdown-content .item {
    padding: 0;
  }

  .breakdown-writing .score,
  .breakdown-writing .response {
    font-size: 12px;
    font-size: 1.2rem;
  }

  .breakdown-writing .points,
  .breakdown-writing .time {
    font-size: 14px;
    font-size: 1.4rem;
  }
}

.container-main--small > .breakdown-chart {
  margin-bottom: 0;
}

.container-main--small .breakdown-chart {
  padding-bottom: 0;
  height: auto;
}

.container-main--small .breakdown-chart,
.container-main--small .results-chart {
  width: 100%;
  margin-bottom: 30px;
  float: none;
}

.container-main--small .results-chart {
  margin-left: 0;
}

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.info-analysis {
  display: none;
}

.total-simulation i {
  font-size: 14px;
  font-size: 1.4rem;
  color: #fff;
}

.analysis--simulation .info-analysis-item + .info-analysis-item {
  margin-top: 0;
}

.analysis--simulation .box-history .box-header {
  position: relative;
}

.analysis--simulation .history-timeline li:hover {
  background-color: rgba(226, 232, 238, 0.2);
}

.analysis--simulation .score-name {
  bottom: 0;
}

/*
   HISTORY FILTER
   ========================================================================== */

#history-filter {
  position: absolute;
  right: 15px;
  top: 15px;
}

/* Practice
   -------------------------------------------------------------------------- */

.analysis-details .breakdown-chart,
.analysis-details .results-chart {
  min-height: 340px;
}

/* Radar Chart
-------------------------------------------------------------------------- */

.radar-legend-simulation {
  width: 100%;
  margin: 0 auto;
  bottom: 12px;
  position: absolute;
  left: 0;
}

.radar-legend-simulation li {
  font-size: 11px;
  font-size: 1.1rem;
  padding-left: 10px !important;
  display: inline-block;
  vertical-align: top;
  text-transform: uppercase;
}

.radar-legend-simulation li + li {
  margin-left: 10px;
}

.radar-legend-simulation.radar-legend li::before {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  margin: 0 10px 0 0;
  content: '';
  display: inline-block;
  vertical-align: top;
}

.radar-legend-simulation .color-projected::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-right::before {
  background-color: #1adab6;
}

.radar-legend-simulation .color-wrong::before {
  background-color: #ec3237;
}

.analysis-simulation .total-time {
  display: none;
}

.analysis-practice-detail #totalizers-msg small {
  display: block;
}

.analysis-practice-detail .total-simulation {
  display: none;
}

.analysis-simulation-cefr .total-questions {
  display: none;
}

.button-cefr {
  text-transform: uppercase;
}

.button-cefr:hover {
  background: #ffa500 !important;
}

.active .button-cefr {
  background-color: #ffa500 !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

.dashboard-analysis--cambridge.dashboard-analysis--practice .dashboard-analysis-item,
.dashboard-analysis--cambridge.dashboard-analysis--simulation .dashboard-analysis-item {
  width: 33.333%;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   PASSAGE LISTENING IMAGE
   ========================================================================== */

.passage-listening-image {
  display: block;
  width: 100%;
  height: calc(100% - 220px);
}

.passage-listening-image figure {
  width: 100%;
  height: 100%;
}

.passage-listening-image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.question-listening .question-passage.question-passage--without-image {
  background: #003871;
  border-radius: 6px 0 0 6px;
}

.question-form--empty-label label {
  min-height: 50px;
}

.passage-listening.passage-listening--without-image {
  background: none;
  height: auto;
}

.passage-listening.passage-listening--without-image::before {
  display: none;
}

.passage-listening.passage-listening--without-image .title,
.passage-listening.passage-listening--without-image p {
  text-align: left;
  color: white;
}

.passage-listening.passage-listening--without-image .title {
  padding: 68px 0 30px 54px;
}

.passage-listening.passage-listening--without-image p {
  padding-left: 54px;
  margin-bottom: 30px;
}

.passage-listening.passage-listening--without-image .audio-passage__play.audio-passage__play--small {
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  bottom: auto;
  left: auto;
  margin-left: 54px;
  position: relative;
  max-width: 72%;
}

.passage-listening.passage-listening--without-image .loader.loader-audio {
  border-radius: 50px;
}

.answers-cambridge--inline {
  margin-bottom: 5px;
  line-height: 45px;
}

.answers-cambridge--inline .orb-inline {
  margin-left: 15px;
}

.answers-cambridge--inline > .tooltip {
  margin-left: 8px;
  margin-right: 8px;
}

.answers-cambridge--inline input {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  height: 34px;
  min-width: 150px;
  padding: 8px;
  border: 2px solid #AEBECD;
  background: white;
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  color: #5d6670;
}

.answers-cambridge--inline .alternative-desc {
  margin-left: 10px;
}

.questions__title--cambridge {
  margin-bottom: 15px;
}

.cambridge-answer__list li {
  display: flex;
  align-items: center;
  max-width: 280px;
  justify-content: space-between;
}

.cambridge-answer__list li .select--options {
  margin: 0;
}

.cambridge-alternative-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  margin-top: 20px;
  margin-bottom: 40px;
}

.cambridge-alternative-wrapper img,
.cambridge-alternative-wrapper label {
  display: block;
}

.cambridge-alternative-wrapper label {
  text-align: center;
  text-align: center;
  margin: 20px;
  border-radius: 4px;
  padding: 20px;
  cursor: pointer;
  border: 1px solid transparent;
}

.cambridge-alternative-wrapper label:hover {
  border-color: #ccc;
}

.cambridge-alternative-wrapper img {
  margin: 0 auto;
}

.cambridge-alternative-wrapper input {
  visibility: hidden;
  height: 0;
}

.cambridge-alternative-wrapper input:checked + .orb {
  -moz-box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  -webkit-box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  background-color: #0075ea;
  border-color: #0075ea;
  color: #fff;
}

.cambridge-alternative-wrapper .cambridge-answer-wrong label {
  color: #ec3237;
  border-color: #ec3237;
}

.cambridge-alternative-wrapper .cambridge-answer-correct label {
  color: #11a06f;
  border-color: #11a06f;
}

.answer-color {
  width: 24px;
  height: 24px;
  display: inline-block;
}

.answers-cambridge--listening-part-5 select {
  margin-left: 0;
}

.passage-listening--cambridge.passage-listening--without-image .title {
  text-align: center;
  padding: 68px 54px 30px 54px;
}

.answers-cambridge--part-2-listening-practice .tooltip {
  margin-left: 10px;
}

.answers-cambridge--part-2-listening-practice .alternative-desc {
  margin-left: 5px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.reading-writing-questions .question-reading-writing {
  background-color: white;
  border-left: 0;
}

.reading-writing-questions .passage-reading-writing {
  background-color: #f6f9fb;
  border-right: 1px solid #dde4ea;
}

.question-reading-writing .question__legend,
.passage-reading-writing__content .title {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.passage-reading-writing__content {
  height: calc(100% - 65px);
  position: relative;
  padding: 40px;
}

.passage-reading-writing__content .title {
  margin-bottom: 30px;
}

.passage-reading-writing__content figure {
  margin: 0 0 20px;
}

.passage-reading-writing__content figure img {
  width: 100%;
}

.answers-cambridge--inline-reading {
  margin-bottom: 20px;
}

.answers-cambridge--inline-reading,
.answers-cambridge--inline-reading .alternative-desc {
  display: flex;
}

.answers-cambridge--dialog {
  align-items: flex-start;
}

.answers-cambridge--dialog .orb {
  margin-right: 20px;
}

.answers-cambridge--inline-reading .alternative-desc {
  line-height: 1.8;
}

.answers-cambridge--inline-reading .alternative-desc > span {
  margin-left: 10px;
}

.answers-cambridge--inline-reading .alternative-desc .tooltip {
  max-height: 40px;
}

.passage-alternative-tags li,
.passage-alternative-tag {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 14px;
  font-size: 1.4rem;
  display: inline-block;
  background: white;
  height: 34px;
  padding: 8px 14px;
  margin: 8px 8px 8px 0;
  border: 2px solid #AEBECD;
  background: white;
  color: #5d6670;
}

.passage-alternative-tag {
  margin: 8px;
}

.passage-alternative-list {
  background: white;
  border-radius: 4px;
}

.passage-alternative-list b {
  display: inline-block;
  margin-right: 10px;
}

.passage-alternative-list li {
  padding: 16px 24px;
}

.passage-alternative-list li:nth-child(even) {
  background: #F9F9F9;
}

.passage-scroll {
  height: 350px;
  padding-bottom: 50px;
  padding-right: 20px;
}

.passage__description--question-type-2 {
  margin-bottom: 50px;
}

.answer-cambridge--reading-dialog li {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
}

.answer-media-object__figure {
  border-radius: 50%;
  margin-right: 10px;
}

.answer-media-object__content {
  flex: 1;
  line-height: 1.8;
}

.answer-media-object__content .select--options {
  display: inline-block;
  width: auto;
}

.answers-cambridge-sub-alternatives li {
  line-height: 1.8;
  display: flex;
  align-items: center;
}

.answers-cambridge-sub-alternatives input {
  width: auto;
  margin-right: 15px;
}

.answers-cambridge-sub-alternatives .cambridge-answer-wrong {
  color: #ec3237;
}

.answers-cambridge-sub-alternatives .cambridge-answer-correct {
  color: #11a06f;
}

.answer-cambridge--part-4 {
  margin-bottom: 20px;
  display: flex;
}

.answer-cambridge--part-4 .answer-input {
  margin: 0 15px;
}

.answer-cambridge--part-4 .orb-inline {
  margin-left: 0;
}

.passage-alternative-tags {
  margin-bottom: 50px;
}

.answers-cambridge--sub-question {
  margin-top: 40px;
}

.answers-cambridge--sub-question__title {
  margin-left: 10px;
  margin-bottom: 0;
  display: block;
  line-height: 1.1rem;
}

.answers-cambridge--sub-question__header {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question--question-multiple .question-form {
  margin-bottom: 40px;
}

.reading-questions--simulation {
  text-align: center;
}

.reading-questions--simulation .question-content--left {
  margin: 0 auto;
  float: none;
}

.question-passage .retry-content {
  top: 15px;
  left: 15px;
  z-index: 9;
  right: auto;
}

.cambridge-simulation__title {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   COMMON-COUNTDOWN
   ========================================================================== */

.common-countdown {
  padding: 0 20px;
  display: inline-block;
}

.common-countdown strong {
  color: #0075ea;
}

.common-countdown p {
  margin: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SESSION
   ========================================================================== */

.practice__container--session {
  text-align: center;
}

.practice__container--session .btn--primary {
  width: auto;
}

.practice__container--session .percentage {
  font-size: 30px;
  font-size: 3rem;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: 0;
  font-weight: bold;
  background: white;
}

.practice__container--session .percentage small {
  font-size: 60%;
}

.session {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 50px;
}

.session-invalid,
.session-valid {
  width: 100%;
  text-align: center;
}

.session__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 50px 0;
  display: block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   VALID SESSION
   ========================================================================== */

.box-session-content {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  width: 100%;
  max-width: 720px;
  margin: 0 auto 50px;
  border: 1px solid #e2e8ee;
  display: inline-block;
  overflow: hidden;
}

.box-session-left {
  width: 35%;
  padding: 40px 50px;
  float: left;
}

.box-session-left--no-score {
  padding: 18px 25px;
}

.box-session-left--no-score a {
  color: #0075ea;
}

.box-session-left .analytics-score input,
.box-session-left .analytics-score .legend {
  color: #5d6670 !important;
}

.box-session-left .analytics-score .graph {
  height: 120px;
  margin-top: 0;
}

.box-session-left .analytics-score .legend {
  font-size: 12px;
  font-size: 1.2rem;
  max-width: 70px;
  margin: -18px auto 0;
  line-height: normal;
}

.box-session-info {
  width: 65%;
  float: left;
  border-left: 1px solid #e2e8ee;
}

.box-session-info > div {
  width: 100%;
  float: left;
}

.box-session-info .title {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: left;
}

.box-session-info .info-header {
  padding: 30px;
  border-bottom: 1px solid #e2e8ee;
}

.box-session-info .info-header > div {
  text-align: left;
}

.box-session-info .info-header .avg-time {
  width: 200px;
  float: left;
}

.box-session-info .info-header .total-time {
  max-width: 140px;
  min-width: 110px;
  float: right;
}

.box-session-info .info-header i {
  font-size: 32px;
  font-size: 3.2rem;
  margin-right: 10px;
  float: left;
}

.box-session-info .info-header .time {
  font-weight: bold;
}

.box-session-info .info-header .legend {
  font-size: 12px;
  font-size: 1.2rem;
  color: rgba(93, 102, 112, 0.8);
  text-transform: uppercase;
}

.box-session-info .info-footer {
  background-color: #f9f9f9;
}

.box-session-info .info-footer.info-independent li {
  width: 25%;
}

.box-session-info .results-details {
  width: 100%;
  position: relative;
}

.box-session-info .results-details li {
  padding: 10px;
  min-height: 120px;
  text-align: center;
}

.box-session-info .results-details li:first-child {
  border: 0;
}

.box-session-info .results-details li > span:first-child {
  display: block;
  margin: 0 auto;
}

.box-session-info .results-details li span {
  margin: 0;
}

.box-session-info .results-details .value {
  font-size: 18px;
  font-size: 1.8rem;
  padding-top: 3px;
  display: inline-block;
}

.box-session-info .results-details i {
  font-size: 12px;
  font-size: 1.2rem;
  width: 24px;
  height: 24px;
  margin: 0 5px 6px 0px;
  line-height: 24px;
}

.box-session-info .results-details .type {
  font-size: 12px;
  font-size: 1.2rem;
  margin-top: 5px;
  color: #5d6670;
  display: block;
}

.graph-cover-score input {
  display: none;
}

.box-session-info--full {
  width: 100%;
  border-left: 0;
  float: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   INVALID SESSION
   ========================================================================== */

.session-invalid .title {
  font-size: 21px;
  font-size: 2.1rem;
  margin: 0 auto 20px;
  display: block;
}

.session-invalid i {
  font-size: 64px;
  font-size: 6.4rem;
  margin-bottom: 20px;
  color: #ec3237;
}

.session-invalid a {
  color: #5d6670;
  font-weight: bold;
}

.session-invalid a:hover {
  text-decoration: underline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.practice__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.practice__content {
  padding: 0;
}

.practice__content + .card {
  margin: 30px 0 0 30px;
}

.practice__content .fe {
  margin-right: 10px;
}

.practice__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.header-internal__content,
.practice__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.practice__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   PRACTICE
   ========================================================================== */

.header-internal__content--left {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.practice__container {
  display: block;
}

.practice__content {
  width: 100%;
  position: relative;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-intro-toeic__center {
  min-width: 350px;
  text-align: left;
}

.simulation-intro-toeic__time {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
  margin-bottom: 40px;
  font-weight: bold;
  color: #0075ea;
}

.simulation-intro-toeic__list-parts span {
  font-size: 16px;
  font-size: 1.6rem;
  display: inline-block;
  width: 240px;
  margin-right: 20px;
  margin-bottom: 20px;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize .counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.counter {
  display: none !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-end {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
}

.simulation-end__content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px;
  text-align: left;
  line-height: 26px;
}

.simulation-end__content p {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}

.simulation-progress--cambridge {
  width: calc(100% - 950px);
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

simulation-progress {
  width: calc(100% - 680px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 100%;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION VOLUME
   ========================================================================== */

.simulation-volume {
  display: inline-block;
}

.volume-wrap {
  font-size: 17px;
  color: #fff;
  background: #038ae7;
  display: flex;
  padding: 10px;
  border-radius: 100px;
  margin: 12px;
  border: 1px solid #038ae7;
  justify-content: center;
  align-items: center;
}

.simulation-volume .tooltip-content {
  height: 34px;
  top: 38px;
}

.simulation-volume .tooltip-content input {
  display: block;
  margin: 0 auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.simulation-cover {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-cover__title {
  font-size: 32px;
  font-size: 3.2rem;
  margin-bottom: 100px;
  font-weight: bold;
  text-align: center;
}

.simulation-cover__list {
  font-size: 18px;
  font-size: 1.8rem;
}

.simulation-cover__list li {
  margin-bottom: 20px;
}

simulation-listening-passage-cambridge {
  display: block;
  width: 100%;
  position: fixed;
  top: 63px;
  left: 0;
  z-index: 105;
  background-color: #2a6dcd;
}

simulation-listening-passage-cambridge .audio-passage__play {
  max-width: 1240px;
  margin: 0 auto;
}

.simulation__container--listening.box-session-complete {
  margin-top: 54px;
}

.simulation__container--listening .question-content--left .question-content {
  min-width: 400px;
}

.simulation__container--listening .question-content--left {
  background-color: #f6f9fb;
}/* ==========================================================================
   CARD
   ========================================================================== */

.ellt-prep-course {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.ellt-prep-course {
  padding: 0;
}

.ellt-prep-course + .card {
  margin: 30px 0 0 30px;
}

.ellt-prep-course .fe {
  margin-right: 10px;
}

.ellt-prep-course:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.ellt-prep-course {
  display: flex;
  align-items: center;
  transition: color 0.3s ease-in, box-shadow 0.3s ease-in;
  color: #5d6670;
}

.ellt-prep-course .ellt-prep-course__icon-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 12px;
  background-color: rgba(39, 49, 100, 0.1);
  border-radius: 50%;
  margin-right: 16px;
}

.ellt-prep-course .ellt-prep-course__icon-container i {
  font-size: 16px;
  color: #0075ea;
  -moz-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  transform: scaleX(-1);
  -ms-filter: fliph;
  /*IE*/
  filter: fliph;
  /*IE*/
}

.ellt-prep-course:hover {
  color: #0075ea;
}/* ==========================================================================
   CARD
   ========================================================================== */

.history__header,
.history-item,
.history__no-data {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.history__header,
.card-content.history-item,
.card-content.history__no-data {
  padding: 0;
}

.history__header + .card,
.history-item + .card,
.history__no-data + .card {
  margin: 30px 0 0 30px;
}

.history__header .fe,
.history-item .fe,
.history__no-data .fe {
  margin-right: 10px;
}

.history__header:hover,
.history-item:hover,
.history__no-data:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.history__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.history__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

.history__header {
  width: 100%;
  border-bottom: 2px solid #e2e8ee;
  padding: 15px 20px;
  margin-bottom: 30px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.history__header h2 {
  display: inline-block;
}

.history__content,
.history-sort,
.history-filter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.history-sort {
  margin-right: 50px;
}

.history-sort__title,
.history-filter__title,
.history-sort__button {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.history-sort__icon {
  margin-left: 15px;
}

.history-sort__button.up i {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: -5px;
}

.history-sort__button--active {
  background-color: #0075ea;
  border: none;
  color: #fff;
}

.history-sort__button--active:hover {
  background-color: #0075ea;
  color: #fff;
}

.history-filter__title,
.history-sort__title {
  margin-right: 10px;
}

.history-sort__button {
  margin-left: 10px;
}

.history__global-list {
  width: 100%;
}

.history-wrap {
  margin-bottom: 20px;
  width: 100%;
  display: inline-block;
  vertical-align: top;
  cursor: pointer;
}

.history-wrap .pagination-content {
  margin-top: 50px;
}

.history-item {
  width: calc(33.3% - 10px);
  min-height: 80px;
  padding: 15px 20px;
  margin-left: 15px;
  background-color: #fff;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.history-item.active {
  cursor: pointer;
}

.history-item:nth-child(3n+1) {
  margin-left: 0;
}

.history-item:nth-child(1n+4) {
  margin-top: 20px;
}

.history-item span {
  display: block;
}

.history-item i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-bottom: 5px;
}

.history-item .title {
  font-size: 13px;
  font-size: 1.3rem;
  font-weight: bold;
  text-transform: uppercase;
}

.history-item .type,
.history-item .date {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.history-item .type {
  font-weight: bold;
}

.history-item__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  -webkit-justify-content: space-around;
  -moz-justify-content: space-around;
  justify-content: space-around;
}

.history-item__left {
  width: 30%;
  position: relative;
  text-align: center;
  min-height: 64px;
  margin-right: 30px;
  min-width: 80px;
}

.history-item__left::before {
  display: block;
  content: '';
  position: absolute;
  left: 0;
  bottom: -15px;
  height: 4px;
  width: 100%;
}

.history-item__right {
  width: calc(80% - 30px);
}

.history-item--practice .history-item__left::before {
  background-color: #ec3237;
}

.history-item--partial_test .history-item__left::before {
  background-color: #0075ea;
}

.history-item--custom-test .history-item__left::before {
  background-color: #fac612;
}

.history__no-data {
  width: 100%;
  padding: 40px 0;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   RESULTS CHART
   ========================================================================== */

div + .results-chart {
  margin-left: 30px;
}

.results-chart {
  width: calc(40% - 15px);
  padding: 30px 10px;
}

.results-chart #analysis-doughnut {
  max-width: 250px;
  margin: 0 auto;
}

.results-chart__nodata {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.overview-categories {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.overview-categories {
  padding: 0;
}

.overview-categories + .card {
  margin: 30px 0 0 30px;
}

.overview-categories .fe {
  margin-right: 10px;
}

.overview-categories:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   OVERVIEW-CATEGORIES
   ========================================================================== */

.overview-categories {
  width: 100%;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.overview-categories .tooltip-score {
  width: 280px;
  left: 20px;
}

.overview-categories > .disabled {
  position: relative;
}

.overview-categories > .disabled::before {
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

.overview-categories > .disabled .tooltip-content {
  min-width: 150px;
  top: 60%;
  z-index: 99;
}

.overview-categories > .disabled .description {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.overview-categories .description {
  padding: 30px 0 30px 30px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.overview-categories .description > span {
  margin-bottom: 6px;
  display: block;
}

.overview-categories .description > span:hover {
  color: #0075ea;
  font-weight: bold;
}

.overview-categories .point {
  font-size: 21px;
  font-size: 2.1rem;
  font-weight: bold;
}

.overview-categories .point-pending {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
  display: block;
}

.overview-categories__item {
  width: 100%;
  border-right: 1px solid rgba(226, 232, 238, 0.5);
}

.overview-categories__title {
  background-color: rgba(0, 0, 0, 0.02);
  padding: 15px 0 15px 30px;
  font-weight: bold;
  display: block;
  text-transform: uppercase;
}

.overview-categories__title i {
  font-size: 21px;
  font-size: 2.1rem;
  margin-right: 10px;
  color: #0075ea;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-intro-toeic__center {
  min-width: 350px;
  text-align: left;
}

.simulation-intro-toeic__time {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
  margin-bottom: 40px;
  font-weight: bold;
  color: #0075ea;
}

.simulation-intro-toeic__list-parts span {
  font-size: 16px;
  font-size: 1.6rem;
  display: inline-block;
  width: 240px;
  margin-right: 20px;
  margin-bottom: 20px;
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.btn-clock.hide-all {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

@media screen and (max-width: 1439px) {
  .header-internal-simulation__content.\--custom-test > h1 {
    font-size: 14px;
    display: flex;
    align-items: center;
  }
}

@media screen and (max-width: 1180px) {
  .header-internal-simulation__content .simulation-progress {
    width: calc(100% - 760px);
  }
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-progress.simulation-progress-custom--listening {
  width: calc(100% - 900px);
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.simulation-directions--toeic .question-content--left {
  padding: 50px;
  background-color: #f6f9fb;
}

.simulation-directions--toeic .question-content--right {
  padding: 50px;
  background: none;
}

.simulation-directions--toeic .title,
.simulation-directions--toeic .subtitle {
  margin-bottom: 30px;
}

.simulation-directions--toeic .subtitle {
  font-weight: normal;
}

.simulation-directions--toeic .audio--example {
  margin-bottom: 30px;
  display: block;
}

.simulation-directions--toeic .image--example {
  margin: 0;
}

.simulation-directions--toeic .image--example figcaption {
  margin-bottom: 8px;
}

.simulation-directions--custom .title {
  margin-bottom: 20px;
}

.simulation-directions--custom .subtitle {
  margin-bottom: 30px;
}

simulation-listening-passage-custom-test {
  display: block;
  width: 100%;
  position: fixed;
  top: 63px;
  left: 0;
  z-index: 105;
  background-color: #2a6dcd;
}

simulation-listening-passage-custom-test .audio-passage__play {
  max-width: 1240px;
  margin: 0 auto;
}

.question--centered {
  display: flex;
  justify-content: center;
}

.question--centered .question-content--right {
  border-left: 0;
}

.simulation__container--listening {
  margin-top: 94px;
}

.question-content--multiple-passages .question-content {
  min-width: auto;
}

.question-content--left.question-content--total {
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize .counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.counter {
  display: none !important;
}

.btn-clock.hide {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-end {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
}

.simulation-end__content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-width: 800px;
  margin: 0 auto;
  padding: 40px;
  text-align: left;
  line-height: 26px;
}

.simulation-end__content p {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-progress {
  width: calc(100% - 840px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 100%;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION VOLUME
   ========================================================================== */

.simulation-volume {
  display: inline-block;
}

.volume-wrap {
  font-size: 17px;
  color: #fff;
  background: #038ae7;
  display: flex;
  padding: 10px;
  border-radius: 100px;
  margin: 12px;
  border: 1px solid #038ae7;
  justify-content: center;
  align-items: center;
}

.simulation-volume .tooltip-content {
  height: 34px;
  top: 38px;
}

.simulation-volume .tooltip-content input {
  display: block;
  margin: 0 auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION
   ========================================================================== */

.simulation__content--reading.simulation__content--passage {
  width: 100%;
}

.custom-writing_passage {
  margin-top: 30px;
}

.custom-writing_passage h1 {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 28px;
  line-height: 2.8rem;
  margin-bottom: 25px;
}

.simulation__content simulation-writing-question-independent-custom-test-cefr .question-content--left,
.simulation__content simulation-writing-question-independent-custom-test-cefr .question-content--right {
  height: auto;
}

simulation-toefl writing-question-independent .question-content {
  height: 100%;
}

.btn--expand-passages {
  margin: 30px auto 0;
  display: block;
}

.btn--expand-passages > i {
  margin-left: 10px;
}

.box-simulation .question-content--left.question-content--custom-test {
  padding: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
  font-weight: bold;
  font-size: 20px;
}

.simulation-directions__text {
  font-size: 16px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize ng-counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.btn-clock.hide-all {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.ielts-summary-screen-reading .simulation-summary-table--header {
  margin-top: 0;
  box-shadow: none;
}

.ielts-summary-screen-reading .simulation-summary__thead-wrapper {
  padding-right: 16px;
}.custom-simulation-session {
  display: flex;
  justify-content: center;
  align-items: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-directions {
  padding: 45px 90px;
  min-height: 500px;
}

.simulation-directions__title {
  margin-bottom: 30px;
  font-weight: bold;
  font-size: 20px;
}

.simulation-directions__text {
  font-size: 16px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CLOCK
   ========================================================================== */

.box-clock {
  -webkit-transition: 0.4s ease-in width;
  -moz-transition: 0.4s ease-in width;
  -ms-transition: 0.4s ease-in width;
  -o-transition: 0.4s ease-in width;
  transition: 0.4s ease-in width;
  width: auto;
  padding: 0 25px;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  font-weight: normal;
  line-height: 38px;
  cursor: pointer;
}

.box-clock i {
  margin-top: -4px;
}

.box-clock.disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.box-clock.minimize {
  width: 40px;
  padding: 0;
  text-align: center;
}

.box-clock.minimize ng-counter {
  display: none;
}

.box-clock .tooltip-content {
  margin-top: 5px;
  min-width: 70px;
  line-height: normal;
}

.btn-clock.hide-all {
  display: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION CONTINUE BUTTON
   ========================================================================== */

.simulation-continue__content {
  display: inline-block;
  vertical-align: top;
}

.simulation-continue__content .tooltip-content {
  min-width: 200px;
  top: 56px;
}

.simulation-continue__button {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #81a51f;
}

.simulation-continue__button:hover {
  background-color: #b7dd4d;
}

.simulation-continue__button.disabled {
  background-color: #c0cbd6;
  cursor: auto;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== *//* ==========================================================================
   CARD
   ========================================================================== */

.header-internal--simulation {
  top: 0;
}

.header-internal--simulation .btn {
  font-size: 14px;
  font-size: 1.4rem;
  margin: 12px 7px;
}

.header-internal--simulation h1 {
  padding-top: 0;
}

.header-internal-simulation__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

simulation-actions,
simulation-aditional-options {
  display: inline-block;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   SIMULATION END
   ========================================================================== */

.simulation-interval {
  max-width: 800px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 500px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.simulation-interval--content {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  line-height: 26px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
}/* ==========================================================================
   CARD
   ========================================================================== */

.simulation-progress {
  width: calc(100% - 680px);
  display: inline-block;
  max-width: 440px;
  margin: 0 auto;
}

.simulation-progress__title {
  font-size: 1.5rem;
  display: inline-block;
  margin-right: 30px;
}

.simulation-progress__title + .simulation-progress__content {
  width: calc(100% - 160px);
}

.simulation-progress__line-progress {
  position: fixed;
  top: 64px;
  height: 1px;
  width: 100%;
  left: 0;
}

.simulation-progress__active-line {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  height: 1px;
  background: #b2dc3f;
  position: absolute;
}

.simulation-progress__content {
  width: 300px;
  height: 12px;
  margin: 0 20px 0 0;
  background-color: #f6f6f6;
  display: inline-block;
}

.simulation-progress__content,
.simulation-progress__content .simulation-progress__bar {
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.simulation-progress__bar {
  background-color: #add63d;
  background-image: -moz-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -ms-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b2dc3f), to(#a6ce39));
  background-image: -webkit-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: -o-linear-gradient(top, #b2dc3f, #a6ce39);
  background-image: linear-gradient(top, #b2dc3f, #a6ce39);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b2dc3f', endColorstr='#a6ce39', GradientType=0), #b2dc3f, #a6ce39;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -ms-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: 10%;
  height: inherit;
  display: block;
}

.simulation-progress__bar .tooltip-content {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.ielts-lrws-summary-screen-reading .simulation-summary-table--header {
  margin-top: 0;
  box-shadow: none;
}

.ielts-lrws-summary-screen-reading .simulation-summary__thead-wrapper {
  padding-right: 16px;
}.custom-simulation-session {
  display: flex;
  justify-content: center;
  align-items: center;
}

.ielts-rlws-question .ielts-question-diagram-answer-box {
  display: inline;
}/* ==========================================================================
   CARD
   ========================================================================== */

.static__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.static__content {
  padding: 0;
}

.static__content + .card {
  margin: 30px 0 0 30px;
}

.static__content .fe {
  margin-right: 10px;
}

.static__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.static__container {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.static__container {
  margin-top: 54px;
  display: flex;
  justify-content: space-between;
}

/* ==========================================================================
   STATIC
   ========================================================================== */

.static #main {
  padding-top: 94px;
}

.static .header-internal {
  top: 64px;
}

.static__title {
  margin-bottom: 0;
}

.static__container p + h4 {
  margin-top: 30px;
}

.static__container h4 {
  margin-bottom: 10px;
}

.static__container .update {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
}

.static__container .attention {
  margin: 30px 0;
  padding: 20px;
  background-color: rgba(236, 50, 55, 0.05);
}

.static__container .attention a {
  color: #000 !important;
}

.static__content {
  padding: 20px;
}

.static__content a {
  color: #0075ea;
  font-weight: bold;
}

.static__content a:hover {
  text-decoration: underline;
}

.static__content ul {
  margin-bottom: 15px;
  padding-left: 15px;
}

.static__content li::before {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  content: '';
  width: 5px;
  height: 5px;
  margin: 0 8px 4px 0;
  background-color: #0075ea;
  display: inline-block;
  vertical-align: middle;
}

.static__content li + li {
  margin-top: 5px;
}

.static__content .no-style li::before {
  display: none;
}

.static__content .no-style li + li {
  margin-top: 10px;
}

.static__content--forbidden,
.static__content--404 {
  text-align: center;
  padding: 40px 0;
}

.static__content--forbidden a,
.static__content--404 a {
  color: #0075ea;
}

.static__content--forbidden h1,
.static__content--404 h1 {
  font-size: 118px;
  font-size: 11.8rem;
  margin-bottom: 30px;
  color: #51a1e8;
}

.static__content--forbidden h2,
.static__content--404 h2 {
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: normal;
}

.static__content--forbidden h2 small,
.static__content--404 h2 small {
  font-size: 21px;
  font-size: 2.1rem;
  display: block;
  margin-bottom: 30px;
}

.box-static {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  background: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  min-width: 680px;
  padding: 100px;
  text-align: center;
}

.box-static img {
  margin-bottom: 80px;
}

.box-static p {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 50px;
}

.box-static a {
  color: #2a6dcd;
}

.box-static a:hover {
  text-decoration: underline;
}

.box-static h1,
.box-static h2 {
  margin-bottom: 30px;
}

.box-static h1 {
  color: #0075ea;
}

.box-static h2 small {
  display: block;
}

.box-static--support h1 {
  font-size: 24px;
  font-size: 2.4rem;
}

.box-static--support a {
  color: #fff;
}

.box-static--support a:hover {
  text-decoration: none;
}/* ==========================================================================
   CARD
   ========================================================================== */

.auth__logo {
  margin-bottom: 50px;
  display: block;
}

.auth__logo img {
  max-width: 300px;
}

.auth__container {
  -moz-box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
  box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1);
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  min-height: 100%;
  padding: 0;
  background-color: #fff;
  position: absolute;
}

.auth__featured,
.auth__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  -webkit-align-items: stretch;
  -moz-align-items: stretch;
  align-items: stretch;
  width: 100%;
  position: relative;
}

.auth__container--inverse social-networks {
  display: none;
}

.auth__container--inverse .auth__featured::after {
  display: none;
}

.auth__container--inverse .form-auth__logo-container a {
  margin-bottom: 32px;
  display: block;
}

.auth__container--inverse .form-auth__logo-container h2 {
  font-weight: normal;
  font-size: 2.4rem;
  margin-bottom: 24px;
}

.auth__container--inverse .form-auth {
  max-width: 370px;
}

.auth__container--inverse .form-auth__list .form-auth__password a {
  display: flex;
  justify-content: end;
  margin-top: 12px;
  color: #5d6670;
}

.auth__container--inverse .form-auth__list li {
  text-align: left;
}

.auth__container--inverse .form-auth__list label {
  margin-bottom: 5px;
  display: block;
}

.auth__container--inverse .form-auth__button {
  width: 100%;
}

.auth__container--inverse .auth__featured {
  order: 1;
}

.auth__container--inverse .auth__content {
  order: 0;
  max-width: 660px;
}

.auth__container--inverse .form-auth--login .form-auth__button {
  margin-top: 4px;
}

.auth__container--compact {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  height: 100vh;
}

.auth__container--compact .auth__container {
  position: relative;
  width: calc(100% - 60px);
  height: 710px;
  max-width: 1220px;
  border-radius: 12px;
  min-height: auto;
}

.auth__container--compact .auth__featured::before {
  display: none;
}

.auth__container--compact .auth__featured {
  order: 0;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.auth__container--compact .auth__featured > a {
  display: block;
  margin: 160px auto;
}

.auth__container--compact .auth__content {
  order: 1;
  max-width: 660px;
}

.auth__featured {
  background: url(44275a5189fa954c05580bdd5f830a15.png) center center no-repeat;
  background-size: cover;
}

.auth__featured::before,
.auth__featured::after {
  width: 100%;
  display: block;
  content: '';
  left: 0;
  position: absolute;
}

.auth__featured::before {
  opacity: 0.9;
  filter: alpha(opacity=90);
  height: 100%;
  background-color: #003871;
  top: 0;
}

.auth__featured::after {
  height: 5px;
  background-color: #ec3237;
  bottom: 0;
}

.auth__content {
  padding: 40px;
  overflow: hidden;
}

.auth__content .loader {
  position: absolute;
  left: 0;
  top: 0;
}

.auth__description {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  width: 100%;
  padding: 0 30px;
  color: #fff;
  position: relative;
  text-align: center;
}

.auth__description a {
  color: inherit;
}

.auth__description ul {
  max-width: 500px;
  margin: 0 auto 30px;
  text-align: left;
}

.auth__description ul li {
  list-style: initial;
}

.auth__description ul li + li {
  margin-top: 15px;
}

.auth__subtitle {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 0;
  font-weight: 500;
  line-height: 130%;
}

.auth__message {
  font-size: 14px;
  font-size: 1.4rem;
  max-width: 400px;
  margin: 30px auto 0;
}

.auth__message h3 {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 5px;
}

.auth__message p {
  line-height: 130%;
}

.auth__title,
.auth__tests {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
}

.auth__tests {
  margin-top: 20px;
}

.auth__footer {
  width: 100%;
  padding: 20px;
  bottom: 10px;
  left: 0;
  position: absolute;
  text-align: center;
}

.auth__footer a {
  font-size: 16px;
  font-size: 1.6rem;
  color: #9099a3;
  display: inline-block;
}

.auth__footer a:hover {
  text-decoration: underline;
}

.auth__footer a + a {
  margin-left: 10px;
}

.auth__footer a + a::before {
  margin-right: 10px;
  content: '-';
  display: inline-block;
}

.auth__content-item {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  width: 100%;
  padding: 50px 0 50px;
  text-align: center;
}

.form-auth {
  width: 100%;
  max-width: 290px;
  display: inline-block;
  text-align: center;
}

.form-auth li {
  width: 100%;
  display: inline-block;
  position: relative;
}

.form-auth li + li {
  margin-top: 15px;
}

.form-auth__title {
  margin-bottom: 20px;
}

.form-auth__actions {
  margin-top: 0 !important;
}

.form-auth__button {
  margin: 30px 0 15px;
}

.error-validation-messages {
  margin-top: 10px;
  color: red;
  font-size: 12px;
}

.error-validation-messages div + div {
  margin-top: 8px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.check-device__container {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

body.check-android .global {
  min-width: 100% !important;
}

.check-device {
  width: 100%;
  height: 100%;
  background: #003871 url(2c9e4292796cffd2fbcf6eee34e40f47.png);
  background-size: cover;
  color: #fff;
  left: 0;
  position: fixed;
  overflow: hidden;
  text-align: center;
  top: 0;
  z-index: 9999;
}

.check-device::before {
  width: 100%;
  height: 100%;
  background: #003871;
  content: '';
  display: block;
  position: absolute;
}

.check-device p {
  margin-bottom: 40px;
}

.check-device__title {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 80px;
  font-weight: normal;
}

.check-device__title span {
  display: block;
}

.check-device__container {
  width: 100%;
  padding: 20px;
  z-index: 9;
}

.check-device__logo {
  max-width: 200px;
  margin: 0 auto 40px;
  display: block;
}

.check-device__button--google {
  font-size: 14px;
  font-size: 1.4rem;
  width: 200px;
  height: 48px;
  margin: 0 auto 30px;
  padding: 5px 25px;
  background-color: #fff;
  color: #003871;
  display: block;
  line-height: normal;
  vertical-align: top;
  text-transform: uppercase;
}

.check-device__button--google i {
  font-size: 30px;
  font-size: 3rem;
  margin: 5px 5px 0 0;
  color: inherit;
  float: left;
}

.check-device__button--google span {
  padding-top: 2px;
  display: inline-block;
}

.check-device__button--google small {
  text-align: left;
  display: block;
}

.check-device__button--close {
  font-size: 13px;
  font-size: 1.3rem;
  cursor: pointer;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth--forgot ~ p {
  margin-bottom: 30px;
}

.form-auth--forgot .form-auth__actions {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth--forgot-sent {
  padding-top: 30px;
}

.form-auth--forgot-sent .btn--primary {
  margin-bottom: 20px;
}

.form-auth--forgot-sent__icon {
  font-size: 120px;
  font-size: 12rem;
  margin-bottom: 30px;
  position: relative;
}

.form-auth--forgot-sent__badge {
  font-size: 16px;
  font-size: 1.6rem;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 30px;
  height: 30px;
  background-color: #0075ea;
  color: #fff;
  display: block;
  line-height: 30px;
  position: absolute;
  right: -10px;
  text-align: center;
  top: 5px;
}

.form-auth--forgot-sent__alert {
  font-size: 11px;
  font-size: 1.1rem;
  margin: 30px 0;
  text-transform: uppercase;
  color: #ec3237;
}

.form-auth__title--forgot-sent {
  margin-bottom: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth__actions--login {
  margin-top: 30px !important;
}

.form-auth__error-login small {
  display: block;
  margin-top: 30px;
  font-weight: normal;
}

.form-auth__list .btn--try-again {
  margin-top: 20px;
}

.form-auth__title-error {
  margin-bottom: 20px;
}

.auth-btn-register--compact {
  font-size: 16px;
  font-size: 1.6rem;
  text-align: center;
  display: block;
  margin-top: 24px;
  color: #9099a3;
}

.highlighted {
  color: #0075ea;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth--activation {
  position: relative;
}

.loader--activation .loader__content {
  width: 240px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.loader--activation .loader__messages li {
  opacity: 0.2;
  filter: alpha(opacity=20);
  transition: .2s opacity ease-in-out;
}

.loader--activation .loader__messages .active {
  opacity: 1;
  filter: alpha(opacity=100);
}

.form-auth__actions--login {
  margin-top: 30px !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

.settings-nationality .select2-container *:focus {
  outline: none !important;
}

.settings-nationality .select2-container .select2-selection--single {
  font-size: 16px;
  font-size: 1.6rem;
  box-shadow: none;
  border: 2px solid #dde4ea;
  padding: 0 20px;
  height: 40px;
  width: 100%;
  height: 40px;
  background: transparent;
  padding: 0 15px;
  border-radius: 0;
}

.settings-nationality .select2-container--default .select2-selection--single .select2-selection__rendered {
  text-align: left;
  color: #000;
  line-height: 36px;
}

.settings-nationality .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 5px;
  right: 3px;
}

.settings-nationality .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: none;
  width: 12px;
  height: 9px;
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAJCAIAAACJ2loDAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABYSURBVChTjc6xDcAwCABBNoINYWNGcN7CwgpKka8AX2FZPzrI3TOz5oo1ImreCCEiZtaOgZUjT6wbcVLVdi04Mh803BB0P95uCLqIyg1BL0Q8D0ETfbTWA8M6/8qEjwHEAAAAAElFTkSuQmCC);
  background-size: contain;
  background-position: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth--register {
  padding-bottom: 30px;
}

.marketing-terms,
.check-terms {
  font-size: 13px;
  font-size: 1.3rem;
  margin-top: 15px;
  position: relative;
  padding-left: 30px;
  text-align: left;
}

#check-booking-terms__input,
#check-oxford-taken__input,
#check-special-needs__input,
#marketing-terms__input,
#check-terms__input {
  width: auto;
  height: auto;
  cursor: pointer;
  left: 0;
  position: absolute;
  top: 4px;
}

.check-terms__link {
  color: inherit;
  font-weight: bold;
}

.check-terms__link:hover {
  text-decoration: underline;
}

.form-auth--register__button {
  margin-top: 20px;
}

.select--education {
  margin-top: 15px;
}

.auth-btn-sign-in--compact {
  position: absolute;
  top: 24px;
  left: 24px;
  color: #5d6670;
}

.auth-btn-sign-in--compact:hover {
  color: #0075ea;
  transition: color .2s ease-in-out;
}/* ==========================================================================
   CARD
   ========================================================================== */

.form-auth--resend__title {
  margin-bottom: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.social-networks {
  font-size: 13px;
  font-size: 1.3rem;
}

.social-networks i {
  align-self: center;
}

.social-networks__link {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  font-size: 14px;
  font-size: 1.4rem;
  height: 34px;
  margin: 0 auto;
  padding: 0 20px;
  border: 1px solid #aebecd;
  color: #aebecd;
  display: inline-flex;
  vertical-align: top;
  line-height: 28px;
}

.social-networks__link:hover {
  background-color: #0075ea;
  color: #fff;
}

.social-networks__link--google {
  -webkit-border-radius: 18px;
  -moz-border-radius: 18px;
  border-radius: 18px;
  max-width: 100px;
  display: flex;
  height: 34px;
  justify-content: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.saml-login {
  font-size: 13px;
  font-size: 1.3rem;
  margin-top: 15px;
}

.saml-login i {
  align-self: center;
}

.saml-login__link {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  font-size: 14px;
  font-size: 1.4rem;
  height: 34px;
  margin: 0 auto;
  padding: 0 20px;
  border: 1px solid #aebecd;
  color: #aebecd;
  display: inline-flex;
  vertical-align: top;
  line-height: 32px;
}

.saml-login__link:hover {
  background-color: #0075ea;
  color: #fff;
}

.saml-login__link--google {
  -webkit-border-radius: 18px 0 0 18px;
  -moz-border-radius: 18px 0 0 18px;
  border-radius: 18px 0 0 18px;
  margin-right: -4px;
  border-right: 0;
}

.saml-login__link--facebook {
  -webkit-border-radius: 0 18px 18px 0;
  -moz-border-radius: 0 18px 18px 0;
  border-radius: 0 18px 18px 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

.box-logout {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.box-logout {
  padding: 0;
}

.box-logout + .card {
  margin: 30px 0 0 30px;
}

.box-logout .fe {
  margin-right: 10px;
}

.box-logout:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.box-logout {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.box-logout {
  padding: 50px;
  text-align: center;
}

.box-logout p {
  padding-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.box-redirect {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.box-redirect {
  padding: 0;
}

.box-redirect + .card {
  margin: 30px 0 0 30px;
}

.box-redirect .fe {
  margin-right: 10px;
}

.box-redirect:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.box-redirect {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.box-redirect {
  padding: 50px;
  text-align: center;
}

.box-redirect p {
  padding-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.modal-image h3 {
  margin-top: 8px;
  display: inline-block;
}

.modal__image {
  width: 100%;
  display: block;
}

.modal__close {
  padding: 0;
  float: right;
  color: #5d6670;
  cursor: pointer;
  background: none;
}

.modal-body--image {
  padding: 0;
}

.modal--empty-state .modal-body--image {
  padding: 50px;
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.modal-notification__body {
  min-width: 500px;
  padding: 50px 100px;
  display: flex;
  align-items: center;
}

.modal-notification__body i {
  width: 100px;
  height: 100px;
  background: #ddd;
  display: inline-flex;
}

.modal-notification-body__image-content {
  text-align: center;
  margin: 0 0 30px;
  position: relative;
  min-width: 400px;
  min-height: 200px;
  display: block;
}

.modal-notification-body__image-content img {
  width: 100%;
  display: block;
}

.modal-notification-body__image {
  max-width: 500px;
  margin: 0 auto;
}

.modal-notification__title {
  margin: 10px 0 0;
  display: inline-block;
}

.modal-notification__description {
  margin-left: 20px;
  display: inline-flex;
}

.modal-notification__description p {
  font-size: 16px;
  font-size: 1.6rem;
  margin: 0 0 10px;
}

.modal-notification__description .remark {
  font-size: 32px;
  font-size: 3.2rem;
  font-weight: bold;
}

.modal-notification__description .remark small {
  font-size: 23px;
  font-size: 2.3rem;
}

.modal-notification__description ul {
  margin: 0 auto;
}

.modal-notification__description li {
  display: block;
}

.modal-notification__description .btn--upper {
  margin-top: 20px;
}

.modal-notification__icon {
  width: 60px;
}

.modal-notification__footer {
  padding: 40px;
  text-align: center;
}

.modal-notification__footer h5 {
  margin: 0 0 15px;
  font-weight: normal;
}

.share-social li {
  display: inline-flex;
}

.share-social li + li {
  margin-left: 10px;
}

.share-social a {
  width: 32px;
  height: 32px;
  border-radius: 100%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.share-social .share-social__button--twitter {
  background-color: #4386ba;
}

.share-social .share-social__button--facebook {
  background-color: #3a4f83;
}

.share-social .share-social__button--linkedin {
  background-color: #026092;
}

.share-social .share-social__button--whatsapp {
  background-color: #29E46F;
}

.modal-notification {
  max-width: 500px;
}

.modal-notification-body__title,
.modal-notification-body__image {
  margin-bottom: 20px;
}

.modal-notification-body__message {
  margin-bottom: 30px;
}

.modal-notification-footer--promotion {
  text-align: center;
}/* ==========================================================================
   CARD
   ========================================================================== */

.loader__center {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.loader__center {
  padding: 0;
}

.loader__center + .card {
  margin: 30px 0 0 30px;
}

.loader__center .fe {
  margin-right: 10px;
}

.loader__center:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.loader__center {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.loader {
  -webkit-transition: opacity 0.2s ease-out;
  -moz-transition: opacity 0.2s ease-out;
  -ms-transition: opacity 0.2s ease-out;
  -o-transition: opacity 0.2s ease-out;
  transition: opacity 0.2s ease-out;
  opacity: 0;
  filter: alpha(opacity=0);
  position: fixed;
  margin: 0px auto;
  width: 100%;
  height: 100%;
  zoom: 1;
  background: white;
  text-align: center;
  z-index: 999;
}

.loader.active {
  opacity: 1;
  filter: alpha(opacity=100);
}

.loader--modal {
  width: 100%;
  height: 390px;
  height: calc(100% - 80px);
  top: 74px;
}

.circular {
  -webkit-animation: rotate 2s linear infinite;
  animation: rotate 2s linear infinite;
  position: relative;
  width: 100px;
  height: 100px;
  top: 50%;
  margin-top: -50px;
}

.circular.small {
  zoom: 0.6;
}

.small-loader-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  text-align: center;
}

.small-loader-content .circular {
  position: absolute;
  margin-left: -50px;
  top: 50%;
  left: 50%;
}

.path {
  stroke-dasharray: 1,200;
  stroke-dashoffset: 0;
  -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  stroke-linecap: round;
}

.loading-passage-title {
  color: #0475ea;
}

@-webkit-keyframes rotate {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }

  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}

@keyframes dash {
  0% {
    stroke-dasharray: 1,200;
    stroke-dashoffset: 0;
  }

  50% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -35;
  }

  100% {
    stroke-dasharray: 89,200;
    stroke-dashoffset: -124;
  }
}

@-webkit-keyframes color {
  100%, 0% {
    stroke: #d62d20;
  }

  40% {
    stroke: #0057e7;
  }
}

@keyframes color {
  0% {
    stroke: #2a6dcd;
  }

  25% {
    stroke: #ec3237;
  }

  50% {
    stroke: #2a6dcd;
  }

  75% {
    stroke: #ec3237;
  }

  100% {
    stroke: #2a6dcd;
  }
}

.loader-with-message {
  background-color: #e2e8ee;
}

.loader-with-message .loading-wrapper {
  padding: 50px;
}

.loader-with-message .loading-wrapper h2 {
  margin-bottom: 20px;
}

.loader-with-message .loading-wrapper .circular {
  top: auto;
  margin-top: auto;
}

.loader.loader-audio {
  z-index: 9;
}

.loader__center {
  padding: 40px;
}

.loader__center .circular {
  margin-bottom: 20px;
}

.loader--passage {
  background: transparent;
}

.loader--passage .loader__center {
  padding: 70px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.loading-animated {
  height: 100%;
  width: 100%;
  background: #FFF;
  z-index: 9990;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loading-animated__center {
  width: 100%;
  height: 373.46px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.loading-animated__center img {
  margin-top: 70px;
}

.loading-animated__test-container {
  height: 120px;
  padding: 10px 0;
}

.loading-animated__test-container___down {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.loading-animated__text-wrapper {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: .6s ease-out;
}

.loading-animated__text-wrapper:nth-child(2) {
  padding: 15px 0;
}

.loading-animated__text-icon {
  font-size: 32px;
}

.loading-animated___active i {
  color: #1BD171;
}

.loading-animated___under i {
  color: #5D6670;
  opacity: .4;
}

.loading-animated___under .loading-animated__text {
  background: -webkit-linear-gradient(#5D6670, transparent);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.loading-animated__text {
  margin-left: 10px;
  font-weight: bold;
  font-size: 22px;
  line-height: 28px;
  display: flex;
  align-items: center;
}

.loading-progress {
  width: 400px;
  margin-bottom: 70px;
}

.loading-progress__info {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  color: #0075ea;
  margin-bottom: 14px;
}

.loading-progress__title {
  font-size: 16px;
  font-size: 1.6rem;
}

.loading-progress__percentage {
  font-size: 32px;
  font-size: 3.2rem;
}

.progress-bar {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  height: 10px;
  background: #f5f5f5;
  overflow: hidden;
}

.progress-bar__percentage {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: #0075ea;
  height: 10px;
  transition: width .2s ease-in-out;
}/* ==========================================================================
   CARD
   ========================================================================== */

.box-error-message h3 {
  margin-bottom: 50px;
}

.error-confirm {
  width: 100%;
  color: #ec3237;
  bottom: -18px;
  font-size: 10px;
  position: absolute;
  right: 0;
  text-align: right;
  text-transform: uppercase;
}

.error-active {
  position: relative;
}

.error-active i {
  color: #ec3237;
}

.error-active .content-input .bar {
  background-color: #ec3237;
}/* ==========================================================================
   CARD
   ========================================================================== */

.header__container,
.header-internal__content {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.icon-edusynch {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 4px;
  background-color: #ec3237;
  color: #fff;
}

.header {
  -moz-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.02), 0px 2px 2px 0px rgba(0, 0, 0, 0.014), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  width: 100%;
  height: 64px;
  background-color: #003871;
  position: relative;
  z-index: 997;
}

.header__container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.header__wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.header__logo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  margin-right: 30px;
  min-height: 64px;
  vertical-align: top;
}

.header__logo img {
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
  max-height: 64px;
}

.header__profile {
  display: flex;
  line-height: 40px;
}

.header__profile i {
  opacity: 0.6;
  filter: alpha(opacity=60);
}

.user-avatar,
.user-information__name {
  display: inline-block;
  vertical-align: top;
}

.user-avatar {
  margin: 16px 15px 0 0;
}

.user-information__name {
  margin-right: 5px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}

.header__button {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  width: 34px;
  height: 34px;
  margin: 16px 15px 0 0;
  padding: 0;
  background-color: rgba(255, 255, 255, 0.05);
  display: inline-block;
  vertical-align: top;
  line-height: 30px;
  text-align: center;
}

.header__button i {
  color: #fff;
}

.header__button:hover,
.header__button.active {
  background-color: rgba(255, 255, 255, 0.25);
}

.header__button:hover i,
.header__button.active i {
  opacity: 1;
  filter: alpha(opacity=100);
}

.header__logout {
  position: relative;
  display: flex;
  align-items: center;
  padding-right: 20px;
  margin-right: 20px;
}

.header__logout::before {
  content: '';
  display: block;
  width: 1px;
  height: 30px;
  background: #FFF;
  opacity: .3;
  position: absolute;
  right: 0;
}

.header__logout i {
  margin-right: 6px;
  color: #0075ea;
  font-size: 24px;
  font-size: 2.4rem;
}

.header__logout span {
  font-weight: bold;
  color: #fff;
}

.structure-header {
  width: 100%;
  z-index: 997;
  position: fixed;
  display: block;
  top: 0;
}

.header-internal {
  -moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.1);
  width: 100%;
  min-width: 980px;
  height: 64px;
  background-color: #fff;
  border-bottom: 4px solid #edf2f6;
  left: 0;
  position: fixed;
  z-index: 990;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.header-internal h1 {
  font-size: 21px;
  font-size: 2.1rem;
  color: #5d6670;
  font-weight: 600;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.header-internal h1 i {
  font-size: 24px;
  font-size: 2.4rem;
  margin-right: 10px;
  color: #778ea7;
}

.header-internal .btn {
  height: 40px;
  margin: 10px 4px;
  line-height: 40px;
  vertical-align: top;
  text-transform: uppercase;
}

.header-internal .btn-exit {
  font-size: 14px;
  font-size: 1.4rem;
}

.header-internal .btn-exit i {
  margin: -3px 10px 0 0;
}

.header-internal__content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.icon-edusynch {
  margin-right: 10px;
  padding: 0;
  display: inline-block;
  vertical-align: top;
}

.icon-edusynch i {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  font-size: 22px;
  font-size: 2.2rem;
  padding: 10px;
  display: block;
}

@media (max-width: 1040px) {
  .user-avatar {
    margin-right: 5px;
  }

  .user-information__name.\--minify-small {
    display: none;
  }
}

.speed-up-amount {
  font-weight: bold;
  color: #1bd171;
  vertical-align: baseline !important;
}

.speed-up-item {
  position: relative;
}

.speed-up-alert {
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 0;
  width: 6px;
  height: 6px;
  background: #1bd171;
}

.header-info-bar {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  background: #ec3237;
  color: #fff;
  font-weight: normal;
  left: 0;
  padding: 10px;
  position: fixed;
  z-index: 9991;
  text-align: center;
  top: 0;
}/* ==========================================================================
   CARD
   ========================================================================== */

.notification__link {
  position: relative;
}

.notification__link > i {
  margin: 0;
}

.notification__link svg {
  zoom: 0.4;
  margin-left: -10px;
  margin-top: -50px;
}

/* ==========================================================================
   Notification menu
   ========================================================================== */

.notification--wrapper .menu-dropdown {
  margin-left: -6px;
}

.notification--wrapper .menu-dropdown a.notification__content {
  padding: 1.4rem 0 1.4rem 2rem;
}

.notification--wrapper .menu-dropdown .notification__check {
  padding: 10px;
}

.notification__navigation {
  width: 300px;
}

.notification__navigation li span {
  font-size: 1.3rem;
  line-height: 150%;
}

.notification__header {
  background: rgba(93, 102, 112, 0.1);
  border-bottom: 1px solid rgba(93, 102, 112, 0.2);
  padding: 15px;
  padding: 1.5rem;
  line-height: normal;
  cursor: auto;
}

.notification__header button {
  background: none;
  border: 0;
  float: right;
}

.notification__header button:disabled {
  opacity: 0.5;
  filter: alpha(opacity=50);
  background: none;
}

.notification__item {
  padding: 1.4rem 5.5rem 1.4rem 2rem;
  border-bottom: 1px solid #e8e8e8;
  line-height: normal;
  position: relative;
}

.notification__item.notification__item--link {
  padding: 0 5.5rem 0 0;
}

.notification__check {
  width: 40px;
  height: 40px;
  position: absolute;
  top: 50%;
  right: 7px;
  text-align: center;
  margin-top: -20px;
  padding: 0;
  line-height: 38px;
}

.notification__check i {
  margin: 0;
}

.notification__item--message-default {
  cursor: auto;
}

.notification__scroll {
  max-height: 366px;
  overflow-x: auto;
}

.notification__alert {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 8px;
  background: #ec3237;
  border: 1px solid #003871;
}

.notification__content b {
  color: #4B9EFD;
}

.loader--notification {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  position: absolute !important;
  top: 0;
  left: 0;
}

.notification__button {
  margin: 0;
  margin-top: -7px;
  padding: 6px 5px;
  padding: 0.6rem 0.5rem;
}

.notification__button:disabled:hover {
  background: none;
}

.notification__button i {
  margin: 0;
  font-size: 28px;
  font-size: 2.8rem;
}

.notification__date {
  font-size: 10px;
  font-size: 1rem;
  opacity: 0.8;
  filter: alpha(opacity=80);
  width: 100%;
  margin-bottom: 4px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.nav-main__icon {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 4px;
  background-color: #ec3237;
  color: #fff;
}

/* ==========================================================================
  NAVIGATION
  ========================================================================== */

.nav-main {
  margin: 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
}

.nav-main__list > li {
  display: inline-block;
  vertical-align: top;
  position: relative;
  color: #fff;
}

.nav-main__list > li + li {
  margin-left: 15px;
}

.nav-main__list > li > a {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 14px;
  font-size: 1.4rem;
  height: 64px;
  line-height: 64px;
  color: inherit;
  display: block;
  position: relative;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

.nav-main__list > li::before {
  content: '';
  width: 100%;
  height: 3px;
  background-color: #0075ea;
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
}

.nav-main__list > li.active::before {
  display: block;
}

.nav-main__list > li:hover > a {
  color: #0075ea;
}

.nav-main__list .soon a {
  color: rgba(255, 255, 255, 0.5);
}

.nav-main__list .soon:hover a {
  color: rgba(255, 255, 255, 0.5);
}

.nav-main__list .soon:hover span {
  display: block;
}

.nav-main__list .soon span {
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  font-size: 11px;
  font-size: 1.1rem;
  width: 120px;
  padding: 10px;
  color: #fff;
  background: #0075ea;
  display: none;
  left: 50%;
  position: absolute;
  text-transform: uppercase;
  text-align: center;
  top: 50px;
}

.nav-main__list .soon span::after {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(0, 117, 234, 0);
  border-bottom-color: #0075ea;
  border-width: 4px;
  margin-left: -4px;
}

.nav-main__icon {
  margin-right: 10px;
}

.nav-main__icon--simulation {
  background-color: #0075ea;
}

.menu-dropdown--simulation,
.menu-dropdown--cefr {
  min-width: 255px;
}

.menu-dropdown-analysis {
  min-width: 230px;
}

.menu-dropdown--simulation__sub {
  border-top: 1px solid #dde4ea;
}

.menu-dropdown--simulation__sub li {
  border-left: 5px solid rgba(0, 56, 113, 0.1);
}

.link-cefr-rl i,
.link-cefr-rl .badge,
.link-cefr i,
.link-cefr .badge {
  background-color: #ffa500;
}

.nav-main .link-cefr .tooltip-content {
  left: 260px;
}

.menu-dropdown--practice.menu-dropdown--large {
  width: 310px;
}

.menu-dropdown--simulation.menu-dropdown--large {
  width: 290px;
}

.menu-dropdown--simulation.menu-dropdown--xlarge {
  width: 360px;
}

.menu-dropdown-analysis.menu-dropdown--large {
  width: 270px;
}

.menu-dropdown-default.menu-dropdown-wrapper--cefr-rl {
  width: 360px;
}

.menu-dropdown-default.menu-dropdown-wrapper--cefr-rl .nav-main__text {
  max-width: 290px;
}

.menu-dropdown-default.menu-dropdown-wrapper--custom-test {
  width: 390px;
}

.menu-dropdown-default.menu-dropdown-wrapper--custom-test .nav-main__text {
  max-width: 290px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* Tooltip container */

.tooltip {
  position: relative;
  display: inline-block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  white-space: pre-wrap;
  background-color: #0075ea;
  color: #fff;
  text-align: center;
  padding: 8px;
  border-radius: 6px;
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

.tooltip .tooltiptext.right {
  top: -5px;
  left: 105%;
}

.tooltip .tooltiptext.left {
  top: -5px;
  right: 105%;
}

.tooltip .tooltiptext.top {
  width: 120px;
  bottom: 100%;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltiptext.bottom {
  width: 120px;
  top: 100%;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #0075ea transparent transparent;
}

.tooltip .tooltiptext.bottom::after {
  top: -5px;
  left: 50%;
  border-color: transparent transparent #0075ea transparent;
  transform: translate(-2px);
}/* ==========================================================================
   CARD
   ========================================================================== */

.choose-items__content {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.choose-items__content {
  padding: 0;
}

.choose-items__content + .card {
  margin: 30px 0 0 30px;
}

.choose-items__content .fe {
  margin-right: 10px;
}

.choose-items__content:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.choose {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

.choose {
  margin: 20px auto 60px;
  text-align: center;
}

.choose figure {
  margin: 0;
}

.choose__title {
  display: inline-block;
  margin-bottom: 30px;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.choose__title.loading::before {
  content: '';
  width: 100%;
  height: 100%;
  background: #D4D8E1;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 5px;
  z-index: 1;
}

.choose__title.loading::after {
  content: "";
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  position: absolute;
  z-index: 1;
  transform: translateX(-100%);
  animation: loading 1.2s infinite;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
}

.skeleton,
.choose-items {
  display: grid;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.skeleton li,
.choose-items li {
  width: 100%;
}

.skeleton li .image::after,
.skeleton li .title::after,
.skeleton li .subtitle::after {
  content: "";
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  position: absolute;
  z-index: 1;
  transform: translateX(-100%);
  animation: loading 1.2s infinite;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  z-index: 1;
}

.skeleton li {
  display: block;
  height: 250px;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  background: #FFF;
  text-indent: -9999999px;
}

.skeleton li .image {
  display: block;
  position: absolute;
  top: 0;
  width: 100%;
  height: 150px;
  background: #D4D8E1;
}

.skeleton li .title {
  display: block;
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  width: 110px;
  height: 35px;
  border-radius: 5px;
  background: #EAECF0;
}

.skeleton li .subtitle {
  display: block;
  position: absolute;
  bottom: 25px;
  left: 50%;
  transform: translateX(-50%);
  width: 85px;
  height: 12px;
  border-radius: 3px;
  background: #EAECF0;
}

.choose-items__content {
  width: 100%;
  height: 250px;
  overflow: hidden;
  display: block;
  text-align: center;
  position: relative;
}

.choose-items__content--coming-soon {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.choose-items__logo {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  height: 100px;
}

.choose-items__logo img {
  max-width: 200px;
  max-height: 45px;
}

.choose-items__button {
  margin: 0 auto;
  text-transform: uppercase;
}

.choose-items__background {
  height: 150px;
  background-size: cover;
}

.choose-items--toefl {
  background-image: url(f7d2a3acc92288ea9cd7b468e561d5b1.png);
}

.choose-items--ielts-academic {
  background-image: url(c4fceae443ac2bd2fe435ec783665047.png);
}

.choose-items--toeic-lr {
  background-image: url(225194c52be7b7e71066bdd5a55a63dd.png);
}

.choose-items--toeic-sw {
  background-image: url(21d331fe211925a9078b235922cb756c.png);
}

.choose-items--ielts-general {
  background-image: url(98b161283fd0dea341580682f6e83457.png);
}

.choose-items--cefr {
  background-image: url(f71a344d121229917c7263df3e1b7f38.png);
}

.choose-items--cefr-rl {
  background-image: url(d808f32a26c89f9b24e2074d69b1283e.png);
}

.choose-items--cambridge {
  background-image: url(a0b41918da080155bba2f617a9a7040d.png);
}

@keyframes loading {
  from {
    transform: translateX(-100%);
  }

  to {
    transform: translateX(100%);
  }
}/* ==========================================================================
   CARD
   ========================================================================== */

.widget-history {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.widget-history {
  padding: 0;
}

.widget-history + .card {
  margin: 30px 0 0 30px;
}

.widget-history .fe {
  margin-right: 10px;
}

.widget-history:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.clearfix {
  display: inline-block;
  display: block;
}

.clearfix:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}

* html .clearfix {
  height: 1%;
}

.widget-history {
  width: 100%;
}

.widget-history__content {
  margin-top: 0;
}

.default-history {
  min-height: 200px;
  padding-top: 120px;
  background: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAPoAAABfCAYAAADBPdpgAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAShklEQVR42u2de2xc2V3HP56X7RknY8/YibPxOnay2Ve6m8UpJEsBoVKhSlBAoFZCYso/ZaoKFY3gHyoQqBWoEipo+GvVqSpUBgSFaqlYoNqqK1oQbbK7CYu7u9k8Ng/n5diese/YnuedGf44d3a9Tmyfe31fMz4f6apb5z7OvXO/9/zO7/x+v9OHoidJpTMBoN/YIsYWBEJAAOjbsHsTaAE60ADqQA2o5nPZptf3otg9fbs/hcIPGMLeD8SBfUAMe37fKrAKlICVfC7b8PpeFeZRQu9iUulMHzACjALDiJ7aaVaBArCUz2V1r5+BQg4l9C4klc70A+PAGMIU94I2UATm87nsqtfPRLE9SuhdRCqdGQAmgCT++u1WgTv5XHbF64YoHo6fXhbFFqTSmTDwKKIH9/NvtgrcyOey6143RPFB/PzSKIBUOjOOEHnQ67aYYAGYU2N4/6CE7lMMM/0xYMjrtlikAVzL57LLXjdEoYTuS1LpzAFgCne86E5zH7iZz2VbXjdkL6OE7iOMufAp4IBDl2gggmKaxtZGDAk6gTQRh667DlzO57I1h86v2AEldJ+QSmdCwBOIYBc7qCGCXEpABRHltu2Y2fjQDBjbPkQATsym9jSAS/lcds3+p6fYCSV0H5BKZyLA0wiB7YYKsIQIZrGl9zQ+QJ2gnPguT9cCrqhxu/sooXuM4XR7Gutmcydw5a7T01rGB+kgIljH6ixAG2HGK7G7iBK6hxjCOYFIPLHCIiJQpepyu4MIwT+Ctcg8JXaXUUL3CMMkPgEMWjh8DbjudWCKEcgziQjkMUsLuKjCZ91BCd0DjGSUpxDOLjO0EIEo817fw6b72YeY8zdrmejAm25bJB/g97/3PHAS+CHwceDr/NXHCp61xyF6YZ62G5nCvMgrwI/9JnIAo1eeRWS1mSEEPG54+73iXcRv8evAPWDFw7Y4hhK6y6TSmVHE+NYMy4ier+J1+7cin8s287nsFWDO5KFR4KiHTR9AOELbCMGHPWyLYyihu4iRXjpt8rAFhOOqKyq95HPZu8AVhHBkGTU+gF4QB94GvoYI7LHqGPU1aozuIql05mnMmez38rnsTa/bbfFeR4DHkX/HdOD/VAUbZ1A9uksY8etmRL7QrSIHMKbOrpg4JIR5a0chiRK6Cxjzzo+aOGQFuO51u3dLPpctAmY+VolUOmPWSamQQAndHSaQd/JUEWGiZsa4viWfy95DBPbIMuV1m3sRr+qN7RmMoBJZL3snYsx2x5sxhbXVh73lcBrpdURevUxwUDSVziTzuWzPzWV7yZ7p0ZdmTg8szZz24sP2CPLP+VY+ly071I5p4MNbbJNOPgDjI3IVeU/8hJPt2Yv0tNCXZk4HlmZOf2Rp5vQBIA38vJvXN8JcZXvzCiJgoycxwnXvS+4+aHjtFTbR66Z7GPgp4GOIaZ6rLl//APIf0+u9Mi7fhluICrYy/opDiEAhhQ30dI8+euFcDfjGhj99cmnmtJteXdlKMcv5XLbkYrs8wfA93Jbcfb+RwquwgV7v0UEEbVSB/Ib/dhwj0UP2RZV9+XuBBeAwcvn3YwgroOsoaOUJ4AVErQGnWQH+OBmPfmerHSwLvaCVA8Bx/FultJiMR68DrwNvjl44twbcdfH6Scn9VrxON3WTfC7bTqUz94AjEruP0qVCB/4S+GUXr/dPBa18KBmPPrRUlyWhF7TyI8DLwIdcvBEr7fwu8Imtbt5hEpL7+S4bzQUWEAFEOw0d+1PpTNTBmQgncarA51bE2EbPVsfoGXwucoNfBH7L7Yum0pkocqZpA9Dcbp/XGGP1ouTuw1631yJ/hijM6RZfScajK1v9o1XTvZvG9l60VbaIYmEPeNq3YhFhmu9EHHeHXLaQjEdfKWjlw4jh7XYd6m8Dn9/hdDrws4iO4WHMJ+PRO9udwKoIvgp8GvlxqFdcAv7Rg+vKlmzey9FfJURt+Z2KTO5LpTN9bn8QC1p5AGtlvjZzY5t/60MuWCmEyNv/323a+7C4g9VkPKp3TmCaZDx6qaCVjwPPs3Pd7xPAn9rwwDbzd8C/bvPvK8B/J+NRL8oUyQi9haj9ticxnHIlRCnp7QggBOfKOL2glZ8BcsAZb5/QA7xi4Ri9oJVfBD5r2axNxqPLwH/stF9BKzu1OseNZDz6zw6d2zJGbLtMQMjqHjbbO8gIHURn4rjQC1o5DLyE3IxANxACPgW0QsYNPg98BuEJtbsYxSmHbuILRrvtFEsbuAN8LRmP/tDiOWTNPVX9VP4Z2GFCy/AsvSPyjfxqqKCVfwV4ke5alhejvb/g0LlTBa38qWQ8+qKFY2WDZHxb/81FZJ+BqQi5pZnTI4iKrt8avXDOTMWaXvWZLASAL9N9IneaIPDnFo+VrTm254VuTLPJCFF6FRsjQ/EwYh27xNLMaekp5GQ8egP4utfPxWbawBdDiHrcigex+lxk/R7e1TL3FxV29mmYqcz6e7xfsutziFz4b5g4Pg38J/ARHuwAk4iy0GaGt2vANxEzDG5TAf4lGY/+IARcwH8eRj9w3uJxMi+l04UeugkZAZgR+rcQOQ0/A/w7JstPJ+PRFvD3xvYABa38VcTHQJbfScajXkzxfoAA4gu456KzdqCEeC5WkPnaK5G/jy6xj7T5PXrh3BxwEagjchxkc+Bl+Y7J/b9t8/UtEUrGo68VtPIJ4DeRi1TyE/sQswVWViJ9kYdXKV0CvpmMR60mU8j4O7qiRrtL2P7RG71w7s7SzOkvj14458T0pdnQ71PA/zjQDlOEAIzwua943RgrFLTyDeAvTB72UjIe/Y3tdkilM5OIMlBO0J9KZ6wMl5aAd9X8+86YFXlBK4cQ4/LtklEeBb5gsil/W9DKX2Rr52sFeDUZjy44+Ty6KWZ9K17EvNB3nDbL57JzqXQGnBO7WZwU+UgqnVnJ57IrHtyX58VPjHDX7wOnHTj9UXZ2BlYKWvnXkvHod526R88fsg0csnCMVFBEPpedwx8JFU735P3Ak6l05nFj2Sg3kelsnPZp/BLOiFyWQcxbCqboaqEXtPIBIGvh0M8XtPJJmR19IHY3zfUEcDKVzky4uMKpjE/D6WWa/LCwoqNt8KXpXtDKn0Akwuy0yuYgJqOmDJLA+YJW3ilf+BrwB8l49AcemfF2ily2Vwwgyi2PpdKZG8bSSk4iE97qtNC/DfwX8HMOX2crKsCXnLyA74Re0MrTiLlQK550MwTZOaHiFPBSQStPJ+NRt8fsdvfkNxFTToeRs+T6gSdS6cwKcCOfy9oe4GMsVSXTk9XtvvZGkvFotaCVP4qIJ3Errr5DC/hxMh41s5qNaXy3mmpBK38ac5FMbvDxZDz6Mjjuje/gmLmeSmciCB+FmVoCbUTN+dt2Bvqk0pkh5Kar7hpDKIVF/DhGv+h1AzahA+90/o8LY3ZHx+T5XLaez2WvINYEl42370N83J5LpTN2FhuRLdCx5/MCdovvhJ6MR18D/hCHzTVJKsDvJuPRD6wI6qDYXXO8GXXkZxEmvWwATwQ4nkpnnk6lM3aYuLI19vdMlVyn8J3p3qGglQexNnVmJ4vJeHTLnGmbzXjPgmGMYhlHMBcZ2UZUsL1tZVHIVDrTh1j3bSevewt4TQUJ7Q7fCr1bsEnsvoh4MxadmGLn8mAbaQBz+VzWlDMplc7EgackdtXyuazfhnNdh+9M927DBjPeFyI37mUVeBOR2imTbALCa37EWFDSDGOS+6mEKxtQBSdsYPb8We3kqTMB5J1LHXwj8g33wuz5s+snT51ZQLwfMivx3DQ+ElIY02rHkLMob86eP+v0PHrPo4RuExbEvgBc85PIN91Pa/b82ZWTp84sI0z5reIa1vO57DUz5z556sw4ckUha/lctluXZPIVSug2YkLs9/O57PXZ82e9brLMPTVmz59dOHnqTM24r83vzJXZ82elZ0gMJ9xx5N69+7Pnz/b8KrNuoMboNiMxZr+fz2Wve91OC/e1CLyB8LR3rJBFMya7wQHkox4djRbbS/SU171W10eAj+LsCjI68KP+SGhbT/AW3viuFPlD7i2KyM2+ls9lpcfPxtj8OeTCXkv5XPZtr++1V+gZodfq+gTwGjDuwuVawGf6I6G/2W6nTWLvCZHvhlQ6M4X873PJhYSaPUMvme4Z3BE5iOe2Yzlow4y/jxI5qXQmBhyU3L2iRG4vvste2wVRl68nG1Ryc69XfDVy2x9D3oK87XWbe42uE3qtrh8EPsmDQpNdqtguXpDZaa+L3GAa+fTPcj6X7dUVUzyjq4Req+tTiHG4W9VqbwIvb/qbjqjq+Q9eP49uIJXOHEI+Cg62X2ZYYZGuEjrwWdwtST0MfK4/ElK9sgVS6UwCc4sWFo2sOoXNdJszzu3qHxE8fEapdCZuBJh0Hal0ZgQRGCOLjoixVzhAtwn9BdxNcvjr/khINrnDVlLpzEFEdtdxFws12tX2JGJZJDMfqRtm5uQV5ui63qJW148gFnd3MiimDrzaHwn9mxf3aIh8esOfVhHzyp58dEy2/RFg0uRhS/lc9qrXbe9luk7ovc5DRN6hBlzJ57JrXrdxi3YHEVV7zX6Ay8CbanbCWZTQfcQ2Iu/QRswx3/VT1ptRsOIx5NeG76AjRK6WkHYYJXSfsJPIA4FA3+DgQCgSjgRjsWjj2WdO3P7ITz9fRmSBdbbAhq3P+JvMb9xG1I1rI8J7O1vzIVsDIdDGH/3Jl0IIM93M9FmHFnDRQlKMwgJK6D4glc4cDIdDx6KD0fDA4EB4cHAw0h+JhMPhcDgSDoeDwWAoEAw8kNY5MjysPfnE4wtjY6Ou9ojVajX4zqXLiVu3byfqtUa73hDU6vVGpVKpVyvVRrlSbjQa+lbmeBu4rMJc3UMJ3WXm5oshRLjuIDBYr9dj33vl+x/Sm7rlqcN4fH/p2PT00uHDh9f7HPxFS6XV8JWrVxP37y8k9WZzx3zyVrPV1HW9Ua3VapVqtVZeL9e0klap1eoXlcjdRQndYebmi1FEOaaYsT0wjtVKpfC5V1+fqlarVpaXeo9IJFI/MDa2PDk5oY0mkzU72l+uVII3b87tn59fGF5dW5UpK7UlgUCg9dSTT9w6dnR6EVHCeR1YmxxPlO1oq2JrlNBtxuixhxGx90NIRh9WKtXgj86+emRtfc1MBdYtCYdDjX379q0nhkfW48P7q4mRkdrg4OC2ZZl1XQ8Ui8sRrVTqX15eiWqlUqxSqdgSpBQKhfSTzz5z8/Ajhx4mah1YQ8RIrEyOJ3w/jdhtKKHbwNx8sbOOWxLRa1t6rs1ms++11y8cWlhcdCRGIBQK6aFgsBkIBFqBYLAZ6OtrN1utYKvZDOhNPdho6I6s6Dk4OFj5yVMzc8PDcZmSU21ET18AlifHE6ZrxiseRAl9F8zNF/sROfAJbIwyfOfS5eGr71473Gq1uioi7mGMjY0WP3xq5l44ZClfoAUUgfnJ8YQtQ5G9ihK6Bebmi2HEqqQJHHqGxeXlyBtvzE6sra/bYsq7TTgU0h8/fvzOsWPTdiSptBGCvzM5nlBhshZQQjfJ3HxxGLGaieMVdNvtdt9bb19MzM3dOijj5fYLo8nk8k889+y9nXwCFmgCNybHEyte32O3oYRugrn5YoLtI9ccYX19PTT75lsHl5aWEm3fxMM9SCwWKz/91BN3D42PO7366fXJ8UTR6/vtJpTQJZmbL0aAE3iY8VcoFvvfuXR5rFhcHm6327757WLRaPno0emF6akjbkW5tYC3JscTflhxtyvwzcvid+bmiwcQJY49RyuVwpcvX00uLi2N6LruSfGQvr6+9nA8XpqeOlKYmDjsxbLGtybHEwte3Hs3ooQuiZ+E3qHZbPZdv35j/735+/EVTdvvRi8/FIutj42NaUenp7RYLOrlfLcSugmU0CXxg+m+HQ1dD9y+fSe2uLg0VCqVYpVqZdCO8XwkEqkPDcXKyURi7dFHJ1aHYjE/BLMo090kSugm8MoZZwVd1wMrmhYulVYjlUo1XK1Ww7quB/SmHmw1W4GW0fv3AYFgoBUKhprhcKgZifTrAwP9+r6hofrwcLw+MDDgx4AV5YwziRK6SdycXlM8gJpes4gSugXcCJhRfIA2sAzcVgEz1lAv6S5wKgRW8R4qBNYmlNBtwK6kFsV7rKGSWmxFvZA2YzVNdY+j0lQdRgndYTYVnhhCLAqx16kjhK0KT7iEErrLGI68wU1bP73pxW8iylRXNm7KoeY+Sug+wTD5BxCij2zawvjzQ9CpClvftNWAqjLB/YMSepcwN1/sQwg+xPvC37x1Sj13Pgpmyz1j/K9UuefJ8YSPc+kUG/l/axo7Uv6Pc8QAAAAASUVORK5CYII=) center center no-repeat;
  text-align: center;
}

.default-history span {
  font-size: 16px;
  font-size: 1.6rem;
}

.default-history span b {
  display: block;
}

.widget-history-list {
  overflow: auto;
}

.widget-history-list .ngscroll-scrollbar {
  background-color: #5d6670 !important;
}

.widget-history-item--simulation {
  background: rgba(93, 102, 112, 0.1);
  color: #5d6670;
}

.widget-history-item--simulation .widget-history-item__description {
  margin-top: 0;
}

.widget-history-item--simulation .legend-simulation {
  display: inline-block;
}

.widget-history-item {
  width: 100%;
  padding: 15px 20px;
  display: inline-block;
  vertical-align: top;
  position: relative;
  cursor: pointer;
  -webkit-transition: background 0.2s ease-in;
  -moz-transition: background 0.2s ease-in;
  -ms-transition: background 0.2s ease-in;
  -o-transition: background 0.2s ease-in;
  transition: background 0.2s ease-in;
}

.widget-history-item + li {
  border-top: 1px solid rgba(221, 228, 234, 0.2);
}

.widget-history-item .fe-icon {
  font-size: 16px;
  font-size: 1.6rem;
  margin-right: 10px;
  float: left;
}

.widget-history-item:hover {
  background: rgba(93, 102, 112, 0.05);
}

.widget-history__footer {
  padding: 15px;
  border-top: 1px solid #dde4ea;
  text-transform: uppercase;
  text-align: center;
}

.widget-history__button {
  font-size: 11px;
  font-size: 1.1rem;
  height: 32px;
  line-height: 30px;
  padding: 0 20px;
  outline: none;
}

.widget-history-score {
  width: 62px;
  height: 62px;
  margin-right: 14px;
  display: block;
  position: relative;
  text-align: center;
  float: left;
}

.widget-history-score input {
  font-size: 12px !important;
  color: #5d6670 !important;
  margin-top: 18px !important;
}

.widget-history-score__point {
  font-size: 18px;
  font-size: 1.8rem;
  margin: 12px 0 0 5px;
  color: #5d6670;
  display: inline-block;
  font-weight: bold;
}

.widget-history-score__name {
  font-size: 10px;
  font-size: 1rem;
  padding: 3px 10px;
  bottom: -5px;
  line-height: 100%;
  left: 0;
  position: absolute;
  text-transform: uppercase;
}

.widget-history-score__name.custom-score {
  bottom: 0px;
  left: 50%;
  transform: translate(-50%);
}

.widget-history-score__name--simulation {
  left: -6px;
}

.widget-history-item__description {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

.widget-history-item__description span:first-child {
  padding-top: 8px;
}

.widget-history-item__description span {
  width: 100%;
  display: block;
}

.widget-history-item__description span + span {
  margin-top: 4px;
}

.widget-history-item--status-pending .widget-history-score__point,
.widget-history-item--status-pending .widget-history-score__name {
  visibility: hidden;
}

.widget-history-item--status-pending .widget-history-score__text {
  visibility: visible;
  display: block;
}

.widget-history-score__text,
.widget-history-score__name.practice,
.widget-history-score__name.pending {
  font-size: 11px;
  font-size: 1.1rem;
  color: #5d6670;
  bottom: 6px;
  left: 0;
  width: 100%;
  position: absolute;
  font-weight: bold;
  text-transform: uppercase;
}

.widget-history-score__name.practice,
.widget-history-score__name.pending {
  padding: 0;
}

.widget-history-score__text {
  visibility: hidden;
  display: none;
}

.widget-history-item__title {
  font-weight: bold;
  text-transform: uppercase;
}

.widget-history-item__date {
  font-size: 12px;
  font-size: 1.2rem;
  opacity: 0.5;
  filter: alpha(opacity=50);
}

.widget-history-item__date svg {
  margin-top: 2px;
}

.widget-history-item--score-good .widget-history-score {
  border-color: #11a06f;
}

.widget-history-item--score-good .widget-history-item--score-point {
  color: #11a06f;
}

.widget-history-item--score-low .widget-history-score {
  border-color: #ec3237;
}

.widget-history-item--score-low .widget-history-item--score-point {
  color: #ec3237;
}

.widget-history-item--score-medium .widget-history-score {
  border-color: #fac612;
}

.widget-history-item--score-medium .widget-history-item--score-point {
  color: #fac612;
}

.widget-history-item--score-pending .widget-history-score {
  border-color: #dde4ea;
}

.widget-history-item--score-pending .widget-history-item--pending-text {
  color: #9099a3;
}

/* ==========================================================================
   MEDIA
   ========================================================================== */

@media (max-width: 1020px) {
  .history-timeline li {
    padding: 15px;
  }
}/* ==========================================================================
   CARD
   ========================================================================== */

.widget-leaderboard {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.widget-leaderboard {
  padding: 0;
}

.widget-leaderboard + .card {
  margin: 30px 0 0 30px;
}

.widget-leaderboard .fe {
  margin-right: 10px;
}

.widget-leaderboard:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.widget-leaderboard {
  margin-bottom: 30px;
  display: block;
  position: relative;
}

.loader--leaderboard {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
}

.widget-leaderboard-nav li {
  display: inline-block;
  position: relative;
}

.widget-leaderboard-nav li + li {
  margin-left: 15px;
}

.widget-leaderboard-nav li::before {
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  content: '';
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background-color: #0075ea;
}

.widget-leaderboard-nav li.active::before,
.widget-leaderboard-nav li:hover::before {
  opacity: 1;
  filter: alpha(opacity=100);
}

.widget-leaderboard-nav__link {
  font-size: 12px;
  font-size: 1.2rem;
  color: inherit;
  display: block;
  text-transform: uppercase;
}

.widget-leaderboard-list li {
  width: 100%;
  display: inline-block;
  vertical-align: top;
  padding: 15px 30px 15px 15px;
}

.widget-leaderboard-list li + li {
  border-top: 1px solid #e2e8ee;
}

.widget-leaderboard-list li > span {
  display: inline-block;
  vertical-align: middle;
}

.widget-leaderboard-list li > span + span {
  margin-left: 10px;
  max-width: 150px;
}

.widget-leaderboard-list .me {
  background-color: rgba(226, 232, 238, 0.3);
  font-weight: bold;
}

.widget-leaderboard-list .me .eaderboard-list__pts {
  color: #0075ea;
}

.widget-leaderboard-list__position {
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: bold;
}

.widget-leaderboard-list__avatar {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 24px;
  height: 24px;
  background-color: #e2e8ee;
  overflow: hidden;
}

.widget-leaderboard-list__name {
  font-size: 13px;
  font-size: 1.3rem;
}

.widget-leaderboard-list__pts {
  margin-top: 4px;
  font-weight: bold;
  float: right;
}/* ==========================================================================
   CARD
   ========================================================================== */

.referral-code {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.referral-code {
  padding: 0;
}

.referral-code + .card {
  margin: 30px 0 0 30px;
}

.referral-code .fe {
  margin-right: 10px;
}

.referral-code:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.referral-code {
  margin-bottom: 30px;
  display: block;
  position: relative;
}

.referral-code__content {
  padding: 15px 20px;
}

.referral-code_your-referral {
  display: flex;
  margin-top: 32px;
  margin-bottom: 10px;
  flex-direction: column;
  align-items: flex-start;
}

.referral-code__url {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: #F2F8FE;
  font-weight: bold;
  padding: 15px;
  margin-top: 10px;
  margin-bottom: 8px;
  display: flex;
  justify-content: space-between;
  align-self: stretch;
}

.referral-code__url,
.referral-code__url i::before {
  color: #0475EA;
}

.referral-code__copy {
  color: #ADB1B6;
  display: inline-block;
  text-align: right;
  font-weight: bold;
  font-size: 11px;
  align-self: flex-end;
  text-transform: uppercase;
}

.referral-code_share-title {
  font-weight: normal;
  margin-bottom: 10px;
}

.referral-code_share .share-social a {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.referral-code_share .share-social li + li {
  margin-left: 5px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.widget-license {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.widget-license {
  padding: 0;
}

.widget-license + .card {
  margin: 30px 0 0 30px;
}

.widget-license .fe {
  margin-right: 10px;
}

.widget-license:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.widget-license {
  width: 100%;
  margin-bottom: 30px;
}

.widget-license__description {
  padding: 15px 20px;
}

.widget-license__header b {
  color: #0075ea;
}

.widget-license__icon {
  font-size: 32px;
  font-size: 3.2rem;
  margin-right: 10px;
}

.widget-license__description,
.widget-license__remaining {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.widget-license__remaining {
  max-width: 130px;
}

.widget-license__remaining b {
  font-size: 48px;
  font-size: 4.8rem;
  width: 60px;
  color: #7ed321;
  margin-right: 10px;
}

.widget-license__icon {
  display: inline-block;
  vertical-align: top;
}

.widget-license__no-counter {
  justify-content: center;
}

.widget-license__no-counter .widget-license__remaining {
  display: none;
}

.widget-license__class {
  display: block;
}

.widget-license--call {
  margin: 0 0 30px 0;
  background-color: #fff;
  color: #5d6670;
  text-align: center;
}

.widget-license--call p {
  line-height: normal;
}

.pending-license-school,
.pending-license-class,
.pending-license-group {
  margin-top: 8px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.widget-download-certificates {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.widget-download-certificates {
  padding: 0;
}

.widget-download-certificates + .card {
  margin: 30px 0 0 30px;
}

.widget-download-certificates .fe {
  margin-right: 10px;
}

.widget-download-certificates:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

.widget-download-certificates {
  width: 100%;
  margin-bottom: 30px;
}

.widget-download-certificates__link {
  padding: 15px 20px;
  display: flex;
  align-items: center;
  font-weight: bold;
  font-size: 1.6rem;
}

.widget-download-certificates__link--report {
  color: #0075ea;
}

.widget-download-certificates__link--report:hover {
  color: #51a1e8;
}

.widget-download-certificates__link--certificate {
  color: #003871;
}

.widget-download-certificates__link .fe-icon {
  width: 3.2rem;
  height: 3.2rem;
  margin-right: 6px;
  display: flex;
  align-items: center;
}

.widget-download-certificates__link .fe-report {
  font-size: 2.4rem;
}

.widget-download-certificates__link .fe-certificate {
  font-size: 3.2rem;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   PERFORMANCE-DATEPICKER
   ========================================================================== */

.es-datepicker__button {
  background: none;
  width: 26px;
  height: 20px;
  color: #0075ea;
}

.es-datepicker__button,
.es-datepicker__input {
  display: inline-block;
}

.es-datepicker__input {
  border-bottom: 1px solid #ccc;
}

.es-datepicker__input:hover,
.es-datepicker__input:focus {
  border-color: #0075ea;
}/* ==========================================================================
   CARD
   ========================================================================== */

.performance-chart {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.performance-chart {
  padding: 0;
}

.performance-chart + .card {
  margin: 30px 0 0 30px;
}

.performance-chart .fe {
  margin-right: 10px;
}

.performance-chart:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   PERFORMANCE-CHART
   ========================================================================== */

.performance-chart {
  width: 100%;
  min-height: 460px;
  margin-bottom: 30px;
}

.box-performance-main {
  width: 100%;
  margin-left: 0;
  display: inline-block;
}

.performance-chart__title {
  font-weight: bold;
  display: inline-block;
  vertical-align: middle;
  line-height: 130%;
}

.performance-chart__title small {
  display: block;
  font-weight: normal;
}

.chart-line {
  padding: 20px;
  max-height: 390px;
}

.chart-nodata {
  padding: 50px 20px 0;
  text-align: center;
}

.chart-nodata img {
  margin-bottom: 20px;
}

.chart-nodata small {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: normal;
  display: block;
}

.performance-chart-filter {
  float: right;
}

.performance-chart-filter li {
  font-size: 11px;
  font-size: 1.1rem;
  float: left;
  text-transform: uppercase;
  position: relative;
}

.performance-chart-filter li + li {
  margin-left: 10px;
}

.performance-chart-filter .input {
  width: 136px;
}

.performance-chart-filter .input + .input {
  margin-left: 5px;
}

.performance-chart-filter input {
  font-size: 12px;
  font-size: 1.2rem;
  width: 84px;
  min-width: 50px;
  height: 30px;
}

.performance-chart-filter .btn {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  font-size: 12px;
  font-size: 1.2rem;
  padding: 0 20px;
  margin-top: 2px;
  height: 32px;
  background-color: #fff;
  border: 1px solid #e2e8ee;
  color: #5d6670;
  line-height: normal;
  text-transform: uppercase;
}

.performance-chart-filter .btn:hover {
  background-color: #0075ea;
  color: #fff;
  border-color: transparent;
}

.performance-chart-filter .btn-clear-filter {
  font-size: 11px;
  font-size: 1.1rem;
  width: 32px;
  height: 32px;
  margin-top: 13px;
  padding: 0;
  color: #5d6670;
  display: block;
  line-height: 28px;
  text-align: center;
}

.md-focused {
  background-color: transparent !important;
}

.md-default-theme .md-calendar-date.md-calendar-date-today .md-calendar-date-selection-indicator,
.md-calendar-date.md-calendar-date-today .md-calendar-date-selection-indicator {
  border-color: #0075ea;
}

.md-default-theme .md-calendar-date.md-calendar-selected-date .md-calendar-date-selection-indicator,
.md-calendar-date.md-calendar-selected-date .md-calendar-date-selection-indicator,
.md-default-theme .md-calendar-date.md-focus.md-calendar-selected-date .md-calendar-date-selection-indicator,
.md-calendar-date.md-focus.md-calendar-selected-date .md-calendar-date-selection-indicator {
  background-color: #0075ea;
}

.md-datepicker-open .md-datepicker-calendar-icon {
  color: #0075ea;
}

.md-datepicker-input-mask {
  display: none !important;
}

.md-datepicker-input-container {
  position: absolute !important;
  margin-left: 0 !important;
  top: 15px;
}/* ==========================================================================
   CARD
   ========================================================================== */

level-test-breakdown .widget-breakdown__content {
  padding: 2rem;
}

level-test-breakdown .widget-breakdown--simulation {
  margin-top: 0;
}

.widget-breakdown__values.cefr-breakdown li {
  width: calc(33.333% - 3px);
  text-align: center;
}

.widget-breakdown__values.cefr-breakdown label {
  margin-bottom: 8px;
}/* ==========================================================================
   CARD
   ========================================================================== */

custom-test-breakdown .widget-breakdown__content {
  padding: 2rem;
}

custom-test-breakdown .widget-breakdown--simulation {
  margin-top: 0;
}

custom-test-breakdown .widget-breakdown--simulation ~ .widget-breakdown--simulation {
  margin-top: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.totalizers {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  box-shadow: 1px 2px 4px 0px rgba(0, 0, 0, 0.05);
  -webkit-transition: box-shadow 0.3s ease-in;
  -moz-transition: box-shadow 0.3s ease-in;
  -ms-transition: box-shadow 0.3s ease-in;
  -o-transition: box-shadow 0.3s ease-in;
  transition: box-shadow 0.3s ease-in;
  background: #fff;
  display: inline-block;
  vertical-align: top;
}

.card-content.totalizers {
  padding: 0;
}

.totalizers + .card {
  margin: 30px 0 0 30px;
}

.totalizers .fe {
  margin-right: 10px;
}

.totalizers:hover {
  box-shadow: 0 3px 13px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   TOTALIZERS
   ========================================================================== */

.totalizers {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  width: 100%;
  margin-top: 0;
  margin-bottom: 30px;
}

.totalizers > .title {
  margin-bottom: 20px;
  font-weight: bold;
  display: block;
}

.totalizers__overview {
  width: 100%;
  display: block;
  background-color: rgba(0, 0, 0, 0.02);
}

.totalizers__overview-itens,
.totalizer-results,
.totalizers__content {
  display: grid;
}

.totalizers__overview-itens,
.totalizer-results {
  grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));
  align-items: center;
}

.totalizers__overview-itens {
  font-size: 16px;
  font-size: 1.6rem;
  padding: 30px 0;
  text-align: center;
}

.totalizers__overview-itens div {
  margin-top: 10px;
  font-weight: bold;
}

.totalizers__overview-itens i {
  color: #0075ea;
  margin-right: 10px;
}

.totalizers__content {
  grid-template-columns: 200px 1fr;
  padding: 36px 26px;
  width: 100%;
}

.totalizers__content--simulation {
  grid-template-columns: 1fr 1fr;
}

.totalizer__content--practice-noscore {
  grid-template-columns: 1fr;
}

.totalizer-chart {
  color: #5D6670;
}

.box-totalizers-small {
  min-height: auto;
  height: auto;
  overflow: hidden;
}

.info-analysis-item {
  margin-bottom: 20px;
  display: block;
}

.info-analysis-item span {
  font-size: 14px;
  font-size: 1.4rem;
  display: block;
  font-weight: bold;
}

/*
   BOX ANALYTICS TOEFL
   ========================================================================== */

.analytics-score {
  width: 100%;
  margin: 0 auto;
  display: block;
  position: relative;
  text-align: center;
}

.analytics-score .graph {
  margin: 0 auto;
  height: 100px;
  display: block;
  overflow: hidden;
}

.analytics-score .graph--pending {
  position: relative;
}

.analytics-score .graph--pending::before {
  width: 48px;
  height: 48px;
  line-height: 48px;
  line-height: 4.8rem;
  background: white;
  color: #0075EA;
  font-size: 24px;
  content: "\F150";
  font-family: 'edusynch-icon';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 9;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.analytics-score input {
  font-size: 24px;
  font-size: 2.4rem;
}

.analytics-score.analytis-score--percentage input {
  font-size: 18px;
  font-size: 1.8rem;
}

.analytics-score .legend {
  font-size: 10px;
  font-size: 1rem;
  display: block;
  margin-top: -18px;
  text-transform: uppercase;
}

.analytics-score .legend-session {
  margin-top: 0px;
}

.analytics-score--simulation {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
}

.analytics-score--simulation .legend-score {
  font-size: 18px;
  font-size: 1.8rem;
  font-weight: bold;
  text-align: left;
  margin-top: 0;
  padding-right: 20px;
}

.analytics-score--cefr-rl .legend-score {
  margin-left: 20px;
  text-align: center;
}

.legend-score {
  text-align: center;
  font-size: 12px;
  margin-top: 10px;
}

.totalizers-results {
  width: 100%;
  padding: 20px 0;
}

.totalizers-results b {
  font-size: 21px;
  font-size: 2.1rem;
  display: block;
  margin-bottom: 14px;
}

.totalizers-results i {
  color: white;
  background: black;
  width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: 50%;
  text-align: center;
  margin-right: 6px;
  display: inline-block;
  font-style: normal;
}

.totalizers-results .correct-questions {
  background: #1BD171;
}

.totalizers-results .wrong-questions {
  background: #ec3237;
}

.totalizers-results .skipped-questions {
  background: #fac612;
}

.totalizers-results .independent-questions {
  background: #03B5FF;
}

.totalizers-results .integrated-questions {
  background: #2a6dcd;
}

.totalizers-results .part-one-questions {
  background: #2ccf75;
}

.totalizers-results .part-two-questions {
  background: #2a6dcd;
}

.totalizers-results .part-three-questions {
  background: #03B5FF;
}

.totalizers-results .task-one-questions {
  background: #2a6dcd;
}

.totalizers-results .task-two-questions {
  background: #03B5FF;
}

.totalizers-results li {
  position: relative;
  padding: 0 20px;
  text-align: center;
}

.totalizers-results li:not(:first-child)::before {
  opacity: 0.5;
  filter: alpha(opacity=50);
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: 0;
  background: #D8D8D8;
  width: 1px;
  height: 100%;
}

.totalizers__action {
  -webkit-border-radius: 0 0 4px 4px;
  -moz-border-radius: 0 0 4px 4px;
  border-radius: 0 0 4px 4px;
  width: 100%;
  padding: 22px 0;
  display: block;
  background-color: rgba(0, 0, 0, 0.02);
}

.totalizers__action > div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  -moz-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -moz-align-items: center;
  align-items: center;
}

.totalizers__action > div p {
  margin: 0;
}

.totalizers__action > div .btn {
  margin-left: 15px;
}

.totalizers-msg {
  display: grid;
  grid-template-columns: 98px 1fr;
  border-left: 1px solid #ccc;
  padding-left: 30px;
  align-items: center;
}

.totalizers-msg__icon,
.totalizers-msg__icon i {
  padding: 0 !important;
  margin: 0;
}

.totalizers-msg__icon i {
  padding: 0;
  margin: 0;
  background-position: center;
  background-repeat: no-repeat;
}

.totalizers-msg__title {
  margin-top: 0;
  margin-bottom: 10px;
  color: #0475ea;
}

.msg-keep,
.msg-low,
.msg-medium,
.msg-congratz {
  padding: 15px;
  -webkit-align-self: center;
  -moz-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.msg-keep i,
.msg-low i,
.msg-medium i,
.msg-congratz i {
  width: 94px;
  height: 94px;
  display: block;
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAABECAYAAACWJYUzAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAEw0lEQVRo3u2ZfYhUVRTAf29bd1YrSUuldLXRWt3XrqumZRlZgaVJCIYISdgHFmEI0sfrDyVkDVSiIDIsYyXBoD9aMgXzq3U2NzY0M6mVXNjNSqymVrB2ffe9d+/tj5nNN7PjzntvZ0aMDlyYe+595/fOuffOPfc+7GN1bfaxulGUWMqQ2kXqbfaRWqPU4L1IvRCpV5YavA+pQepNdqtpZnewW82Rdqs5oghgjiLpRjIUyQ67xaz4F9pijkPShuSlgoMr721XhtT7DakxpJ5mSL0eQDTXVBlSHzKkvtWQekHhPQbw1D48Rbq8IPZPfhpPHcJTk9K6erF/8pggBu3jUyfZx6cOCQjWe/E06VKGp9/H0xN9OgNPz8sLPVJbj6veqpx2wg0Eji04dQapv0tPskuVhwaEtpozcNRBHPVe8FCnvN7n8zBXmSc+uSXnWhfNNTMNRx8wHP2L4ehPBws+jKfX+epj8HR9P+ie6juw5QFsOQJbnsOWS8Se6uuCg6VuQeoL6bC2IPUCpF6H1Ad94Z7f313lINS7CHUaoe5DqEaEMvOBM0IndsR3AjFgcWxZV29aNxY4AYwEmmPLuh7ox/5oYjnQDowBFsaWdh4O7jFgSL3ckPrhPihAbFnXGUPqZ9Pr/G5n+83X9Ht7oZYaQo02hJofBBpKnMYJ25zGCdppnLAwQ791fJmzdfyXztbxM8PYKwvcU+pVSN3Zb1k5ajSOeq5ixU9HC+ppBmNL1V3OlqrPiwYYEL55XEn37f+OhA6b1dRdAwwD+P2c4OSPf/mbT7c1VP9RcLDV1L0BsPrqOcAXgFltDdXf57MVfDmlZE6e9qHAPUEMhQUXzGYxwIGk3F+xmrqHAbOB6y/R/4YANmfMXntqySXaOtsaqr8G3+SymrrrgV1AVdC3zjG5gshO4FF/qN8MAx2ELAIW+UNd53cG+LvAwJuAyvTv6X6wPyVdvXHxyA8LSZ299tQXXFxq5ZdtVv8PvnLAImEOFwnzycvh8SZgTUnBImHOAlYA35YMLBLmVcA7aRvHS+nxM8BMAOXp0ngsEuYo4LW+utvrhc6po3q8Cei7kPlt+CMdZ4oOFglzDrDcpzoW5c1DgUXCLAc2k5kkRjq6hPX4eSDjcK6VLq7HImHeCKzL1nu98pso4PIQfV8Hhmcr3V6voWvjqAvpaoxUsn8eWBO3kr8OCiwS5v3AY7na3B738RzqJLB6IJt5Qy0S5hBSEyqnuD0yl/rluJUcMAsMMsZPADU5WzS4vV62thX4IJ/RIKE+C2wndTzxS51ne1O00n6dB6yMW0mdz2hecGxu+25gd7ZeJMxGt8ebkqV+O24lA/1vD2aTmOH2ZIT5LPBq0IejbhKVwG1Z4BfjVvJ8UcHAVKDcN7Ga41YyVB4eFXy7FBLlaQAXCP09IyrYP75vxK3kyVKDfwbWRzEQZT+uAGrT47s6biUjHe6ieFwLVLg93mdxK/lxxIhFAk9XrhLSUauiQqOCf3B7vafiVrJjMOAw+zEAsbntBbmPvnIPbVHFf+vzJ6nvDgA9gJPv4ZC3PtdycWg3+Me4A7gz/fvqdCmWdPhD/QqpJK3Y8hXwYcbtrdXUPRZ4EBgdxELIUCugE9jV1lDt/AOIAT0xFGiY9AAAAABJRU5ErkJggg==);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCAzMCA2OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzAgNjg7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDojODNBQkYyO30KCS5zdDF7ZmlsbDojNEQ3QkRGO30KCS5zdDJ7ZmlsbDojRUZDMjAwO30KCS5zdDN7ZmlsbC1ydWxlOmV2ZW5vZGQ7Y2xpcC1ydWxlOmV2ZW5vZGQ7ZmlsbDpub25lO30KCS5zdDR7ZmlsbDojRDM4QzAwO30KCS5zdDV7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Q2e2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQo8L3N0eWxlPgo8Zz4KCTxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNS4zLDI2LjNoLTZ2LTMuNGMwLTAuNy0wLjYtMS4zLTEuNC0xLjNoLTUuOGMtMC44LDAtMS40LDAuNi0xLjQsMS4zdjMuNGgtNmMtMS40LDAtMi42LDEuMi0yLjYsMi42djM1CgkJYzAsMS40LDEuMiwyLjYsMi42LDIuNmgyMC44YzEuNCwwLDIuNi0xLjIsMi42LTIuNnYtMzVDMjcuOSwyNy40LDI2LjgsMjYuMywyNS4zLDI2LjN6IE0yNC44LDYzLjJINS4xVjI5LjNoMTkuN0wyNC44LDYzLjIKCQlMMjQuOCw2My4yeiIvPgoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI1LjMsMjYuM2gtNnYtMy40YzAtMC43LTAuNi0xLjMtMS40LTEuM0gxNXY3LjhoOS45djMzLjhIMTV2My4zaDEwLjRjMS40LDAsMi42LTEuMiwyLjYtMi42di0zNQoJCUMyNy45LDI3LjQsMjYuOCwyNi4zLDI1LjMsMjYuM3oiLz4KCTxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik0yMS4zLDQ1LjdjLTIuNiw0LjQtNS4yLDguNy03LjcsMTMuMWMwLDAsMCwwLDAsMC4xYy0wLjIsMC4zLTAuNCwwLjYtMC44LDAuNWMtMC41LTAuMi0wLjMtMC42LTAuMy0wLjkKCQljMC4yLTEuMSwwLjQtMi4yLDAuNi0zLjNjMC40LTEuOSwwLjctMy44LDEuMS01LjhjMC0wLjIsMC0wLjMsMC4xLTAuNmMtMS42LDAtMy4xLDAtNC42LDBjLTAuNCwwLTAuOC0wLjItMS4yLTAuMwoJCWMwLjEtMC40LDAuMi0wLjgsMC40LTEuMWMyLjUtNC4yLDUtOC40LDcuNS0xMi43YzAuMS0wLjEsMC4xLTAuMiwwLjItMC4zYzAuMi0wLjEsMC41LTAuMiwwLjctMC4zYzAuMSwwLjIsMC4zLDAuNSwwLjMsMC43CgkJYy0wLjEsMS0wLjMsMS45LTAuNSwyLjljLTAuNCwyLjEtMC44LDQuMy0xLjIsNi40YzAsMC4yLDAsMC4zLTAuMSwwLjZjMC4yLDAsMC41LDAsMC43LDBjMS41LDAsMi45LDAsNC40LDAKCQlDMjEuNSw0NC42LDIxLjcsNDUsMjEuMyw0NS43eiIvPgoJPHBhdGggY2xhc3M9InN0MyIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPHBhdGggY2xhc3M9InN0NCIgZD0iTTIwLjcsNDQuNmMtMS41LDAtMi45LDAtNC40LDBjMCwwLTAuMSwwLTAuMSwwbC0yLjcsMTQuM2MwLDAsMC0wLjEsMC0wLjFjMCwwLDAsMCwwLTAuMQoJCWMyLjYtNC4zLDUuMi04LjcsNy43LTEzLjFDMjEuNyw0NSwyMS41LDQ0LjYsMjAuNyw0NC42eiIvPgoJPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8xXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0Ljk4NyIgeTE9IjcuMTEzMyIgeDI9IjE0LjkxNTgiIHkyPSIyNC40NTQ4Ij4KCQk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+CgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0VCOTEwMCIvPgoJPC9saW5lYXJHcmFkaWVudD4KCTxwYXRoIGNsYXNzPSJzdDUiIGQ9Ik05LjMsNS42YzEsMy44LDIuMSw3LjYsMy4xLDExLjRjMCwwLDAsMCwwLDBjMC4xLDAuMywwLjEsMC42LTAuMiwwLjdjLTAuMywwLjItMC41LTAuMS0wLjctMC4zCgkJYy0wLjUtMC43LTEtMS40LTEuNS0yLjJjLTAuOS0xLjMtMS43LTIuNS0yLjYtMy44Yy0wLjEtMC4xLTAuMi0wLjItMC4zLTAuNGMtMC45LDAuOS0xLjcsMS43LTIuNSwyLjVjLTAuMiwwLjItMC41LDAuMy0wLjgsMC41CgkJYy0wLjEtMC4zLTAuMy0wLjUtMC40LTAuOGMtMS0zLjctMi03LjQtMy0xMS4xYzAtMC4xLTAuMS0wLjItMC4xLTAuM2MwLjEtMC4yLDAuMS0wLjQsMC4yLTAuNkMwLjgsMS42LDEsMS42LDEuMSwxLjcKCQlDMS42LDIuMywyLDMsMi40LDMuNmMxLDEuNCwxLjksMi44LDIuOSw0LjJDNS40LDcuOSw1LjUsOCw1LjYsOC4yQzUuOCw4LDUuOSw3LjksNiw3LjhDNi44LDcsNy42LDYuMiw4LjQsNS40CgkJQzguOCw0LjksOS4xLDUsOS4zLDUuNnoiLz4KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTguNzUxOSIgeTE9IjExLjA0NDQiIHgyPSIxNi44ODc1IiB5Mj0iMTUuNTk1MyI+CgkJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0YxRDUwMCIvPgoJCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KCTwvbGluZWFyR3JhZGllbnQ+Cgk8cGF0aCBjbGFzcz0ic3Q2IiBkPSJNMjAuNywxMi4yYy0xLjMsMS4zLTIuNiwyLjYtMy45LDMuOWMwLDAsMCwwLDAsMGMtMC4xLDAuMS0wLjIsMC4yLTAuMywwLjFjLTAuMS0wLjEtMC4xLTAuMiwwLTAuMwoJCWMwLjItMC40LDAuNC0wLjcsMC41LTEuMWMwLjMtMC42LDAuNi0xLjMsMC45LTEuOWMwLTAuMSwwLTAuMSwwLjEtMC4yYy0wLjYtMC4xLTEuMS0wLjMtMS42LTAuNGMtMC4xLDAtMC4zLTAuMS0wLjQtMC4yCgkJYzAuMS0wLjEsMC4xLTAuMywwLjItMC40YzEuMy0xLjMsMi41LTIuNSwzLjgtMy44YzAsMCwwLjEtMC4xLDAuMS0wLjFjMC4xLDAsMC4yLDAsMC4zLTAuMWMwLDAuMSwwLjEsMC4yLDAsMC4zCgkJYy0wLjEsMC4zLTAuMywwLjctMC41LDFjLTAuMywwLjctMC43LDEuNC0xLDIuMmMwLDAuMSwwLDAuMS0wLjEsMC4yYzAuMSwwLDAuMiwwLjEsMC4yLDAuMWMwLjUsMC4xLDEsMC4zLDEuNSwwLjQKCQlDMjAuOSwxMS44LDIwLjksMTIsMjAuNywxMi4yeiIvPgo8L2c+Cjwvc3ZnPgo=);
}

/* Descobrir onde que .msg-congratz ta sendo usado pra remover isso aqui */

.totalizers-msg__icon.msg-congratz i {
  width: 94px;
  height: 94px;
}

.msg-congratz i {
  width: 50px;
  height: 65px;
  background-image: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAAA/CAYAAABw8ZE3AAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QAAAAAAAD5Q7t/AAAACXBIWXMAAAsSAAALEgHS3X78AAAG10lEQVRo3u2af4wcZRnHP887O7sL9dreQS+9O2htSAxUQ7X0D6ExemJFCcYrrVIslHC18g8paAP/IMo/RhBNQDTWCCY0aMRADbTYNlBqkIqKVQoSSahQer3Wdu/2yvV+7OzOvI9/7N7e7l23tzOz1zuiT/JmZ+d933k/7zvf93nfeWZgllju1cVbc68u3hqmjsw0NEBu/8UOcLL0tzW9sieY9fDevo4NQAvQBtxdOv0gcAzIpjp7t81e+F1t7wBLamQfTn3x+JKz1TeNBgqlXc+uwLM78SwT0k48e8VU1Rs68lG06z254HLg4ITTy1I3ZF6fqm6iEdBl7eZtG0UNA3zf29cxpXbFs9eXDntLvx3AGuDcwJOz9zFZu3cV6cwRYJuqCtAsIlkAVZ0LjBQebVmCOPvMoi902/eeGwF+Re15MA3wnl0BPA5cV3XeJPdg818rgbcAAxXgnoj4qvoNICUig6Vaq+pttmGar6Xd5FdPvjEGLiJWVZuAgojkVDU1ATyUNWbkqdSuHENEUNtGUbu90wEOjXSVnl2Cpy+aS27tJOd/HM++QJC+dLrAG2qqmlDV5or/F6iqKR03qWq6dJwqaX522P8CeFJV580070T4uRXHcyrAXVU9ryKvaaZZ/2+NspqLVO7A4nYgHfnKVo0zWOiIC2hOF15xuvryZ8qrvUgpP6a4yEQzBTNYiMsOxX3O4bDw78VqUgHVuOAKHK2VeTb4I/HhY6I7knO6+vwI8Bpv5CU+vIoMTNUEALk/L1oGbAY+BcwDTgOXxGnc7RmOR2/EqmAFRB0ZUMf82oz6W5yv9Ptl+Nwri24DHgHceK01GP4Mpq7JAJcmVmeyidyfLr4a1Z8xfhdOAf+m6CY/0ugOhTIjgTrioZoUXxMAUrAL1DUvA0sNyl0oghKg3I7Smr6qZ0X6qp6PofylPPEiJY2VVFiVWJ2Zk7i+zw3muTdrQnxUkXxwmf/0hcsMliuxgOWJ9Mqen6ZX9ow7Z8tbpbxoSSRGx0EK9u9jKMlr/vOEneN+p5xv5EaDaqrU0zcmC0zfijd6Me6aiOesy75fiWPPc3aU862eb1DeKZ348GR4/hVPNtGTipyciCOjwfKKMgeMKLtEQZQu7w8XJasKK/8s5UVK8UaetyfN31xwZ2ntsOLZ7QbVR1DNo3oRqrdVFk595ugRVLORZUMMeNhfyZLftfBKMxx8AgVNmJec9dnTJtXZexjLw6VJ9j1vb0e1fCyvRZ6wMeaLFOzuMQRvb0fSDPnPEFiAgMDeDGPRA+VelNdRmlCe9l7oOL9C9wdnQPOKrwfKcnm/sFtGgwUoqGu+nbgxe7QMn/pcr4fqGlSPo7oc1e3e8+1F/av+I/IIRrxjKnLK2TDgARS2tz5uBgudWFDX7Ejc0Hd/uVNlfa86dgjLNViypd/fenvaU1heigwRVfNGXgMoPNX6mBksbCiN+H7J2S9XOZSJM9rb3b4U+D2wGNgLrAb+RnGrEMqcjIcUbNhqaNJs1KT5khn2u1DQpHlW8rbL6R6o2qee8THQ29XWATwFfBJ4E/grcOs5gTfia9q8LSPBZQiqSecniZv6N5+paM1nWO+5Nhd4ALiTohCcsPAm4yF++JEv9lw8dc1a96b+nbWKTBkl9na2XQdspRj0PyfwmjRvAp3uLdnM2crVFeL2diycB/wA2FRvHQDTn0fyIeCN5DVp7nE39P+wnuKh4vPeMwu3AHVdGMBkQ8AbGVVHFrnd2b66rx8GHtWHUH0+7j598jZCUYf1YcBDw6e6TgQo61EO1eWv610PEuYht3vgd6EGMvTIA6nVJzJYPo/l3an3NlMndc02d+PAN8NyRIIHSK058S6qK1H9Y+RdJagmzYPupoFbojBEhgdIrT15HOWzKPej+CGX/yFNmmvdTQN3R2weaNDbQO/J1qXAvcBaKgJZ5lQe8Sq8jSM5TZhfihfckdg86IduaDrgy534zYIrgD3ABUX4QhleXbNfCrYzcUdjoq/Q4A8nUusyB1C+WxWnLD5MD0nefrqR4NDA97BlU315/LiY1HDI3TxY1wdAMwtvGRd5pb+fBms4vFTuuMeeRzXy5c4tfNULhWq//gGAt1TFfj5Y8ErrJHDLhdMB3/BvzFC9elKsMtB2/4GmObMaPv9YSytK96QQt1VDgodnLXz+0Zb5KM+iNI/rXMZvQl43Fn409/ZGwsfeHuR/0fwhYB1wHxOec2U4gJEJTt6Vgxj5lrtl8MUZgc//vPnrFOM57cBHqfHqR4YDGK2xQhl8jAwB/fh6uXvP0EhYjmjeRlkOXFtHudpuMiBBoPOB+UR87xURPoTjniYfD/BfhhQUmvkuZKQAAAAASUVORK5CYII=);
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDIwLjAuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA0NyA2MyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDcgNjM7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPHN0eWxlIHR5cGU9InRleHQvY3NzIj4KCS5zdDB7ZmlsbDp1cmwoI1NWR0lEXzFfKTt9Cgkuc3Qxe2ZpbGw6dXJsKCNTVkdJRF8yXyk7fQoJLnN0MntmaWxsOnVybCgjc3RhcjNfMl8pO30KCS5zdDN7ZmlsbDp1cmwoI3N0YXIzXzNfKTt9Cjwvc3R5bGU+CjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMjMuNDYxNiIgeTE9IjMyLjE5NDkiIHgyPSIyMy40NjE2IiB5Mj0iNjEuOTE0MyI+Cgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojRjFENTAwIi8+Cgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3RvcC1jb2xvcjojRUI5MTAwIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yNyw0NS41YzAsMCwwLjEsMCwwLjEtMC4xYzIuNi0xLjEsNS4xLTMuMyw2LjgtNi4xYzE1LjgtOS44LDkuMi0xNy41LDQtMTYuMWMwLjMtMi4zLDAuNS0zLjksMC41LTMuOUg4LjYKCWMwLDAsMC4yLDEuNiwwLjUsMy45Yy01LjMtMS40LTExLjksNi4zLDQsMTYuMWMxLjcsMi44LDQuMSw1LDYuOCw2LjFjMCwwLDAuMSwwLDAuMSwwLjFjMS40LDAuNywxLjUsMi4xLDEuNSwyLjF2My41CgljMCw1LjYtNS43LDUuNS01LjcsNS41aC0wLjhWNTlIMzJ2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNUMyNS41LDQ3LjYsMjUuNSw0Ni4yLDI3LDQ1LjV6IE0zNS4yLDM2LjYKCWMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6IE05LjQsMjUuNmMwLjMsMi40LDAuOCw1LjEsMS4zLDcuOWMwLjIsMS4xLDAuNSwyLjEsMSwzLjEKCUMyLjEsMjguOCw0LjksMjQuNyw5LjQsMjUuNnoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJTVkdJRF8yXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI0My40OTYyIiB5MT0iMTguNjg4NSIgeDI9IjIwLjQyNjEiIHkyPSI0OC4yNjkzIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggY2xhc3M9InN0MSIgZD0iTTI3LDQ1LjVjMCwwLDAuMSwwLDAuMS0wLjFjMi42LTEuMSw1LjEtMy4zLDYuOC02LjFjMTUuOC05LjgsOS4yLTE3LjUsNC0xNi4xYzAuMy0yLjMsMC41LTMuOSwwLjUtMy45CglzLTcuNSwwLTE0LjksMGMtMC4zLDAtMC4yLDAtMC4yLDBMMjMuNiw1OWMwLDAtMC4yLDAsMC4xLDBjNC4yLDAsOC4yLDAsOC4yLDB2LTIuNGgtMC44YzAsMC01LjcsMC4yLTUuNy01LjV2LTMuNQoJQzI1LjUsNDcuNiwyNS41LDQ2LjIsMjcsNDUuNXogTTM1LjIsMzYuNmMwLjQtMSwwLjctMi4xLDEtMy4xYzAuNi0yLjgsMS01LjUsMS4zLTcuOUM0MiwyNC43LDQ0LjgsMjguOCwzNS4yLDM2LjZ6Ii8+CjxsaW5lYXJHcmFkaWVudCBpZD0ic3RhcjNfMl8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMzQuMjM2NSIgeTE9IjcuMTI4NCIgeDI9IjM0LjIzNjUiIHkyPSIxNC44MjUxIj4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzIiBjbGFzcz0ic3QyIiBkPSJNMzYuMywxMC44Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMWMtMC4xLDAtMC4yLDAtMC4zLTAuMQoJYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdDMzAuNSw2LDMwLjcsNS44LDMxLDUuOGMwLDAsMCwwLDAsMGwyLjEsMGwwLjYtMgoJYzAuMS0wLjIsMC4zLTAuNCwwLjYtMC40czAuNSwwLjIsMC42LDAuNGwwLjYsMmwyLjEsMGMwLDAsMCwwLDAsMGMwLjMsMCwwLjUsMC4yLDAuNiwwLjRjMC4xLDAuMiwwLDAuNS0wLjIsMC43bC0xLjcsMS4ybDAuNywyCgljMC4xLDAuMiwwLDAuNS0wLjIsMC43QzM2LjUsMTAuOCwzNi40LDEwLjgsMzYuMywxMC44TDM2LjMsMTAuOHoiLz4KPGxpbmVhckdyYWRpZW50IGlkPSJzdGFyM18zXyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIyNC4xMTU1IiB5MT0iMTAuODE3NyIgeDI9IjI0LjExNTUiIHkyPSIxOC41MTQ0Ij4KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGMUQ1MDAiLz4KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiNFQjkxMDAiLz4KPC9saW5lYXJHcmFkaWVudD4KPHBhdGggaWQ9InN0YXIzXzFfIiBjbGFzcz0ic3QzIiBkPSJNMjYuMSwxNC41Yy0wLjEsMC0wLjIsMC0wLjMtMC4xbC0xLjctMS4ybC0xLjcsMS4yYy0wLjEsMC4xLTAuMiwwLjEtMC4zLDAuMQoJYy0wLjEsMC0wLjIsMC0wLjMtMC4xYy0wLjItMC4xLTAuMy0wLjQtMC4yLTAuN2wwLjctMmwtMS43LTEuMmMtMC4yLTAuMS0wLjMtMC40LTAuMi0wLjdjMC4xLTAuMiwwLjMtMC40LDAuNi0wLjRjMCwwLDAsMCwwLDAKCWwyLjEsMGwwLjYtMmMwLjEtMC4yLDAuMy0wLjQsMC42LTAuNHMwLjUsMC4yLDAuNiwwLjRsMC42LDJsMi4xLDBjMCwwLDAsMCwwLDBjMC4zLDAsMC41LDAuMiwwLjYsMC40YzAuMSwwLjIsMCwwLjUtMC4yLDAuNwoJTDI2LDExLjhsMC43LDJjMC4xLDAuMiwwLDAuNS0wLjIsMC43QzI2LjQsMTQuNSwyNi4zLDE0LjUsMjYuMSwxNC41TDI2LjEsMTQuNXoiLz4KPC9zdmc+Cg==);
}

.msg-congratz span {
  margin-top: 6px;
}

.totalizer--score-cambridge {
  padding: 15px 26px 15px 0;
  display: block;
  text-align: center;
  position: relative;
}

.totalizer--score-cambridge .cambridge-shield__pending {
  position: absolute;
  padding: 8px 18px;
  background: white;
  z-index: 1;
  top: 10px;
  left: calc(50% - 13px);
  transform: translate(-50%, 41px);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2);
  font-weight: bold;
}

.totalizer--score-cambridge .cambridge-shield {
  justify-content: center;
}

.totalizer--score-cambridge .cambridge-shield.cambridge-shield--pending li {
  opacity: 0.1;
}

.totalizer--score-cambridge .cambridge-shield li + li {
  margin-left: 8px;
}

.totalizer--score-cambridge .cambridge-shield img {
  width: 48px;
}

.cambridge-shield__title {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 10px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Notification Ads
   ========================================================================== */

.notification-ads__content {
  background: #0075ea;
  padding: 18px 20px;
  color: white;
  margin-bottom: 30px;
  border-radius: 6px;
  display: grid;
  align-items: center;
  grid-template-columns: 48px 1fr auto;
  grid-column-gap: 20px;
}

.notification-ads__content > i {
  font-size: 48px;
  font-size: 4.8rem;
}

.notification-ads__content > b {
  max-width: 330px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   Notification Ads
   ========================================================================== */

countdown-resume {
  display: block;
  background: white;
  width: 100%;
}

.countdown-resume__content {
  padding: 18px 20px;
  text-align: center;
}

.countdown-resume__content > span b {
  color: #0075ea;
}

.countdown-resume__content > div {
  display: inline-block;
}

.countdown-resume__content > button {
  margin-right: 20px;
  margin-left: 15px;
}

.countdown-resume__timer {
  display: inline;
  margin-right: 10px;
  color: #ec3237;
  font-weight: bold;
}

.countdown-resume__timer > i {
  font-size: 18px;
  font-size: 1.8rem;
}

.countdown-resume__timer-label {
  font-size: 11px;
  font-size: 1.1rem;
  width: 130px;
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.modal-countdown-resume {
  width: 500px;
  text-align: center;
}

.modal-countdown-resume .btn--modal-button {
  height: 36px;
  line-height: 36px;
  text-transform: none;
  padding: 0 20px;
}

.modal-countdown-resume .modal-footer {
  text-align: center;
}

.modal-countdown-resume__content {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 1.2;
  padding: 50px 20px;
}

.modal-countdown-resume__content > h2 {
  margin-bottom: 20px;
}

.modal-countdown-resume__test-box {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px 0 30px;
}

.modal-countdown-resume__test-box .icon-edusynch {
  background-color: #0075ea;
  margin-right: 20px;
}

.modal-countdown-resume__test-box .icon-edusynch i {
  font-size: 28px;
  font-size: 2.8rem;
}

.modal-countdown-resume__category-title {
  font-size: 18px;
  font-size: 1.8rem;
  text-align: left;
  color: #0075ea;
}

.modal-countdown-resume__category-title span {
  display: block;
  color: #5d6670;
}

.modal-countdown-resume__remaining {
  padding: 0 40px;
  line-height: 1.8;
  margin-bottom: 20px;
}

.modal-countdown-resume__timer {
  margin: 0 5px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   AUDIO PASSAGE
   ========================================================================== */

.audio-passage__play {
  width: 100%;
  height: 50px;
  background-color: #2a6dcd;
  text-align: center;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.audio-passage__play--small {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  max-width: 370px;
  height: 34px;
}

.audio-passage__play--small .play-button,
.audio-passage__play--small .play-volume {
  line-height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.audio-passage__play--small .play-volume input {
  margin-top: 7px;
}

.audio-passage__play--small .play-volume .tooltip {
  top: 32px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   READING QUESTION SUMMARY
   ========================================================================== */

.reading-question-summary .question-header {
  margin-bottom: 40px;
}

.reading-question-summary .question-content--left,
.reading-question-summary .question-content--right {
  min-height: 250px;
}

.reading-question-summary .title {
  font-weight: bold;
}

.reading-question-summary .question-content--left {
  width: 30%;
}

.reading-question-summary .question-content--left .title {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 30px;
  display: block;
}

.reading-question-summary .question-content--right {
  width: 70%;
  min-height: 380px;
  border: 1px solid #dde4ea;
}

.reading-question-summary .question-content--right .title {
  font-size: 16px;
  font-size: 1.6rem;
  padding: 20px;
  display: inline-block;
}

.reading-question-summary .question-content--right .answer-choices {
  padding: 20px;
}

.answer-choices {
  width: 90%;
  min-height: 290px;
  position: relative;
}

.answer-choices .answer-item {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  width: 100%;
  padding: 10px 15px;
  margin-bottom: 15px;
  border: 1px solid transparent;
  cursor: pointer;
  display: inline-block;
  position: relative;
}

.answer-choices .answer-item:hover {
  border-color: #eee;
}

.answer-choices .answer-item.correct {
  background: #b8f8e2;
  border: 1px solid #11a06f;
}

.answer-choices .answer-item.incorrect {
  background: #fdeded;
  border: 1px solid #ec3237;
}

.answer-choices .orb {
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  position: absolute;
  top: 50%;
}

.answer-choices p {
  margin-bottom: 0;
  padding-left: 44px;
}

.answer-choices .answer-disabled {
  cursor: default;
}

.answer-choices .answer-disabled:hover {
  border-color: transparent;
}

.answer-item-default {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05) inset;
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05) inset;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05) inset;
  background-color: #ecf0f4;
  min-height: 45px;
}

.answer-item-default .orb {
  top: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   READING QUESTION TABLE
   ========================================================================== */

.reading-question-table .answer-row {
  -webkit-border-radius: 4px 4px 0 0;
  -moz-border-radius: 4px 4px 0 0;
  border-radius: 4px 4px 0 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
}

.reading-question-table .answer-columns:not(:first-child) {
  border-left: 1px solid #d1d8df;
}

.reading-question-table .answer-columns .header-answer-choice {
  padding: 6px 10px;
  height: 54px;
  background-color: #d1d8df;
  display: flex;
}

.reading-question-table .answer-columns .header-answer-choice > span {
  width: 50%;
  padding-left: 25px;
  display: block;
  float: left;
  line-height: 36px;
}

.reading-question-table .answer-columns .header-answer-choice__title {
  display: flex;
  align-items: center;
  text-align: center;
}

.reading-question-table .answer-columns .answer-item {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  width: 100%;
  padding: 10px;
}

.reading-question-table .answer-columns.answer-column-three {
  width: 33.333%;
}

.reading-question-table .answer-columns.answer-column-two {
  width: 50%;
}

.reading-question-table .answer-columns .answer-choices {
  width: 100%;
  float: auto;
}

.reading-question-table .answer-columns .answer-choices ul {
  width: inherit;
}

.header-answer-choice__total {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin-left: 4px;
  padding: 2px;
  display: inline-block;
  background-color: #fff;
  text-align: center;
  line-height: 16px;
}

.header-answer-choice__total .tooltip-content {
  min-width: 100px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.reading-questions .question__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin-bottom: 30px !important;
  display: block;
  color: #5d6670;
}

.reading-questions .question-item {
  width: 100%;
  margin-bottom: 0;
  color: #5d6670;
  display: inline-block;
  vertical-align: top;
}

.reading-questions .question-item + .question-item {
  margin-top: 30px;
}

.question-scroll {
  width: 100%;
  padding-right: 20px;
  overflow: hidden;
}

.question-item em {
  color: #ec3237;
  text-decoration: underline;
}

.question-passage .question-scroll {
  height: 460px;
}

.passage-image {
  text-align: center;
  margin: 20px auto;
}

.passage-image img {
  max-width: 250px;
}

.ielts-question-daigram-answer-box input {
  min-width: 240px;
  font-size: 100%;
  margin: 10px 10px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  /* @TODO css-var */
  box-shadow: 0px 0px #41b5d0;
  border-color: #41b5d0;
  padding: 12px 8px;
  border: 2px solid #637a80;
}

.question-diagram-image {
  text-align: center;
}

.question-diagram-image img {
  width: 90%;
}

.id-info-select {
  width: 22%;
  position: absolute;
  top: 4px;
  left: 65px;
}

.id-info-select select {
  font-size: 13px;
  /* @TODO css-var */
  border: 1px solid #ccc;
  border-radius: 30px;
  padding: 10px;
}

.id-info-label {
  width: 70%;
  margin-left: 150px;
}

.id-info-label:hover {
  /* @TODO css-var */
  border-color: #fff !important;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question-listening .question__title {
  font-size: 21px;
  font-size: 2.1rem;
  margin-bottom: 50px;
  display: block;
  color: #5d6670;
}

.question-listening .question-content--left {
  width: 40% !important;
}

.question-listening .question-content--right {
  width: 60% !important;
  background-color: #fff;
}

.question-listening .question-content--right.box-right--simulation-listening {
  width: 80%;
  margin: 0 auto;
  float: none;
  border-left: 0;
}

.question-listening .question-passage {
  background: url(3977bad542971c39602c15cb5465406f.jpg) no-repeat;
  background-size: cover;
}

.question-listening .question-content--left .audio-passage__play {
  bottom: 0;
  left: 0;
  position: absolute;
}

.passage-listening {
  background-color: #003871;
  height: 220px;
  position: relative;
}

.passage-listening .title {
  font-size: 21px;
  font-size: 2.1rem;
  color: #fff;
  font-weight: normal;
  font-size: 2.1rem;
  text-align: center;
  padding: 12%;
  display: block;
}

.passage-listening::before {
  content: '';
  width: 100%;
  height: 170px;
  display: block;
  background: url(93ba157234498008544a809c45dc6c2b.png) center bottom repeat-x;
  position: absolute;
  top: 0;
  left: 0;
}

/* ==========================================================================
   QUESTION LISTENING TYPE 3
   ========================================================================== */

.question-listening-3 .question__title {
  margin-bottom: 20px;
}

.question-listening-3 .audio-passage {
  margin-bottom: 20px;
}

.question-listening-3 .audio-passage > span {
  display: block;
  margin-bottom: 10px;
}

.question-listening.question-type-table .btn-correct-answers {
  width: 220px;
}

.question-listening.question-type-table .answer-message-box {
  margin-right: 30px;
}

.question-listening.question-type-table .wrong-box .btn + .btn {
  margin-left: 10px;
}

.wrap-question-table .table thead th {
  text-align: center;
}

.question__sentence,
.question__image {
  display: inline-block;
}

.question__image {
  margin-left: 10px;
  vertical-align: top;
}

.question__audio--listening {
  margin-bottom: 30px;
}

.question__description--with-audio {
  position: relative;
  margin-top: 10px;
  padding-right: 20px;
  /*
    @FROM: extracted from listening multiple one audio question
    @TODO See why it is necessary to put this position absolute.
  */
}

.question__description--with-audio > img {
  position: absolute;
  top: -26px;
  margin-left: 16px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question-speaking .question-header {
  padding: 30px;
  border-bottom: 1px solid #dde4ea;
}

.question-speaking .question-header .title {
  display: inline-block;
  font-weight: bold;
}

.question-speaking .question-header p {
  margin-bottom: 0;
}

.question-speaking .question-header p + p {
  margin-top: 14px;
}

.question-speaking .question__title {
  font-size: 2.1rem;
  margin-bottom: 50px;
  display: block;
  color: #5d6670;
}

.question-speaking .question-content--left {
  background-color: #f6f9fb;
  border-right: 1px solid #dde4ea;
}

.question-speaking .question-content--left .title {
  margin-bottom: 15px;
  display: inline-block;
  font-weight: bold;
}

.question-speaking .question-content--right {
  background-color: #fff;
  border: none;
}

.question-speaking .box-center {
  width: 90%;
}

.question-speaking .question-scroll {
  height: auto;
}

.box-speaking-record {
  max-width: 300px;
  position: relative;
  text-align: center;
}

.box-speaking-record .max-seg {
  padding: 20px 0;
  display: block;
}

.box-speaking-record .loading {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  left: 0;
  z-index: 99;
}

.no-recording {
  background-color: #fff;
}

.no-recording > div {
  font-size: 18px;
  font-size: 1.8rem;
  padding: 0 20px;
}

.box-record {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  width: 150px;
  height: 150px;
  background: #ec3237;
  margin: 0 auto;
  position: relative;
  text-align: center;
}

.box-record .btn-record {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  overflow: hidden;
  width: 100%;
  height: 100%;
  background: #ec3237;
  border: none;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  outline: none;
}

.box-record .btn-record .fe-icon {
  font-size: 64px;
  font-size: 6.4rem;
  position: relative;
  z-index: 9;
  color: #fff;
}

.box-record .btn-record .fe-audio {
  margin-top: 42px;
}

.box-record .fe-speaking {
  font-size: 75px;
  font-size: 7.5rem;
  color: #fff;
  text-align: center;
}

.btn-group-record {
  width: 205px;
  height: 48px;
  position: relative;
  margin: 0 auto;
}

.btn-group-record > button {
  width: 225px;
  position: absolute;
  top: 0;
  left: 0;
}

.max-seg {
  display: block;
}

.record-start span {
  font-size: 12px;
  font-size: 1.2rem;
  color: #fff;
  display: block;
  font-weight: bold;
  text-transform: uppercase;
}

.record-started {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 150px;
  height: 150px;
  position: relative;
  overflow: hidden;
}

.record-started .text {
  font-size: 12px;
  font-size: 1.2rem;
  color: #fff;
  display: block;
  font-weight: bold;
  position: relative;
  text-transform: uppercase;
  z-index: 99;
}

.record-bars {
  display: block;
  width: 140px;
  height: 70px;
  background: url(data:image/jpg;base64,iVBORw0KGgoAAAANSUhEUgAAALwAAABECAYAAAA7iF/fAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjBGMjI3M0I0QURBQjExRTU5QjA4QjBCRjBCQ0NFRkM3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjBGMjI3M0I1QURBQjExRTU5QjA4QjBCRjBCQ0NFRkM3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MEYyMjczQjJBREFCMTFFNTlCMDhCMEJGMEJDQ0VGQzciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MEYyMjczQjNBREFCMTFFNTlCMDhCMEJGMEJDQ0VGQzciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6EUVC0AAAGyklEQVR42uxdW28WRRie7QmxgBaKWhqsUBtQ8RyiBg+AhgtPCQheeGdijP4eE4wa4ymKpkS54ELFC0OqN4qAKVK0xVqhlR5sKydLS9fndd8vna5b+532+3Z2nyd5me6kdGdnnn3neWd2ZjyTUHSa5seRPASrg03C9u8xo78bB4CytyPZCVsGm4Z9jbJ/4/t+Xv/f8zxDlAfhOq9JKGEakTyiZBdcB3vYoXrepmQX1MO245nqCmmkfI0oDHUOlWupQ/VaH7qu1WeaKeSPiKfHiyIvzlp1TqPoKc6R6CUSC5XahqQZNgvrQ6X+5coDoOxNSNYJP2B/oOxnXSj3fm+1JBthN2nZpc67d/sjU9azyUv+itVb+Mj7EGkvqVsk4VGBdyHdZeVdRN5rIM7fDpB9OZJXYQ02IVB2FwjRAnvB6s087cW6rN9ptcie+50OEr40D98eyhP9fANswIHyr7XIniNEmyOEkLhEtMkVK68p9DtRMVZNjA5E6u9p2D0qw4Zh++BAxh3p7e9E8qQ6jsuwg7AT4cqrcfiFrY2Svo6UfVYJH86rJkRe3W/Vqzi+Bx3iww4r1luq19UNWtWLbIXdquQUzf05vMhVR7zIBiRbtO4uaNn/TEmPXx+Rd63D5V9SdcJrgPmYdb1Ggk3YEQfILr3hcyEZJV56X9a0MOpitUpKwQBe+lFXNHy+D/gUkvu0uxuDfYKHHC7ino0ReU0xN87tSJ7Rbm5KvfLRIv5UQ4jsgusTQD6RHtvUo0lMcBjPNxjj/W5E8rIlfWaQ92aRfKgoagp4mzdbD7gK9oBDDmm7pe2EFE+kzOE+C7sNtt4EQ507Y77f+lD8VKeDBSYVhDfRkz4NDmu7xpQRvjl0vbwKgwVOoKwaXgPSDq1wmVXsQTc35ZAubdGYwndJl2YkZthkghEkcbTnYIfQPperSnjVkY9a10OwNxypUAnAXrR6PdGle1M0AuMy2aVH3mW1TavGYl9Um/BhHdeCwi5xxMvfHJJ4Uje3wEj44om6WeMliZtkCPdAkbPgyyLk96o4NXy+8PLMSyK8NGnVBJBduLXDzI2FC2m3uhK0EkShaIgYLKhPVdBKECXETzKXEPvXuiQ8UW2yy6Tg81ZWrF/rUtIQ1ca60LWMyLRSwxNZQi0JTxAkPEGQ8ASxIDhKkyHIrDeSlSb4VmhsjxmdJuGJtJJdiP6SmVvBNI68t0D6S5Q0RBqx0cxfrieLbjqo4YkstXUDK4EgSHiCIOEJgoQnCBKeIEh4gqgO4cMbZcos3AVWDZFGyEzrt7AVZm7FyVGu1CdSS3hdWXKAVUFQw8eDqPNarrIpiLQS/oyZfwiAyKhf2BREpTR8PrhSLq8MCTXRaZpfN3PnMp2Rg7rYFImFy72vXyzhZRvkX83cglv5jvp4saXQI1TGyaXEQdpZRujsc6Vc6n37YHdY171FER4EnYVX/gA/yrbZssB2ImvfUWcBMoCBdpa9QNu1nYddOQxa8akJznTKnfF0qlgP/y/pTbBrK5Fu0p9HcszRsov8+un/NE25g9bwhNXUAvqfcBtRvbsTywXLvcTvS32JVmgFdGnPQKQL3bBN1sDD6bBnzQThZQQGycfkQ17IHRmacwiecWS3YrSz9Nrvu1rpRHUwppLvGhNsKS1tMVThMrjc+/pJkDQuIyrWuBjj/UZg75jgfCZP45/+GO83GkGYIUfaZkKdg33u6iAJXxp+hMlOtm1Khp9NxLBWubDbH8k12mAlHg4ypKfTNH9mgpNOxLP3xnm0pQkmrHxThgMx5AQZlP09/Hiv9oRSed+R8KVVqnxE927Kn1EmC49X6F7TIGm/mb878OkS/l5ZnAMJT8SJj2AbVIrIUGZPtQtEwlcQnrd47+77fmqeV7fy605SmThKkw5cyiMA52ABCZ8aHLJIIqMZXzlUdgk+h61A94c4A3lKmnRIh5NITjpadhly3EtJ81/MOFTWKCHOTyyo4ReEHFsY/iz1hEP1Gg7UTul0PFFlJFLSgBy+TjTIJJBMvY8gb9ihbroL5ZfFCCs1oPyNVCPhFyONSJg+h3W1TNsPkWKUNOVE1IZRU2xWIq2E74d9b4IhOVnS1avXBOGWpMlX6yM5qEYQqffwSUCc3wJEDcVy0yoSvmKQ+GAslBfnqv4BE2xclYOM+BxjM2RU0hSA8KRPUQuOdbhUlrbdbYIDwWSF/5EYJdsM7ve2CdYIi3M6L3k+eUvCLwJZYLzFui5lE6lJJIcropWCLyfln8lK6KcswMvKg8JTrjHBJJbMeJ7VgDd5AUGBnwfn88lxpgOsUH16afr+miAWwz8CDACXfNGPiMkCVQAAAABJRU5ErkJggg==) repeat-x;
  position: absolute;
  top: 46px;
  left: 5px;
  -webkit-animation: bars 8s linear infinite;
  -moz-animation: bars 8s linear infinite;
  -ms-animation: bars 8s linear infinite;
  -o-animation: bars 8s linear infinite;
  animation: bars 8s linear infinite;
}

/* animation */

@-webkit-keyframes bars {
  from {
    background-position: -188px;
  }

  to {
    background-position: -564px;
  }
}

@-moz-keyframes bars {
  from {
    background-position: -188px;
  }

  to {
    background-position: -564px;
  }
}

@-ms-keyframes bars {
  from {
    background-position: -188px;
  }

  to {
    background-position: -564px;
  }
}

@-o-keyframes bars {
  from {
    background-position: -188px;
  }

  to {
    background-position: -564px;
  }
}

@keyframes bars {
  from {
    background-position: -188px;
  }

  to {
    background-position: -564px;
  }
}

.record-actions a {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  font-size: 18px;
  font-size: 1.8rem;
  -moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
  width: 55px;
  height: 55px;
  background-color: #fff;
  color: #0075ea;
  display: block;
  position: absolute;
  cursor: pointer;
  bottom: 0;
}

.record-actions a i {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  left: 50%;
  top: 50%;
  position: absolute;
}

.record-cancel {
  left: 0;
}

.record-play,
.record-save {
  right: 0;
}

.record-play i {
  color: #5d6670;
}

.record-play i.pulse {
  color: #0075ea;
}

.total-seg {
  margin-top: 20px;
  display: block;
}

.audio-after {
  display: none;
}

.audio-after > span,
.audio-after > a {
  margin: 15px 0;
  display: block;
}

/*
   INDEPENDENT
   ========================================================================== */

.speaking-independent .box-speaking-record {
  margin: 80px auto 80px;
}

.speaking-independent .audio-passage {
  margin-top: 18px;
}

.speaking-independent .box-play-question-audio {
  margin-bottom: 10px;
}

.speaking-independent .explanation {
  bottom: 0;
  top: auto;
  height: 403px;
}

/*
   INTEGRATED
   ========================================================================== */

.speaking-integrated .box-speaking-record {
  margin: 55px auto 0;
}

.speaking-integrated .question-content--left,
.speaking-integrated .question-content--right {
  min-height: 474px;
}

.speaking-integrated .box-center {
  margin-top: -44px;
}

.speaking-integrated .audio-passage,
.speaking-integrated .box-play-question-audio {
  margin-top: 10px;
}

.speaking-integrated .audio-passage > span,
.speaking-integrated .box-play-question-audio > span {
  margin-bottom: 10px;
  display: block;
}

.speaking-integrated .slimScrollDiv {
  margin-bottom: 15px;
}

.speaking-integrated .question-content--right .question-content {
  padding: 0 30px;
}

.speaking-integrated-variation .audio-passage {
  margin-bottom: 20px;
}

/*
   AUDIO TEST
   ========================================================================== */

.audio-test .box-record {
  margin-bottom: 30px;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question-writing .title {
  font-weight: bold;
}

.question-writing .question-header {
  padding: 30px;
  border-bottom: 1px solid #dde4ea;
}

.question-writing .question-content--left {
  background-color: #f6f9fb;
  border-right: 1px solid #dde4ea;
}

.question-writing .question-content--right {
  background-color: #fff;
  border: none;
}

.question-writing .box-center {
  width: 90%;
}

/*
   Writing Commons
   ========================================================================== */

.writing-directions {
  margin-bottom: 20px;
}

/*
   INDEPENDENT
   ========================================================================== */

.writing-independent p + .title {
  margin-top: 50px;
}

.writing-independent .box-center {
  margin-top: -44px;
}

.writing-independent .form-describe textarea {
  height: 402px;
}

.writing-independent .explanation {
  height: 502px;
}

/*
   INTEGRATED
   ========================================================================== */

.writing-integrated .title {
  font-weight: bold;
}

.writing-integrated .question-header .title {
  display: inline-block;
  margin-bottom: 0;
}

.writing-integrated .question-header p {
  margin-bottom: 0;
  line-height: 150%;
}

.writing-integrated .question-header p + p {
  margin-top: 14px;
}

.writing-integrated .question-content--left,
.writing-integrated .question-content--right {
  min-height: 400px;
}

.writing-integrated .box-center {
  margin-top: -44px;
}

.writing-integrated .form-describe textarea {
  height: 260px;
}

.writing-integrated .audio-passage,
.writing-integrated .box-play-question-audio {
  margin-top: 10px;
}

.writing-integrated .audio-passage > span,
.writing-integrated .box-play-question-audio > span {
  margin-bottom: 10px;
  display: block;
}

.writing-integrated .slimScrollDiv {
  margin-bottom: 15px;
}

.writing-integrated .question-content--right .question-content {
  padding: 20px 30px 0;
}

.writing-integrated .play-volume .tooltip {
  top: -32px;
}

.writing-integrated .play-volume .tooltip::before {
  top: 100%;
  left: 50%;
  border-top-color: #fff;
  border-bottom-color: transparent;
}/* ==========================================================================
   CARD
   ========================================================================== */

image-modal {
  display: block;
  width: 100%;
  min-height: 140px;
  margin-bottom: 40px;
  text-align: center;
  position: relative;
}

image-modal.custom-test-speaking__image-modal {
  display: block;
  max-width: 420px;
  min-height: 250px;
  margin: 0 auto 30px;
}

.modal-wrapper-full .modal-dialog {
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  top: 0;
}

.btn-image-modal {
  cursor: pointer;
}

.btn-image-modal img {
  max-width: 100%;
  max-height: 360px;
}

.btn-image-modal:hover .btn-image-modal__overlay {
  opacity: 1;
  filter: alpha(opacity=100);
}

.btn-image-modal p {
  font-size: 11px;
  font-size: 1.1rem;
  text-transform: uppercase;
}

.question-content--custom-test img {
  max-height: 320px;
}

.btn-image-modal__overlay {
  opacity: 0;
  filter: alpha(opacity=0);
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  top: 0;
  left: 0;
}

.btn-image-modal__overlay i {
  font-size: 13px;
  font-size: 1.3rem;
}/* ==========================================================================
   CARD
   ========================================================================== */

.question-content__center {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.question-footer__content {
  width: 100%;
  max-width: 1280px;
  min-width: 980px;
  margin: 0 auto;
  padding: 0 20px;
}

/* ==========================================================================
   QUESTIONS
   ========================================================================== */

.question__title,
.question__legend {
  display: inline-block;
  margin-bottom: 30px;
}

.question__legend {
  font-weight: normal;
}

.question-passage {
  height: 100%;
}

.question-passage .question__title {
  max-width: 440px;
  margin: 0 auto;
  text-align: center;
}

.question__description {
  font-size: 18px;
  font-size: 1.8rem;
  color: #5d6670;
}

.question__description--with-headphone {
  position: relative;
  margin-top: 10px;
  padding-right: 20px;
}

.question__description--with-headphone > img {
  position: absolute;
  top: -26px;
  margin-left: 16px;
  width: 60px;
}

.question-content {
  height: calc(100% - 40px);
  min-width: 470px;
  padding: 40px;
}

.question-content:hover .actions-tooltip {
  opacity: 1;
  filter: alpha(opacity=100);
  left: 30px;
}

.question-content.\--has-antifraud .slimScrollDiv {
  margin-top: 50px;
}

.question-content__title {
  font-size: 16px;
  font-size: 1.6rem;
  margin-bottom: 10px;
  color: #5d6670;
  display: block;
  font-weight: bold;
}

.question-content--left,
.question-content--right {
  width: 50%;
  min-height: 600px;
  position: relative;
  display: inline-block;
}

.listening-intro {
  margin-right: 10px;
}

.question-content--left {
  height: 100%;
  float: left;
}

.question-content--right {
  -webkit-border-radius: 0 4px 4px 0;
  -moz-border-radius: 0 4px 4px 0;
  border-radius: 0 4px 4px 0;
  height: 100%;
  background-color: #f6f9fb;
  border-left: 1px solid #dde4ea;
}

.question-content--right--simulation-listening {
  margin: 0 auto;
  display: block;
  border: none;
}

.question__footer {
  width: 100%;
  height: 95px;
  min-width: 470px;
  background-color: #fff;
  border-top: 1px solid #f6f9fb;
  position: fixed;
  bottom: 0;
  left: 0;
  text-align: center;
  z-index: 981;
}

.question__footer > div {
  padding: 0 30px;
  height: 95px;
  line-height: 92px;
}

.question__footer .btn {
  font-size: 14px;
  font-size: 1.4rem;
  min-width: 180px;
  height: 48px;
  padding: 0 20px;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  font-weight: normal;
  line-height: 48px;
  text-transform: uppercase;
}

.question__footer .btn i {
  font-size: 16px;
  font-size: 1.6rem;
  margin: -2px 0 0 10px;
}

.question__footer .btn + .btn {
  margin-left: 40px;
}

.question__footer .btn-submit {
  background-color: #30b770;
}

.question__footer [disabled] {
  background-color: #c0cbd6;
  cursor: auto;
}

.question__footer .btn-explanation {
  width: auto;
}

.question__footer .btn-correct-answers {
  width: 230px;
}

.question-footer__content {
  display: block;
}

.question-explanation {
  margin-right: 100px;
  display: inline-block;
  position: relative;
}

.question-explanation__button {
  min-width: 180px;
  padding: 10px 20px;
  background: transparent;
  border: 1px solid #1bd171;
  color: #1bd171;
}

.question-explanation__button i {
  margin-left: 0 !important;
}

.question-explanation__button.error {
  border-color: #F27474;
  color: #F27474;
}

.question-explanation__tooltip {
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  width: 450px;
  height: 180px;
  padding: 20px;
  background: #fff;
  bottom: 100%;
  color: #5d6670;
  left: 50%;
  position: absolute;
  text-align: left;
}

.question-explanation__tooltip::before {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-top-color: #fff;
  border-width: 10px;
  margin-left: -10px;
}

.question-explanation__tooltip h5 {
  margin: 0 0 20px 0;
  line-height: normal;
}

.question-explanation__tooltip h5 i {
  font-size: 16px;
  font-size: 1.6rem;
}

.question-explanation__content {
  height: calc(100% - 40px);
  overflow-y: auto;
  text-transform: none;
  line-height: 16px;
  line-height: 1.6rem;
}

.sending-answer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  text-align: center;
}

.sending-answer .circular {
  margin-left: -50px;
  position: absolute;
  left: 50%;
  top: 50%;
}

.question-explanation__close {
  cursor: pointer;
  position: absolute;
  right: 15px;
  top: 15px;
}

.correct-box {
  background: #b8f8e2;
}

.wrong-box {
  background: #fce3e4;
}

.skip-box {
  background: #fef1e6;
}

.question-form li {
  position: relative;
}

.question-form li + li {
  margin-top: 10px;
}

.question-form input {
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  width: 24px;
  height: 24px;
  left: 30px;
  position: absolute;
  top: 50%;
}

.question-form input[type=radio]:checked + label,
.question-form input[type=checkbox]:checked + label {
  border-color: #c0cbd6;
  background-color: #dfe5ea;
}

.question-form input[type=radio]:checked + .orb,
.question-form input[type=checkbox]:checked + .orb {
  border-color: #003871;
  background-color: #003871;
}

.question-form label {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  padding: 15px 30px 15px 80px;
  border: 2px solid transparent;
  color: #5d6670;
  cursor: pointer;
  display: block;
  text-align: left;
}

.question-form label:hover {
  border-color: rgba(0, 0, 0, 0.05);
}

.question-form .answer-correct label {
  border-color: #11a06f;
}

.question-form .answer-correct input:checked + label {
  border-color: #11a06f;
  background-color: #ddfbf1;
}

.question-form .answer-wrong label {
  border-color: #ec3237;
}

.question-form .answer-wrong input:checked + label {
  border-color: #ec3237;
  background-color: #fce3e4;
}

.question-phrase {
  font-size: 18px;
  font-size: 1.8rem;
  width: 100%;
  margin-bottom: 40px;
  padding: 20px;
  background-color: #f6f8fa;
  color: #5d6670;
  display: block;
  font-weight: bold;
}

.orb-radio .answer {
  background-color: rgba(0, 117, 234, 0.1);
  margin-right: 5px;
  margin-left: 5px;
}

.question-full {
  width: 100%;
  padding: 40px 40px 110px;
  position: relative;
}

.question-full .question-content {
  padding: 0;
}

/*
   QUESTION PARTIAL, EXPAND AND CLOSE PASSAGE
   ========================================================================== */

.question-expand .question-content--left {
  width: 0%;
  visibility: hidden;
  overflow: hidden;
}

.question-expand .question-content--left .question-content {
  opacity: 0;
  filter: alpha(opacity=0);
}

.question-expand .question-content--right {
  width: 100%;
  visibility: visible;
}

.question-expand .paragraph-header-text {
  text-align: center;
}

.question-content--left,
.question-content--right {
  height: calc(100vh - 290px);
}

.simulation__content .question-content--left,
.simulation__content .question-content--right {
  height: calc(100vh - 216px);
}

.simulation__content .question-content--left {
  overflow-y: auto;
}

.simulation__content .reading-question-summary .question-content--left {
  height: auto;
}

.simulation__content.\--has-antifraud .question-writing .question-content {
  padding-top: 70px;
}

.speaking-enclosure .question-content--left,
.speaking-enclosure .question-content--right {
  height: auto;
}

.speaking-integrated .question-content--left,
.speaking-integrated .question-content--right {
  min-height: 420px;
}

.question-partial .question-content--left,
.question-partial .question-content--right {
  width: 50%;
  visibility: visible;
}

.question-partial .question-content--left .question-content,
.question-partial .question-content--right .question-content {
  -webkit-transition: 0.8s ease-in all;
  -moz-transition: 0.8s ease-in all;
  -ms-transition: 0.8s ease-in all;
  -o-transition: 0.8s ease-in all;
  transition: 0.8s ease-in all;
  opacity: 1;
  filter: alpha(opacity=100);
}

.question-content--center {
  margin: 0 auto;
  float: none;
  margin-left: 25%;
}

.passage-close .question-content--left {
  width: 100%;
  visibility: visible;
}

.passage-close .question-content--right {
  width: 0%;
  height: 0;
  border-left: 0;
  visibility: hidden;
  overflow: hidden;
}

.passage-close .question-content--right .question-content {
  opacity: 0;
  filter: alpha(opacity=0);
}

.btn-open {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 12px;
  font-size: 1.2rem;
  height: 34px;
  padding: 0 30px;
  line-height: 34px;
  left: 50%;
  position: absolute;
  text-transform: uppercase;
  top: 0;
  visibility: hidden;
  z-index: 99;
}

.passage-close .btn-open {
  visibility: visible;
}

.audio-test {
  padding: 80px 0;
  text-align: center;
}

.audio-test p {
  margin-bottom: 30px;
}

@keyframes pulse {
  50% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
  }
}

.box-audio {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  width: 100px;
  height: 100px;
  padding: 20px;
  margin: 70px auto;
  cursor: pointer;
  display: block;
  background-color: #0075ea;
  position: relative;
  border: none;
  outline: none;
}

.box-audio::after,
.box-audio::before {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  content: '';
  width: 100%;
  height: 100%;
  display: block;
  background-color: #0075ea;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
}

.box-audio::before {
  opacity: 0.1;
  filter: alpha(opacity=10);
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}

.box-audio::after {
  opacity: 0.05;
  filter: alpha(opacity=5);
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -o-transform: scale(1.4);
  transform: scale(1.4);
}

.box-audio i {
  font-size: 26px;
  font-size: 2.6rem;
  color: #fff;
}

.box-audio ng-md-icon {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 30px;
  height: 30px;
  color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
}

.intro-stop::after,
.intro-stop::before {
  animation-name: pulse;
  animation-duration: 1.5s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 3;
}

.btn--primary-play {
  margin-bottom: 40px;
  font-weight: normal;
}

.btn--primary-play span {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  width: 25px;
  height: 25px;
  margin: 12px 0 0 20px;
  background-color: #fff;
  display: block;
  float: right;
}

.btn--primary-play .fe-check {
  margin: -4px 0 0 10px;
}

.audio-test-limit {
  padding: 0;
}

.audio-test-limit .question-content--right {
  padding-top: 70px;
}

.audio-test-limit .notice {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 16px;
  font-size: 1.6rem;
  width: 60%;
  display: block;
  text-align: center;
  top: 50%;
  left: 50%;
  position: absolute;
}

.audio-test-limit .notice i {
  font-size: 42px;
  font-size: 4.2rem;
  margin: 0 auto 15px;
  color: #778ea7;
  display: block;
}

.audio-test-limit .box-speaking-record {
  margin: 0 auto 20px;
}

.directions-test-limit .notice {
  font-size: 16px;
  font-size: 1.6rem;
  display: block;
  text-align: center;
}

.directions-test-limit .notice p {
  width: 30%;
  margin: 30px auto;
}

.directions-test-limit .notice i {
  font-size: 42px;
  font-size: 4.2rem;
  margin: 0 auto 15px;
  color: #778ea7;
  display: block;
}

.orb-option .orb {
  position: absolute;
  top: 50%;
  margin-top: -17px;
  left: 28px;
}

.orb-option input {
  opacity: 0;
  filter: alpha(opacity=0);
}

.question-scroll-content .scroll-down {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transition: 0.3s ease-in opacity;
  -moz-transition: 0.3s ease-in opacity;
  -ms-transition: 0.3s ease-in opacity;
  -o-transition: 0.3s ease-in opacity;
  transition: 0.3s ease-in opacity;
  font-size: 9px;
  font-size: 0.9rem;
  padding: 4px 10px;
  color: #5d6670;
  bottom: 0;
  right: 5px;
  position: absolute;
  text-align: center;
  text-transform: uppercase;
}

.question-scroll-content .scroll-down i {
  margin: 0 !important;
  display: block;
}

.question-scroll-content:hover .scroll-down {
  opacity: 0;
  filter: alpha(opacity=0);
}

.question-type-table .wrap-question-table {
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  background: adjust-lightness(#e2e8ee, 5);
  border: 1px solid #d7dce2;
  overflow: hidden;
}

.question-type-table .question-table thead {
  background: #d7dce2;
  border: 1px solid #d7dce2;
}

.question-type-table .question-table tr td:not(:first-child) {
  text-align: center;
  border-left: 1px solid #d7dce2;
}

.passage-actions {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  font-size: 12px;
  font-size: 1.2rem;
  height: 34px;
  padding: 0 30px;
  line-height: 34px;
  right: -80px;
  position: absolute;
  text-transform: uppercase;
  top: 52px;
  z-index: 99;
}

.passage-actions i {
  margin-right: 10px;
}

.passage-actions.\--has-antifraud {
  top: 81px;
}

.actions-tooltip {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
  width: 34px;
  height: 34px;
  margin-bottom: 15px;
  background-color: #fff;
}

.actions-tooltip a {
  font-size: 11px;
  font-size: 1.1rem;
  width: 100%;
  height: 100%;
  color: #c0cbd6;
  display: block;
  float: left;
  line-height: 32px;
  text-align: center;
  position: relative;
}

.actions-tooltip a:hover .tooltip {
  opacity: 1;
  filter: alpha(opacity=100);
  bottom: 37px;
  visibility: visible;
}

.actions-tooltip a + a {
  border-left: 1px solid #dde4ea;
}

.actions-tooltip .tooltip {
  -webkit-transition: 0.2s ease-in all;
  -moz-transition: 0.2s ease-in all;
  -ms-transition: 0.2s ease-in all;
  -o-transition: 0.2s ease-in all;
  transition: 0.2s ease-in all;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  visibility: hidden;
  padding: 10px 20px;
  background-color: rgba(79, 95, 111, 0.8);
  bottom: 34px;
  left: 50%;
  line-height: 100%;
  position: absolute;
  text-transform: uppercase;
  z-index: 9;
}

.actions-tooltip .tooltip::after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: transparent;
  border-top-color: rgba(79, 95, 111, 0.8);
  border-width: 10px;
  margin-left: -10px;
}

.actions-tooltip .btn-expand {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  opacity: 1;
  filter: alpha(opacity=100);
  background-color: #c0cbd6;
  color: #fff;
  visibility: visible;
}

.btn-mute {
  width: 40px;
  height: 40px;
  display: inline-block;
  border: 1px solid #e2e8ee;
  line-height: normal;
  position: relative;
  text-align: center;
}

.btn-mute i {
  color: #5d6670;
  margin-top: -4px;
}

.btn-mute .tooltip-content {
  top: 48px;
  min-width: 70px;
  line-height: normal;
}

.btn-mute.mute-active i {
  opacity: 0.2;
  filter: alpha(opacity=20);
}

.header-internal .btn.btn-mute {
  padding: 0;
  margin-right: 10px;
}

.question__legend--speaking {
  margin-bottom: 30px;
  display: block;
}

.explanation-content__text {
  margin-top: 20px;
}

/*
   ORB
   ========================================================================== */

.orb {
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -moz-box-shadow: 0 2px 3px rgba(93, 102, 112, 0.2);
  -webkit-box-shadow: 0 2px 3px rgba(93, 102, 112, 0.2);
  box-shadow: 0 2px 3px rgba(93, 102, 112, 0.2);
  font-size: 12px;
  font-size: 1.2rem;
  width: 32px;
  height: 32px;
  margin-right: 5px;
  background-color: #fff;
  display: inline-block;
  border: 1px solid #eaf0f6;
  color: #4f5f6f;
  line-height: 28px;
  text-align: center;
}

.orb.active {
  -moz-box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  -webkit-box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  box-shadow: 0 2px 3px rgba(0, 117, 234, 0.5);
  background-color: #0075ea;
  border-color: #0075ea;
  color: #fff;
}

/*
   ORB
   ========================================================================== */

.question__example {
  padding: 20px;
  background-color: #f6f8fa;
  color: #5d6670;
  margin-bottom: 20px;
}/* ==========================================================================
   CARD
   ========================================================================== */

/* ==========================================================================
   answer-sheet-table
   ========================================================================== */

.answer-sheet-table {
  background: #fff;
  box-sizing: border-box;
  width: 100%;
  border-radius: 6px;
  display: block;
}

.answer-sheet-table .check,
.answer-sheet-table .wrong {
  padding-left: 15px;
}

.answer-sheet-table .check {
  color: #1bd171;
}

.answer-sheet-table .wrong {
  color: #F27474;
}

.answer-sheet-table table {
  width: 100%;
}

.answer-sheet-table .no-status {
  margin-left: 20px;
}

.answer-sheet-table .heading {
  background-color: rgba(93, 102, 112, 0.05);
  padding: 21px;
  font-size: 16px;
  font-weight: bold;
}

.answer-sheet-table thead {
  background-color: rgba(221, 221, 221, 0.1);
  text-align: left;
}

.answer-sheet-table .table thead th {
  border-bottom: 1px solid #e5eef4;
}

.answer-sheet-table .table tbody tr:nth-child(even) {
  background-color: rgba(158, 158, 158, 0.1);
}

.answer-sheet-table .table tbody tr td:last-child answer-sheet-modal {
  padding-left: 15px;
  color: #bec3c7;
}

.answer-sheet-table .table tfoot {
  text-align: center;
}

.answer-sheet-table .table tfoot .view-more {
  border-radius: 20px;
  padding: 0 15px;
  height: 40px;
  color: #5d6670;
  line-height: 38px;
  border: 1px solid #e2e8ee;
  background: transparent;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
}

.answer-sheet-table .table tfoot .view-more:hover {
  background: #0075ea;
  color: #fff;
}/* ==========================================================================
  answer-sheet-modal
  ========================================================================== */

answer-sheet-modal {
  cursor: pointer;
}

.answer-sheet-modal {
  width: 1200px;
}/* ==========================================================================
   answer-sheet-footer
   ========================================================================== */

.answer-sheet-footer {
  text-align: center;
}

.answer-sheet-footer .current_question {
  width: 42px;
  border: 1px solid #ddd;
  padding: 12px 8px;
  border-radius: 8px;
  margin: 0px 10px;
  text-align: center;
  font-weight: bold;
}

.answer-sheet-footer .of_ques {
  margin-right: 10px;
}/* ==========================================================================
   ANALYSIS DETAILS STUDENT
   ========================================================================== */

analysis-details-student {
  display: block;
  width: 100%;
}/* ==========================================================================
   CARD
   ========================================================================== */

.ng-hide .retry-content {
  opacity: 0.2;
  filter: alpha(opacity=20);
  bottom: 90px;
}

.modal--retry {
  z-index: 1050;
  display: block;
}

.modal-body.retry {
  width: 500px;
  padding: 30px 55px 40px;
}

.retry__title {
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2.6rem;
  margin-bottom: 20px;
  text-align: center;
}

.retry__content {
  text-align: center;
}

.btn-retry {
  display: inline-block;
}

.retry-text {
  color: #0075ea;
  margin-bottom: 20px;
}

.retry-icon {
  font-size: 80px;
  font-size: 8rem;
  margin-bottom: 20px;
  border-radius: 50%;
  color: #0075ea;
  vertical-align: middle;
}/* ==========================================================================
   CARD
   ========================================================================== */

.box-cancel-login__button {
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  position: absolute;
  left: 50%;
  top: 50%;
}

.checkout {
  width: 800px;
  min-height: 480px;
}

.modal-header--checkout {
  position: relative;
  z-index: 995;
}

.modal-header--checkout .modal-title {
  display: inline-block;
}

.modal-body--checkout {
  padding: 0;
}

.checkout-control {
  margin-top: 5px;
  float: right;
}

.checkout-control .success.active span {
  background: #30b770;
}

.checkout-control .error.active span {
  background: #ec3237;
}

.checkout-control__item {
  cursor: pointer;
  display: inline-block;
  position: relative;
  outline: none;
}

.checkout-control__item + li {
  padding-left: 36px;
}

.checkout-control__item + li::before {
  display: block;
}

.checkout-control__item::before {
  width: 26px;
  height: 4px;
  background: image-url("icons/icon-dot.png") left center;
  content: '';
  display: none;
  position: absolute;
  left: 8px;
  top: 15px;
}

.checkout-control__item span {
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  width: 34px;
  height: 34px;
  background-color: #dde4ea;
  color: #fff;
  display: block;
  font-weight: bold;
  line-height: 34px;
  text-align: center;
}

.checkout-control__item.active span {
  background-color: #2a6dcd;
}

.table-pricing {
  width: 100%;
}

.table-pricing thead {
  background: #f6f6f6;
}

.table-pricing thead,
.table-pricing tbody,
.table-pricing tfoot {
  padding: 15px 30px;
}

.table-pricing th,
.table-pricing td {
  height: 60px;
  padding: 15px 30px;
  text-align: center;
}

.table-pricing th:first-child,
.table-pricing td:first-child {
  text-align: left;
}

.table-pricing th {
  color: #2a6dcd;
  font-weight: bold;
}

.table-pricing th:first-child {
  font-size: 18px;
  font-size: 1.8rem;
}

.table-pricing td {
  border-bottom: 1px solid #f6f6f6;
}

.table-pricing input[disabled] {
  text-align: center;
}

.code-promotion {
  max-width: 250px;
}

.code-promotion input {
  font-size: 14px;
  font-size: 1.4rem;
  height: 40px;
  outline: none;
}

.code-promotion input:focus {
  padding-left: 30px;
}

.code-promotion input:focus ~ i {
  left: 0;
}

.code-promotion-show {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 15px 50px 15px 15px;
  background: #f6f6f6;
}

.code-promotion-show small {
  display: block;
}

.code-promotion-show .btn {
  width: 32px;
  height: 32px;
  padding: 0;
  line-height: 32px;
  text-align: center;
  position: absolute;
  top: 32px;
  right: 50px;
}

.price-inline {
  display: inline-block;
}

.checkout-total {
  width: 280px;
  margin-left: 50px;
  text-align: right;
}

.checkout-total__total {
  font-size: 21px;
  font-size: 2.1rem;
  display: block;
  font-weight: bold;
}

.checkout-total__total small {
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: uppercase;
  font-weight: normal;
  display: block;
}

.checkout-total__pricing {
  margin-top: 15px;
}

.checkout-total__content {
  padding: 15px;
  border: 1px solid #e2e8ee;
}

#checkout-total__select {
  font-size: 14px;
  font-size: 1.4rem;
  width: 100%;
  margin-bottom: 20px;
  padding: 4px;
}

.total-content {
  text-align: right !important;
}

.total-content .save {
  text-transform: uppercase;
  color: #0075ea;
  font-weight: bold;
  display: block;
}

.total-content .save small {
  padding-right: 8px;
}

.price-total {
  font-size: 16px;
  font-size: 1.6rem;
  min-width: 100px;
  display: block;
  text-align: right;
  font-weight: bold;
}

.price-total__price {
  margin-right: 15px;
  color: #0075ea;
}

.price-with-discount span {
  color: #30b770;
}

.checkout-step .sa-icon-box {
  margin: 40px auto;
  display: block;
  text-align: center;
}

.checkout-step .sa-icon-box .sa-icon {
  margin: 0;
}

.checkout-step .sa-icon-box .sa-success {
  border-color: #30b770;
  background: #30b770;
}

.checkout-step__item {
  width: 100%;
  min-height: 320px;
  float: left;
  position: relative;
}

.checkout-step__item--success,
.checkout-step__item--error {
  text-align: center;
}

.checkout-step__item--success h2,
.checkout-step__item--error h2 {
  margin-bottom: 40px;
  display: block;
  font-weight: normal;
  text-align: center;
}

.checkout-step__item--success p,
.checkout-step__item--error p {
  padding: 0 100px;
  margin-bottom: 50px;
  text-align: center;
}

.checkout-step__item--success .btn,
.checkout-step__item--error .btn {
  margin: 0 auto 45px;
}

.checkout__payment-tabs {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
}

.checkout__payment-tabs li {
  width: 100%;
  height: 80px;
  background-color: #f5f5f6;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
  color: #5d6670;
  line-height: 80px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
}

.checkout__payment-tabs li + li {
  border-left: 1px solid #e5e5e5;
}

.checkout__payment-tabs li a {
  color: inherit;
  cursor: pointer;
  display: block;
}

.checkout__payment-tabs li:hover,
.checkout__payment-tabs li.active {
  background-color: #fff;
  border-bottom: 3px solid #2a6dcd;
  color: #2a6dcd;
}

.checkout__payment-tabs i {
  font-size: 24px;
  font-size: 2.4rem;
}

.checkout__content--large {
  max-height: 400px;
  overflow-x: auto;
}

.checkout__content--large .checkout-form__list {
  margin-bottom: 50px;
}

.checkout__content {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
  padding: 50px;
}

.checkout__content .hosted-field {
  height: 40px;
  margin-bottom: 20px;
}

.checkout__content label {
  font-size: 12px;
  font-size: 1.2rem;
  text-transform: uppercase;
}

.checkout__content .last-item {
  margin-bottom: 0;
}

.checkout-form {
  max-width: 470px;
}

.checkout-form input {
  border-bottom: 2px solid #dde4ea;
}

.checkout-form__list li {
  width: 100%;
  vertical-align: top;
}

.checkout-form__list input {
  border-bottom: 2px solid #dde4ea;
}

.checkout-form__list li + li {
  margin-top: 30px;
}

.checkout-form__list .error input {
  border-color: #ec3237;
}

.checkout-form__list .valid input {
  border-color: #30b770;
}

.table-pricing__label-practice,
.table-pricing__label-simulation,
.table-pricing__label-speed-up,
.table-pricing__label-cefr {
  font-weight: bold;
}

.table-pricing__label-practice {
  color: #4caf50;
}

.table-pricing__label-simulation {
  color: #1f74cb;
}

.table-pricing__label-cefr {
  color: #ffa500;
}

.table-pricing__label-speed-up {
  color: #1bd171;
}

.table-pricing__number {
  max-width: 60px;
  height: 34px;
}

.checkout-form__multiple {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}

.checkout-form__multiple > div {
  width: 100%;
}

.checkout-form__multiple > div + div {
  margin-left: 30px;
}

.checkout-form__list--boleto li + li {
  margin-top: 30px;
}

.checkout-form__street {
  max-width: 100px;
}

.checkout-form__select {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  border-bottom: 2px solid #dde4ea;
}

.btn-paypal .fe-paypal {
  width: 21px;
  height: 25px;
  margin-right: 15px;
  background: image-url("icons/icon-paypal.png");
  background-size: cover;
}

.box-cancel-login {
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.9);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
}

.box-cancel-login__button {
  font-size: 14px;
  font-size: 1.4rem;
  text-transform: uppercase;
  font-weight: bold;
}

.checkout-tr-with-loading {
  position: relative;
}

.boleto-pending {
  width: 100%;
  padding: 60px;
  text-align: center;
}

.boleto-pending h2 {
  margin-bottom: 30px;
}

.boleto-peding__copy span {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 30px;
  padding: 10px 20px;
  border: 1px solid #eee;
  background-color: #f9f9f9;
  display: inline-block;
}

.btn-back {
  float: left;
}

.table-pricing__category-itens--inside-full-test td:first-child {
  padding-left: 60px;
  position: relative;
}

.table-pricing__category-itens--inside-full-test td:first-child::before {
  content: '';
  display: block;
  width: 10px;
  height: 100%;
  background: #eee;
  position: absolute;
  left: 0;
  top: 0;
}

.speed_up_checkbox {
  height: 20px;
  width: auto;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
}

.speed_up_td {
  position: relative;
}

.checkout__speed-up-amount {
  margin-top: 10px;
  display: block;
}

.modal-close-checkout {
  width: 32px;
  height: 32px;
  border-radius: 0 4px 4px 0;
  color: #fff;
  cursor: pointer;
  background: #5d6670;
  position: absolute;
  right: -32px;
  top: 22px;
}

.modal-close-checkout:hover {
  background: #747f8c;
}.confirmation-modal-use {
  width: 700px;
  height: 400px;
  font-size: 16px;
}

.confirmation-modal {
  width: 700px;
  height: 450px;
  font-size: 16px;
}

.speed-up-header,
.speed-up-overview {
  display: flex !important;
  justify-content: space-between;
  padding: 12px 20px !important;
}

.speed-up-timer {
  font-size: 36px;
  position: relative;
}

.timer-alert {
  position: absolute;
  top: 0px;
  right: 0px;
  border-radius: 50%;
  background-color: #1bd171;
  width: 10px;
  height: 10px;
  font-size: 8px;
  color: #fff;
}

.speed-up-header-amount {
  text-align: right;
  font-weight: normal;
}

.speed-up-item-title {
  padding-top: 8px;
  display: block;
  width: 100%;
  font-weight: bold;
  text-align: left;
}

.speed-up-item-date {
  margin-top: 4px;
  font-size: 14px;
  font-weight: normal;
  text-align: left;
  width: 100%;
  display: block;
  opacity: 0.5;
}

.speed-up-list {
  list-style-type: disc;
  padding: 20px;
  margin: 20px;
  line-height: 2;
  font-size: 14px;
}

.speed-up-item-amount {
  font-size: 21px;
  font-weight: bold;
  color: #0075ea;
  margin-top: 14px;
}

.confirmation-button {
  border-radius: 43px;
  background-color: #1bd171;
  color: #fff;
  padding: 10px;
  font-size: 14px;
  width: 120px;
  cursor: pointer;
}

.speed-up-footer {
  display: flex;
  justify-content: space-between;
  padding: 20px;
}

.speed-up__currency {
  display: flex;
  justify-content: flex-start;
  font-size: 14px;
  padding: 0 20px;
}

.speed-up__currency span {
  line-height: 30px;
}

.speed-up__currency select {
  width: 76.5px;
  height: 33px;
  border-radius: 4px;
  border: solid 1px #979797;
  margin: 0 20px;
}

.speed-up__currency li {
  border-radius: 4px;
  text-align: center;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
}

.speed-up__currency li img {
  max-width: 50px;
  height: 25px;
  vertical-align: middle;
}.widget-history-item__speed-up .btn-submit {
  background: #1bd171;
  color: #fff;
  font-size: 9px;
  border-radius: 16px;
  padding: 5px !important;
  font-weight: bold;
  width: 66px !important;
  text-align: center;
  height: 20px;
}

.awaiting-speedup .fe-icon {
  font-size: 36px !important;
  color: #1bd171;
}

.awaiting-speedup .tooltip-content {
  background: #1bd171;
  border-radius: 12px;
  width: 150px;
  left: -18px;
  top: 44px;
}

.awaiting-speedup .tooltip-content::after {
  border-bottom-color: #1bd171;
  left: 78%;
}.image--with-loading {
  min-width: 400px;
  min-height: 200px;
  position: relative;
  margin: 0;
}

.image--with-loading img {
  display: block;
}.schedule-cancel {
  width: 480px;
  height: 578px;
  font-size: 16px;
}

.schedule-cancel__content {
  padding: 40px;
  position: relative;
  text-align: center;
}

.schedule-cancel__content p:last-child {
  margin-bottom: 0;
}

.schedule-cancel .card__header {
  min-height: 48px;
  line-height: 48px;
}

.schedule-cancel .schedule-cancel-timer {
  font-size: 24px;
  position: relative;
  margin: 0 10px 0 0;
}

.schedule-cancel-footer {
  display: flex;
  justify-content: space-between;
  padding: 32px 40px;
  border-top: 1px solid #E1E0E7;
}

.schedule-cancel__title {
  font-size: 32px;
  text-align: center;
  margin-bottom: 24px;
}

.schedule-cancel__header {
  display: flex;
  align-items: center;
  justify-content: center;
}

.schedule-cancel__icon {
  border-radius: 100%;
  width: 120px;
  height: 120px;
  background-color: rgba(236, 50, 55, 0.1);
  color: #ec3237;
  margin: 0 auto 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 4.2rem;
}

.schedule-cancel .loader--modal {
  top: 74px;
  left: 0;
}

.timer-alert {
  position: absolute;
  top: 0px;
  right: 0px;
  border-radius: 50%;
  background-color: #1bd171;
  width: 10px;
  height: 10px;
  font-size: 8px;
  color: #fff;
}

.confirmation-button {
  border-radius: 43px;
  background-color: #1bd171;
  color: #fff;
  padding: 10px;
  font-size: 14px;
  width: 120px;
  cursor: pointer;
}