/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *























*/
/**
 * Variables declared here can be overridden by consuming applications, with
 * the help of the `!default` flag.
 *
 * @example
 *     // overriding $hoverColor
 *     $hoverColor: rgba(red, 0.05);
 *
 *     // overriding image path
 *     $flagsImagePath: "images/";
 *
 *     // import the scss file after the overrides
 *     @import "bower_component/intl-tel-input/src/css/intlTelInput";
 */
.intl-tel-input {
  position: relative;
  display: inline-block; }
  .intl-tel-input * {
    box-sizing: border-box;
    -moz-box-sizing: border-box; }
  .intl-tel-input .hide {
    display: none; }
  .intl-tel-input .v-hide {
    visibility: hidden; }
  .intl-tel-input input, .intl-tel-input input[type=text], .intl-tel-input input[type=tel] {
    position: relative;
    z-index: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-right: 36px;
    margin-right: 0; }
  .intl-tel-input .flag-container {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    padding: 1px; }
  .intl-tel-input .selected-flag {
    z-index: 1;
    position: relative;
    width: 36px;
    height: 100%;
    padding: 0 0 0 8px; }
    .intl-tel-input .selected-flag .iti-flag {
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto; }
    .intl-tel-input .selected-flag .iti-arrow {
      position: absolute;
      top: 50%;
      margin-top: -2px;
      right: 6px;
      width: 0;
      height: 0;
      border-left: 3px solid transparent;
      border-right: 3px solid transparent;
      border-top: 4px solid #555; }
      .intl-tel-input .selected-flag .iti-arrow.up {
        border-top: none;
        border-bottom: 4px solid #555; }
  .intl-tel-input .country-list {
    position: absolute;
    z-index: 2;
    list-style: none;
    text-align: left;
    padding: 0;
    margin: 0 0 0 -1px;
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
    background-color: white;
    border: 1px solid #CCC;
    white-space: nowrap;
    max-height: 200px;
    overflow-y: scroll; }
    .intl-tel-input .country-list.dropup {
      bottom: 100%;
      margin-bottom: -1px; }
    .intl-tel-input .country-list .flag-box {
      display: inline-block;
      width: 20px; }
    @media (max-width: 500px) {
      .intl-tel-input .country-list {
        white-space: normal; } }
    .intl-tel-input .country-list .divider {
      padding-bottom: 5px;
      margin-bottom: 5px;
      border-bottom: 1px solid #CCC; }
    .intl-tel-input .country-list .country {
      padding: 5px 10px; }
      .intl-tel-input .country-list .country .dial-code {
        color: #999; }
    .intl-tel-input .country-list .country.highlight {
      background-color: rgba(0, 0, 0, 0.05); }
    .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name, .intl-tel-input .country-list .dial-code {
      vertical-align: middle; }
    .intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name {
      margin-right: 6px; }
  .intl-tel-input.allow-dropdown input, .intl-tel-input.allow-dropdown input[type=text], .intl-tel-input.allow-dropdown input[type=tel], .intl-tel-input.separate-dial-code input, .intl-tel-input.separate-dial-code input[type=text], .intl-tel-input.separate-dial-code input[type=tel] {
    padding-right: 52px;
    padding-left: 52px;
    margin-left: 0; }
  .intl-tel-input.allow-dropdown .flag-container, .intl-tel-input.separate-dial-code .flag-container {
    right: auto;
    left: 0; }
  .intl-tel-input.allow-dropdown .selected-flag, .intl-tel-input.separate-dial-code .selected-flag {
    width: 46px; }
  .intl-tel-input.allow-dropdown .flag-container:hover {
    cursor: pointer; }
    .intl-tel-input.allow-dropdown .flag-container:hover .selected-flag {
      background-color: rgba(0, 0, 0, 0.05); }
  .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover {
    cursor: default; }
    .intl-tel-input.allow-dropdown input[disabled] + .flag-container:hover .selected-flag, .intl-tel-input.allow-dropdown input[readonly] + .flag-container:hover .selected-flag {
      background-color: transparent; }
  .intl-tel-input.separate-dial-code .selected-flag {
    background-color: rgba(0, 0, 0, 0.05);
    display: table; }
  .intl-tel-input.separate-dial-code .selected-dial-code {
    display: table-cell;
    vertical-align: middle;
    padding-left: 28px; }
  .intl-tel-input.separate-dial-code.iti-sdc-2 input, .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-2 input[type=tel] {
    padding-left: 66px; }
  .intl-tel-input.separate-dial-code.iti-sdc-2 .selected-flag {
    width: 60px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 input[type=tel] {
    padding-left: 76px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-2 .selected-flag {
    width: 70px; }
  .intl-tel-input.separate-dial-code.iti-sdc-3 input, .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-3 input[type=tel] {
    padding-left: 74px; }
  .intl-tel-input.separate-dial-code.iti-sdc-3 .selected-flag {
    width: 68px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 input[type=tel] {
    padding-left: 84px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-3 .selected-flag {
    width: 78px; }
  .intl-tel-input.separate-dial-code.iti-sdc-4 input, .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-4 input[type=tel] {
    padding-left: 82px; }
  .intl-tel-input.separate-dial-code.iti-sdc-4 .selected-flag {
    width: 76px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 input[type=tel] {
    padding-left: 92px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-4 .selected-flag {
    width: 86px; }
  .intl-tel-input.separate-dial-code.iti-sdc-5 input, .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.iti-sdc-5 input[type=tel] {
    padding-left: 90px; }
  .intl-tel-input.separate-dial-code.iti-sdc-5 .selected-flag {
    width: 84px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input, .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=text], .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 input[type=tel] {
    padding-left: 100px; }
  .intl-tel-input.separate-dial-code.allow-dropdown.iti-sdc-5 .selected-flag {
    width: 94px; }
  .intl-tel-input.iti-container {
    position: absolute;
    top: -1000px;
    left: -1000px;
    z-index: 1060;
    padding: 1px; }
    .intl-tel-input.iti-container:hover {
      cursor: pointer; }

.iti-mobile .intl-tel-input.iti-container {
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
  position: fixed; }

.iti-mobile .intl-tel-input .country-list {
  max-height: 100%;
  width: 100%; }
  .iti-mobile .intl-tel-input .country-list .country {
    padding: 10px 10px;
    line-height: 1.5em; }

.iti-flag {
  width: 20px; }
  .iti-flag.be {
    width: 18px; }
  .iti-flag.ch {
    width: 15px; }
  .iti-flag.mc {
    width: 19px; }
  .iti-flag.ne {
    width: 18px; }
  .iti-flag.np {
    width: 13px; }
  .iti-flag.va {
    width: 15px; }
  @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    .iti-flag {
      background-size: 5630px 15px; } }
  .iti-flag.ac {
    height: 10px;
    background-position: 0px 0px; }
  .iti-flag.ad {
    height: 14px;
    background-position: -22px 0px; }
  .iti-flag.ae {
    height: 10px;
    background-position: -44px 0px; }
  .iti-flag.af {
    height: 14px;
    background-position: -66px 0px; }
  .iti-flag.ag {
    height: 14px;
    background-position: -88px 0px; }
  .iti-flag.ai {
    height: 10px;
    background-position: -110px 0px; }
  .iti-flag.al {
    height: 15px;
    background-position: -132px 0px; }
  .iti-flag.am {
    height: 10px;
    background-position: -154px 0px; }
  .iti-flag.ao {
    height: 14px;
    background-position: -176px 0px; }
  .iti-flag.aq {
    height: 14px;
    background-position: -198px 0px; }
  .iti-flag.ar {
    height: 13px;
    background-position: -220px 0px; }
  .iti-flag.as {
    height: 10px;
    background-position: -242px 0px; }
  .iti-flag.at {
    height: 14px;
    background-position: -264px 0px; }
  .iti-flag.au {
    height: 10px;
    background-position: -286px 0px; }
  .iti-flag.aw {
    height: 14px;
    background-position: -308px 0px; }
  .iti-flag.ax {
    height: 13px;
    background-position: -330px 0px; }
  .iti-flag.az {
    height: 10px;
    background-position: -352px 0px; }
  .iti-flag.ba {
    height: 10px;
    background-position: -374px 0px; }
  .iti-flag.bb {
    height: 14px;
    background-position: -396px 0px; }
  .iti-flag.bd {
    height: 12px;
    background-position: -418px 0px; }
  .iti-flag.be {
    height: 15px;
    background-position: -440px 0px; }
  .iti-flag.bf {
    height: 14px;
    background-position: -460px 0px; }
  .iti-flag.bg {
    height: 12px;
    background-position: -482px 0px; }
  .iti-flag.bh {
    height: 12px;
    background-position: -504px 0px; }
  .iti-flag.bi {
    height: 12px;
    background-position: -526px 0px; }
  .iti-flag.bj {
    height: 14px;
    background-position: -548px 0px; }
  .iti-flag.bl {
    height: 14px;
    background-position: -570px 0px; }
  .iti-flag.bm {
    height: 10px;
    background-position: -592px 0px; }
  .iti-flag.bn {
    height: 10px;
    background-position: -614px 0px; }
  .iti-flag.bo {
    height: 14px;
    background-position: -636px 0px; }
  .iti-flag.bq {
    height: 14px;
    background-position: -658px 0px; }
  .iti-flag.br {
    height: 14px;
    background-position: -680px 0px; }
  .iti-flag.bs {
    height: 10px;
    background-position: -702px 0px; }
  .iti-flag.bt {
    height: 14px;
    background-position: -724px 0px; }
  .iti-flag.bv {
    height: 15px;
    background-position: -746px 0px; }
  .iti-flag.bw {
    height: 14px;
    background-position: -768px 0px; }
  .iti-flag.by {
    height: 10px;
    background-position: -790px 0px; }
  .iti-flag.bz {
    height: 14px;
    background-position: -812px 0px; }
  .iti-flag.ca {
    height: 10px;
    background-position: -834px 0px; }
  .iti-flag.cc {
    height: 10px;
    background-position: -856px 0px; }
  .iti-flag.cd {
    height: 15px;
    background-position: -878px 0px; }
  .iti-flag.cf {
    height: 14px;
    background-position: -900px 0px; }
  .iti-flag.cg {
    height: 14px;
    background-position: -922px 0px; }
  .iti-flag.ch {
    height: 15px;
    background-position: -944px 0px; }
  .iti-flag.ci {
    height: 14px;
    background-position: -961px 0px; }
  .iti-flag.ck {
    height: 10px;
    background-position: -983px 0px; }
  .iti-flag.cl {
    height: 14px;
    background-position: -1005px 0px; }
  .iti-flag.cm {
    height: 14px;
    background-position: -1027px 0px; }
  .iti-flag.cn {
    height: 14px;
    background-position: -1049px 0px; }
  .iti-flag.co {
    height: 14px;
    background-position: -1071px 0px; }
  .iti-flag.cp {
    height: 14px;
    background-position: -1093px 0px; }
  .iti-flag.cr {
    height: 12px;
    background-position: -1115px 0px; }
  .iti-flag.cu {
    height: 10px;
    background-position: -1137px 0px; }
  .iti-flag.cv {
    height: 12px;
    background-position: -1159px 0px; }
  .iti-flag.cw {
    height: 14px;
    background-position: -1181px 0px; }
  .iti-flag.cx {
    height: 10px;
    background-position: -1203px 0px; }
  .iti-flag.cy {
    height: 13px;
    background-position: -1225px 0px; }
  .iti-flag.cz {
    height: 14px;
    background-position: -1247px 0px; }
  .iti-flag.de {
    height: 12px;
    background-position: -1269px 0px; }
  .iti-flag.dg {
    height: 10px;
    background-position: -1291px 0px; }
  .iti-flag.dj {
    height: 14px;
    background-position: -1313px 0px; }
  .iti-flag.dk {
    height: 15px;
    background-position: -1335px 0px; }
  .iti-flag.dm {
    height: 10px;
    background-position: -1357px 0px; }
  .iti-flag.do {
    height: 13px;
    background-position: -1379px 0px; }
  .iti-flag.dz {
    height: 14px;
    background-position: -1401px 0px; }
  .iti-flag.ea {
    height: 14px;
    background-position: -1423px 0px; }
  .iti-flag.ec {
    height: 14px;
    background-position: -1445px 0px; }
  .iti-flag.ee {
    height: 13px;
    background-position: -1467px 0px; }
  .iti-flag.eg {
    height: 14px;
    background-position: -1489px 0px; }
  .iti-flag.eh {
    height: 10px;
    background-position: -1511px 0px; }
  .iti-flag.er {
    height: 10px;
    background-position: -1533px 0px; }
  .iti-flag.es {
    height: 14px;
    background-position: -1555px 0px; }
  .iti-flag.et {
    height: 10px;
    background-position: -1577px 0px; }
  .iti-flag.eu {
    height: 14px;
    background-position: -1599px 0px; }
  .iti-flag.fi {
    height: 12px;
    background-position: -1621px 0px; }
  .iti-flag.fj {
    height: 10px;
    background-position: -1643px 0px; }
  .iti-flag.fk {
    height: 10px;
    background-position: -1665px 0px; }
  .iti-flag.fm {
    height: 11px;
    background-position: -1687px 0px; }
  .iti-flag.fo {
    height: 15px;
    background-position: -1709px 0px; }
  .iti-flag.fr {
    height: 14px;
    background-position: -1731px 0px; }
  .iti-flag.ga {
    height: 15px;
    background-position: -1753px 0px; }
  .iti-flag.gb {
    height: 10px;
    background-position: -1775px 0px; }
  .iti-flag.gd {
    height: 12px;
    background-position: -1797px 0px; }
  .iti-flag.ge {
    height: 14px;
    background-position: -1819px 0px; }
  .iti-flag.gf {
    height: 14px;
    background-position: -1841px 0px; }
  .iti-flag.gg {
    height: 14px;
    background-position: -1863px 0px; }
  .iti-flag.gh {
    height: 14px;
    background-position: -1885px 0px; }
  .iti-flag.gi {
    height: 10px;
    background-position: -1907px 0px; }
  .iti-flag.gl {
    height: 14px;
    background-position: -1929px 0px; }
  .iti-flag.gm {
    height: 14px;
    background-position: -1951px 0px; }
  .iti-flag.gn {
    height: 14px;
    background-position: -1973px 0px; }
  .iti-flag.gp {
    height: 14px;
    background-position: -1995px 0px; }
  .iti-flag.gq {
    height: 14px;
    background-position: -2017px 0px; }
  .iti-flag.gr {
    height: 14px;
    background-position: -2039px 0px; }
  .iti-flag.gs {
    height: 10px;
    background-position: -2061px 0px; }
  .iti-flag.gt {
    height: 13px;
    background-position: -2083px 0px; }
  .iti-flag.gu {
    height: 11px;
    background-position: -2105px 0px; }
  .iti-flag.gw {
    height: 10px;
    background-position: -2127px 0px; }
  .iti-flag.gy {
    height: 12px;
    background-position: -2149px 0px; }
  .iti-flag.hk {
    height: 14px;
    background-position: -2171px 0px; }
  .iti-flag.hm {
    height: 10px;
    background-position: -2193px 0px; }
  .iti-flag.hn {
    height: 10px;
    background-position: -2215px 0px; }
  .iti-flag.hr {
    height: 10px;
    background-position: -2237px 0px; }
  .iti-flag.ht {
    height: 12px;
    background-position: -2259px 0px; }
  .iti-flag.hu {
    height: 10px;
    background-position: -2281px 0px; }
  .iti-flag.ic {
    height: 14px;
    background-position: -2303px 0px; }
  .iti-flag.id {
    height: 14px;
    background-position: -2325px 0px; }
  .iti-flag.ie {
    height: 10px;
    background-position: -2347px 0px; }
  .iti-flag.il {
    height: 15px;
    background-position: -2369px 0px; }
  .iti-flag.im {
    height: 10px;
    background-position: -2391px 0px; }
  .iti-flag.in {
    height: 14px;
    background-position: -2413px 0px; }
  .iti-flag.io {
    height: 10px;
    background-position: -2435px 0px; }
  .iti-flag.iq {
    height: 14px;
    background-position: -2457px 0px; }
  .iti-flag.ir {
    height: 12px;
    background-position: -2479px 0px; }
  .iti-flag.is {
    height: 15px;
    background-position: -2501px 0px; }
  .iti-flag.it {
    height: 14px;
    background-position: -2523px 0px; }
  .iti-flag.je {
    height: 12px;
    background-position: -2545px 0px; }
  .iti-flag.jm {
    height: 10px;
    background-position: -2567px 0px; }
  .iti-flag.jo {
    height: 10px;
    background-position: -2589px 0px; }
  .iti-flag.jp {
    height: 14px;
    background-position: -2611px 0px; }
  .iti-flag.ke {
    height: 14px;
    background-position: -2633px 0px; }
  .iti-flag.kg {
    height: 12px;
    background-position: -2655px 0px; }
  .iti-flag.kh {
    height: 13px;
    background-position: -2677px 0px; }
  .iti-flag.ki {
    height: 10px;
    background-position: -2699px 0px; }
  .iti-flag.km {
    height: 12px;
    background-position: -2721px 0px; }
  .iti-flag.kn {
    height: 14px;
    background-position: -2743px 0px; }
  .iti-flag.kp {
    height: 10px;
    background-position: -2765px 0px; }
  .iti-flag.kr {
    height: 14px;
    background-position: -2787px 0px; }
  .iti-flag.kw {
    height: 10px;
    background-position: -2809px 0px; }
  .iti-flag.ky {
    height: 10px;
    background-position: -2831px 0px; }
  .iti-flag.kz {
    height: 10px;
    background-position: -2853px 0px; }
  .iti-flag.la {
    height: 14px;
    background-position: -2875px 0px; }
  .iti-flag.lb {
    height: 14px;
    background-position: -2897px 0px; }
  .iti-flag.lc {
    height: 10px;
    background-position: -2919px 0px; }
  .iti-flag.li {
    height: 12px;
    background-position: -2941px 0px; }
  .iti-flag.lk {
    height: 10px;
    background-position: -2963px 0px; }
  .iti-flag.lr {
    height: 11px;
    background-position: -2985px 0px; }
  .iti-flag.ls {
    height: 14px;
    background-position: -3007px 0px; }
  .iti-flag.lt {
    height: 12px;
    background-position: -3029px 0px; }
  .iti-flag.lu {
    height: 12px;
    background-position: -3051px 0px; }
  .iti-flag.lv {
    height: 10px;
    background-position: -3073px 0px; }
  .iti-flag.ly {
    height: 10px;
    background-position: -3095px 0px; }
  .iti-flag.ma {
    height: 14px;
    background-position: -3117px 0px; }
  .iti-flag.mc {
    height: 15px;
    background-position: -3139px 0px; }
  .iti-flag.md {
    height: 10px;
    background-position: -3160px 0px; }
  .iti-flag.me {
    height: 10px;
    background-position: -3182px 0px; }
  .iti-flag.mf {
    height: 14px;
    background-position: -3204px 0px; }
  .iti-flag.mg {
    height: 14px;
    background-position: -3226px 0px; }
  .iti-flag.mh {
    height: 11px;
    background-position: -3248px 0px; }
  .iti-flag.mk {
    height: 10px;
    background-position: -3270px 0px; }
  .iti-flag.ml {
    height: 14px;
    background-position: -3292px 0px; }
  .iti-flag.mm {
    height: 14px;
    background-position: -3314px 0px; }
  .iti-flag.mn {
    height: 10px;
    background-position: -3336px 0px; }
  .iti-flag.mo {
    height: 14px;
    background-position: -3358px 0px; }
  .iti-flag.mp {
    height: 10px;
    background-position: -3380px 0px; }
  .iti-flag.mq {
    height: 14px;
    background-position: -3402px 0px; }
  .iti-flag.mr {
    height: 14px;
    background-position: -3424px 0px; }
  .iti-flag.ms {
    height: 10px;
    background-position: -3446px 0px; }
  .iti-flag.mt {
    height: 14px;
    background-position: -3468px 0px; }
  .iti-flag.mu {
    height: 14px;
    background-position: -3490px 0px; }
  .iti-flag.mv {
    height: 14px;
    background-position: -3512px 0px; }
  .iti-flag.mw {
    height: 14px;
    background-position: -3534px 0px; }
  .iti-flag.mx {
    height: 12px;
    background-position: -3556px 0px; }
  .iti-flag.my {
    height: 10px;
    background-position: -3578px 0px; }
  .iti-flag.mz {
    height: 14px;
    background-position: -3600px 0px; }
  .iti-flag.na {
    height: 14px;
    background-position: -3622px 0px; }
  .iti-flag.nc {
    height: 10px;
    background-position: -3644px 0px; }
  .iti-flag.ne {
    height: 15px;
    background-position: -3666px 0px; }
  .iti-flag.nf {
    height: 10px;
    background-position: -3686px 0px; }
  .iti-flag.ng {
    height: 10px;
    background-position: -3708px 0px; }
  .iti-flag.ni {
    height: 12px;
    background-position: -3730px 0px; }
  .iti-flag.nl {
    height: 14px;
    background-position: -3752px 0px; }
  .iti-flag.no {
    height: 15px;
    background-position: -3774px 0px; }
  .iti-flag.np {
    height: 15px;
    background-position: -3796px 0px; }
  .iti-flag.nr {
    height: 10px;
    background-position: -3811px 0px; }
  .iti-flag.nu {
    height: 10px;
    background-position: -3833px 0px; }
  .iti-flag.nz {
    height: 10px;
    background-position: -3855px 0px; }
  .iti-flag.om {
    height: 10px;
    background-position: -3877px 0px; }
  .iti-flag.pa {
    height: 14px;
    background-position: -3899px 0px; }
  .iti-flag.pe {
    height: 14px;
    background-position: -3921px 0px; }
  .iti-flag.pf {
    height: 14px;
    background-position: -3943px 0px; }
  .iti-flag.pg {
    height: 15px;
    background-position: -3965px 0px; }
  .iti-flag.ph {
    height: 10px;
    background-position: -3987px 0px; }
  .iti-flag.pk {
    height: 14px;
    background-position: -4009px 0px; }
  .iti-flag.pl {
    height: 13px;
    background-position: -4031px 0px; }
  .iti-flag.pm {
    height: 14px;
    background-position: -4053px 0px; }
  .iti-flag.pn {
    height: 10px;
    background-position: -4075px 0px; }
  .iti-flag.pr {
    height: 14px;
    background-position: -4097px 0px; }
  .iti-flag.ps {
    height: 10px;
    background-position: -4119px 0px; }
  .iti-flag.pt {
    height: 14px;
    background-position: -4141px 0px; }
  .iti-flag.pw {
    height: 13px;
    background-position: -4163px 0px; }
  .iti-flag.py {
    height: 11px;
    background-position: -4185px 0px; }
  .iti-flag.qa {
    height: 8px;
    background-position: -4207px 0px; }
  .iti-flag.re {
    height: 14px;
    background-position: -4229px 0px; }
  .iti-flag.ro {
    height: 14px;
    background-position: -4251px 0px; }
  .iti-flag.rs {
    height: 14px;
    background-position: -4273px 0px; }
  .iti-flag.ru {
    height: 14px;
    background-position: -4295px 0px; }
  .iti-flag.rw {
    height: 14px;
    background-position: -4317px 0px; }
  .iti-flag.sa {
    height: 14px;
    background-position: -4339px 0px; }
  .iti-flag.sb {
    height: 10px;
    background-position: -4361px 0px; }
  .iti-flag.sc {
    height: 10px;
    background-position: -4383px 0px; }
  .iti-flag.sd {
    height: 10px;
    background-position: -4405px 0px; }
  .iti-flag.se {
    height: 13px;
    background-position: -4427px 0px; }
  .iti-flag.sg {
    height: 14px;
    background-position: -4449px 0px; }
  .iti-flag.sh {
    height: 10px;
    background-position: -4471px 0px; }
  .iti-flag.si {
    height: 10px;
    background-position: -4493px 0px; }
  .iti-flag.sj {
    height: 15px;
    background-position: -4515px 0px; }
  .iti-flag.sk {
    height: 14px;
    background-position: -4537px 0px; }
  .iti-flag.sl {
    height: 14px;
    background-position: -4559px 0px; }
  .iti-flag.sm {
    height: 15px;
    background-position: -4581px 0px; }
  .iti-flag.sn {
    height: 14px;
    background-position: -4603px 0px; }
  .iti-flag.so {
    height: 14px;
    background-position: -4625px 0px; }
  .iti-flag.sr {
    height: 14px;
    background-position: -4647px 0px; }
  .iti-flag.ss {
    height: 10px;
    background-position: -4669px 0px; }
  .iti-flag.st {
    height: 10px;
    background-position: -4691px 0px; }
  .iti-flag.sv {
    height: 12px;
    background-position: -4713px 0px; }
  .iti-flag.sx {
    height: 14px;
    background-position: -4735px 0px; }
  .iti-flag.sy {
    height: 14px;
    background-position: -4757px 0px; }
  .iti-flag.sz {
    height: 14px;
    background-position: -4779px 0px; }
  .iti-flag.ta {
    height: 10px;
    background-position: -4801px 0px; }
  .iti-flag.tc {
    height: 10px;
    background-position: -4823px 0px; }
  .iti-flag.td {
    height: 14px;
    background-position: -4845px 0px; }
  .iti-flag.tf {
    height: 14px;
    background-position: -4867px 0px; }
  .iti-flag.tg {
    height: 13px;
    background-position: -4889px 0px; }
  .iti-flag.th {
    height: 14px;
    background-position: -4911px 0px; }
  .iti-flag.tj {
    height: 10px;
    background-position: -4933px 0px; }
  .iti-flag.tk {
    height: 10px;
    background-position: -4955px 0px; }
  .iti-flag.tl {
    height: 10px;
    background-position: -4977px 0px; }
  .iti-flag.tm {
    height: 14px;
    background-position: -4999px 0px; }
  .iti-flag.tn {
    height: 14px;
    background-position: -5021px 0px; }
  .iti-flag.to {
    height: 10px;
    background-position: -5043px 0px; }
  .iti-flag.tr {
    height: 14px;
    background-position: -5065px 0px; }
  .iti-flag.tt {
    height: 12px;
    background-position: -5087px 0px; }
  .iti-flag.tv {
    height: 10px;
    background-position: -5109px 0px; }
  .iti-flag.tw {
    height: 14px;
    background-position: -5131px 0px; }
  .iti-flag.tz {
    height: 14px;
    background-position: -5153px 0px; }
  .iti-flag.ua {
    height: 14px;
    background-position: -5175px 0px; }
  .iti-flag.ug {
    height: 14px;
    background-position: -5197px 0px; }
  .iti-flag.um {
    height: 11px;
    background-position: -5219px 0px; }
  .iti-flag.us {
    height: 11px;
    background-position: -5241px 0px; }
  .iti-flag.uy {
    height: 14px;
    background-position: -5263px 0px; }
  .iti-flag.uz {
    height: 10px;
    background-position: -5285px 0px; }
  .iti-flag.va {
    height: 15px;
    background-position: -5307px 0px; }
  .iti-flag.vc {
    height: 14px;
    background-position: -5324px 0px; }
  .iti-flag.ve {
    height: 14px;
    background-position: -5346px 0px; }
  .iti-flag.vg {
    height: 10px;
    background-position: -5368px 0px; }
  .iti-flag.vi {
    height: 14px;
    background-position: -5390px 0px; }
  .iti-flag.vn {
    height: 14px;
    background-position: -5412px 0px; }
  .iti-flag.vu {
    height: 12px;
    background-position: -5434px 0px; }
  .iti-flag.wf {
    height: 14px;
    background-position: -5456px 0px; }
  .iti-flag.ws {
    height: 10px;
    background-position: -5478px 0px; }
  .iti-flag.xk {
    height: 15px;
    background-position: -5500px 0px; }
  .iti-flag.ye {
    height: 14px;
    background-position: -5522px 0px; }
  .iti-flag.yt {
    height: 14px;
    background-position: -5544px 0px; }
  .iti-flag.za {
    height: 14px;
    background-position: -5566px 0px; }
  .iti-flag.zm {
    height: 14px;
    background-position: -5588px 0px; }
  .iti-flag.zw {
    height: 10px;
    background-position: -5610px 0px; }

.iti-flag {
  width: 20px;
  height: 15px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: url("//webassets.zearn.org/app_assets/devise_authy/flags.png");
  background-repeat: no-repeat;
  background-color: #DBDBDB;
  background-position: 20px 0; }
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
  .iti-flag {
    background-image: url("//webassets.zearn.org/app_assets/devise_authy/flags@2x.png"); } }

.iti-flag.np {
  background-color: transparent; }
@keyframes plyr-progress{to{background-position:25px 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;direction:ltr;font-family:Avenir,"Avenir Next","Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif;font-variant-numeric:tabular-nums;font-weight:500;line-height:1.7;max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease}.plyr audio,.plyr video{border-radius:inherit;height:auto;vertical-align:middle;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4f5b5f;border-radius:2px;color:#fff;font-size:9px;line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;color:#fff;display:none;font-size:14px;left:0;padding:10px;position:absolute;text-align:center;transform:translateY(-40px);transition:transform .4s ease-in-out;width:100%}.plyr__captions .plyr__caption{background:rgba(0,0,0,.8);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__captions .plyr__caption div{display:inline}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:16px;padding:20px}}@media (min-width:768px){.plyr__captions{font-size:18px}}.plyr--captions-active .plyr__captions{display:block}.plyr--hide-controls .plyr__captions{transform:translateY(-15px)}.plyr__control{background:0 0;border:0;border-radius:3px;color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;pointer-events:none;width:18px}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{box-shadow:0 0 0 3px rgba(26,175,255,.35);outline:0}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#1aafff;color:#fff}.plyr__control--overlaid{background:rgba(26,175,255,.8);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15);color:#fff;display:none;left:50%;padding:15px;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:2}.plyr__control--overlaid svg{height:20px;left:2px;position:relative;width:20px}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#1aafff}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__menu,.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls>.plyr__control{margin-left:5px}.plyr__controls .plyr__menu:first-child,.plyr__controls .plyr__menu:first-child+[data-plyr=pause],.plyr__controls .plyr__progress:first-child,.plyr__controls .plyr__progress:first-child+[data-plyr=pause],.plyr__controls .plyr__time:first-child,.plyr__controls .plyr__time:first-child+[data-plyr=pause],.plyr__controls>.plyr__control:first-child,.plyr__controls>.plyr__control:first-child+[data-plyr=pause]{margin-left:0;margin-right:auto}.plyr__controls .plyr__volume{margin-left:5px}@media (min-width:480px){.plyr__controls .plyr__menu,.plyr__controls .plyr__progress,.plyr__controls .plyr__time,.plyr__controls>.plyr__control{margin-left:10px}.plyr__controls .plyr__menu+.plyr__control,.plyr__controls>.plyr__control+.plyr__control,.plyr__controls>.plyr__control+.plyr__menu{margin-left:5px}}.plyr--video .plyr__controls{background:linear-gradient(transparent,rgba(0,0,0,.7));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;left:0;padding:35px 10px 10px;position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:2}.plyr--video .plyr__controls .plyr__control svg{-webkit-filter:drop-shadow(0 1px 1px rgba(0, 0, 0, .15));filter:drop-shadow(0 1px 1px rgba(0, 0, 0, .15))}.plyr--video .plyr__controls .plyr__control.plyr__tab-focus,.plyr--video .plyr__controls .plyr__control:hover,.plyr--video .plyr__controls .plyr__control[aria-expanded=true]{background:#1aafff;color:#fff}.plyr--audio .plyr__controls{background:#fff;border-radius:inherit;color:#4f5b5f;padding:10px}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__controls:empty{display:none}.plyr__controls:empty~.plyr__captions{transform:translateY(0)}.plyr__video-embed{height:0;padding-bottom:56.25%;position:relative}.plyr__video-embed iframe{border:0;height:100%;left:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4f5b5f;font-size:16px;margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border-top-color:rgba(255,255,255,.9);content:'';height:0;position:absolute;right:15px;top:100%;width:0}.plyr__menu__container ul{list-style:none;margin:0;overflow:hidden;padding:7px}.plyr__menu__container ul li{margin-top:2px}.plyr__menu__container ul li:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4f5b5f;display:flex;font-size:14px;padding:4px 14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:28px}.plyr__menu__container .plyr__control--forward::after{border-left-color:rgba(79,91,95,.8);right:5px}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:500;margin:7px;margin-bottom:3px;padding-left:28px;position:relative;width:calc(100% - 14px)}.plyr__menu__container .plyr__control--back::after{border-right-color:rgba(79,91,95,.8);left:7px}.plyr__menu__container .plyr__control--back::before{background:#b7c5cd;box-shadow:0 1px 0 #fff;content:'';height:1px;left:0;margin-top:4px;overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container label.plyr__control{padding-left:7px}.plyr__menu__container label.plyr__control input[type=radio]+span{background:rgba(0,0,0,.1);border-radius:100%;display:block;flex-shrink:0;height:16px;margin-right:10px;position:relative;transition:all .3s ease;width:16px}.plyr__menu__container label.plyr__control input[type=radio]+span::after{background:#fff;border-radius:100%;content:'';height:6px;left:5px;opacity:0;position:absolute;top:5px;transform:scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container label.plyr__control input[type=radio]:checked+span{background:#1aafff}.plyr__menu__container label.plyr__control input[type=radio]:checked+span::after{opacity:1;transform:scale(1)}.plyr__menu__container label.plyr__control input[type=radio]:focus+span{box-shadow:0 0 0 3px rgba(26,175,255,.35);outline:0}.plyr__menu__container label.plyr__control.plyr__tab-focus input[type=radio]+span,.plyr__menu__container label.plyr__control:hover input[type=radio]+span{background:rgba(0,0,0,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-7px;overflow:hidden;padding-left:25px;pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:28px;color:#1aafff;display:block;height:20px;margin:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:3px;height:6px;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);box-sizing:border-box;height:14px;position:relative;transition:all .2s ease;width:14px;-webkit-appearance:none;margin-top:-4px}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:3px;height:6px;-moz-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);box-sizing:border-box;height:14px;position:relative;transition:all .2s ease;width:14px}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:3px;height:6px}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:3px;height:6px;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:3px;height:6px;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:3px;height:6px;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2);box-sizing:border-box;height:14px;position:relative;transition:all .2s ease;width:14px;margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{box-shadow:0 0 0 3px rgba(26,175,255,.35);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{box-shadow:0 0 0 3px rgba(26,175,255,.35);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{box-shadow:0 0 0 3px rgba(26,175,255,.35);outline:0}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(183,197,205,.66)}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(47,52,61,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr__poster{background-color:#000;background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1;pointer-events:none}.plyr__time{font-size:14px}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px}@media (max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr--video .plyr__time{text-shadow:0 1px 1px rgba(0,0,0,.15)}.plyr__tooltip{background:rgba(255,255,255,.9);border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4f5b5f;font-size:14px;font-weight:500;line-height:1.3;margin-bottom:10px;opacity:0;padding:5px 7.5px;pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.9);bottom:-4px;content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:16px}.plyr__controls>.plyr__control:last-child .plyr__tooltip{right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:16px;transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr--video{overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;border-radius:inherit;overflow:hidden;position:relative;z-index:0}.plyr__progress{display:flex;flex:1;left:7px;margin-right:14px;position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-7px;margin-right:-7px;width:calc(100% + 14px)}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:14px;left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:6px;left:0;margin-top:-3px;padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0;transition:width .2s ease}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:6px}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:6px;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;transition:width .2s ease}.plyr--video .plyr__progress__buffer{box-shadow:0 1px 1px rgba(0,0,0,.15);color:rgba(255,255,255,.25)}.plyr--audio .plyr__progress__buffer{color:rgba(183,197,205,.66)}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(47,52,61,.6) 25%,transparent 25%,transparent 50%,rgba(47,52,61,.6) 50%,rgba(47,52,61,.6) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25)}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(183,197,205,.66)}.plyr__volume{flex:1;position:relative}.plyr__volume input[type=range]{position:relative;z-index:2}@media (min-width:480px){.plyr__volume{max-width:50px}}@media (min-width:768px){.plyr__volume{max-width:80px}}.plyr--is-ios .plyr__volume{display:none!important}.plyr--is-ios.plyr--vimeo [data-plyr=mute]{display:none!important}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:-webkit-full-screen .plyr__video-embed{overflow:visible}.plyr:-moz-full-screen .plyr__video-embed{overflow:visible}.plyr:-ms-fullscreen .plyr__video-embed{overflow:visible}.plyr:fullscreen .plyr__video-embed{overflow:visible}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}.plyr:-moz-full-screen .plyr__captions{font-size:21px}.plyr:-ms-fullscreen .plyr__captions{font-size:21px}.plyr:fullscreen .plyr__captions{font-size:21px}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-webkit-full-screen .plyr__video-embed{overflow:visible}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;width:100%}.plyr:-moz-full-screen .plyr__video-embed{overflow:visible}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;width:100%}.plyr:-ms-fullscreen .plyr__video-embed{overflow:visible}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;width:100%}.plyr--fullscreen-fallback .plyr__video-embed{overflow:visible}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;top:50%;transform:translateY(-50%)}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:rgba(47,52,61,.8);border-radius:2px;bottom:10px;color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:6px;left:0;margin:-3px 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}
/*!
Chosen, a Select Box Enhancer for jQuery and Prototype
by Patrick Filler for Harvest, http://getharvest.com

Version 1.4.2
Full source at https://github.com/harvesthq/chosen
Copyright (c) 2011-2015 Harvest http://getharvest.com

MIT License, https://github.com/harvesthq/chosen/blob/master/LICENSE.md
This file is generated by `grunt build`, do not edit it by hand.
*/
/* @group Base */
/* line 16, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  font-size: 13px;
  zoom: 1;
  *display: inline;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

/* line 27, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* line 32, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-drop {
  position: absolute;
  top: 100%;
  left: -9999px;
  z-index: 1010;
  width: 100%;
  border: 1px solid #aaa;
  border-top: 0;
  background: #fff;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}

/* line 43, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container.chosen-with-drop .chosen-drop {
  left: 0;
}

/* line 46, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container a {
  cursor: pointer;
}

/* line 49, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .search-choice .group-name, .chosen-container .chosen-single .group-name {
  margin-right: 4px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: normal;
  color: #999999;
}

/* line 57, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .search-choice .group-name:after, .chosen-container .chosen-single .group-name:after {
  content: ":";
  padding-left: 2px;
  vertical-align: top;
}

/* @end */
/* @group Single Chosen */
/* line 65, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 0 0 0 8px;
  height: 25px;
  border: 1px solid #aaa;
  border-radius: 5px;
  background-color: #fff;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #ffffff), color-stop(50%, #f6f6f6), color-stop(52%, #eeeeee), color-stop(100%, #f4f4f4));
  background: -webkit-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
  background: -moz-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
  background: -o-linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
  background: linear-gradient(top, #ffffff 20%, #f6f6f6 50%, #eeeeee 52%, #f4f4f4 100%);
  background-clip: padding-box;
  box-shadow: 0 0 3px white inset, 0 1px 1px rgba(0, 0, 0, 0.1);
  color: #444;
  text-decoration: none;
  white-space: nowrap;
  line-height: 24px;
}

/* line 86, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-default {
  color: #999;
}

/* line 89, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single span {
  display: block;
  overflow: hidden;
  margin-right: 26px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* line 96, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single-with-deselect span {
  margin-right: 38px;
}

/* line 99, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single abbr {
  position: absolute;
  top: 6px;
  right: 26px;
  display: block;
  width: 12px;
  height: 12px;
  background: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") -42px 1px no-repeat;
  font-size: 1px;
}

/* line 109, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single abbr:hover {
  background-position: -42px -10px;
}

/* line 112, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single.chosen-disabled .chosen-single abbr:hover {
  background-position: -42px -10px;
}

/* line 115, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single div {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  width: 18px;
  height: 100%;
}

/* line 123, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-single div b {
  display: block;
  width: 100%;
  height: 100%;
  background: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") no-repeat 0px 2px;
}

/* line 129, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-search {
  position: relative;
  z-index: 1010;
  margin: 0;
  padding: 3px 4px;
  white-space: nowrap;
}

/* line 136, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-search input[type="text"] {
  margin: 1px 0;
  padding: 4px 20px 4px 5px;
  width: 100%;
  height: auto;
  outline: 0;
  border: 1px solid #aaa;
  background: white url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") no-repeat 100% -20px;
  background: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") no-repeat 100% -20px;
  font-size: 1em;
  font-family: sans-serif;
  line-height: normal;
  border-radius: 0;
}

/* line 150, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single .chosen-drop {
  margin-top: -1px;
  border-radius: 0 0 4px 4px;
  background-clip: padding-box;
}

/* line 155, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-single.chosen-container-single-nosearch .chosen-search {
  position: absolute;
  left: -9999px;
}

/* @end */
/* @group Results */
/* line 162, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results {
  color: #444;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
  margin: 0 4px 4px 0;
  padding: 0 0 0 4px;
  max-height: 240px;
  -webkit-overflow-scrolling: touch;
}

/* line 172, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li {
  display: none;
  margin: 0;
  padding: 5px 6px;
  list-style: none;
  line-height: 15px;
  word-wrap: break-word;
  -webkit-touch-callout: none;
}

/* line 181, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.active-result {
  display: list-item;
  cursor: pointer;
}

/* line 185, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.disabled-result {
  display: list-item;
  color: #ccc;
  cursor: default;
}

/* line 190, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.highlighted {
  background-color: #3875d7;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #3875d7), color-stop(90%, #2a62bc));
  background-image: -webkit-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: -moz-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: -o-linear-gradient(#3875d7 20%, #2a62bc 90%);
  background-image: linear-gradient(#3875d7 20%, #2a62bc 90%);
  color: #fff;
}

/* line 199, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.no-results {
  color: #777;
  display: list-item;
  background: #f4f4f4;
}

/* line 204, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.group-result {
  display: list-item;
  font-weight: bold;
  cursor: default;
}

/* line 209, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li.group-option {
  padding-left: 15px;
}

/* line 212, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container .chosen-results li em {
  font-style: normal;
  text-decoration: underline;
}

/* @end */
/* @group Multi Chosen */
/* line 219, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices {
  position: relative;
  overflow: hidden;
  margin: 0;
  padding: 0 5px;
  width: 100%;
  height: auto !important;
  height: 1%;
  border: 1px solid #aaa;
  background-color: #fff;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(1%, #eeeeee), color-stop(15%, #ffffff));
  background-image: -webkit-linear-gradient(#eeeeee 1%, #ffffff 15%);
  background-image: -moz-linear-gradient(#eeeeee 1%, #ffffff 15%);
  background-image: -o-linear-gradient(#eeeeee 1%, #ffffff 15%);
  background-image: linear-gradient(#eeeeee 1%, #ffffff 15%);
  cursor: text;
}

/* line 236, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li {
  float: left;
  list-style: none;
}

/* line 240, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-field {
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

/* line 245, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
  margin: 1px 0;
  padding: 0;
  height: 25px;
  outline: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none;
  color: #999;
  font-size: 100%;
  font-family: sans-serif;
  line-height: normal;
  border-radius: 0;
}

/* line 259, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice {
  position: relative;
  margin: 3px 5px 3px 0;
  padding: 3px 20px 3px 5px;
  border: 1px solid #aaa;
  max-width: 100%;
  border-radius: 3px;
  background-color: #eeeeee;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
  background-image: -webkit-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -moz-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -o-linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: linear-gradient(#f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-size: 100% 19px;
  background-repeat: repeat-x;
  background-clip: padding-box;
  box-shadow: 0 0 2px white inset, 0 1px 0 rgba(0, 0, 0, 0.05);
  color: #333;
  line-height: 13px;
  cursor: default;
}

/* line 280, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice span {
  word-wrap: break-word;
}

/* line 283, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
  position: absolute;
  top: 4px;
  right: 3px;
  display: block;
  width: 12px;
  height: 12px;
  background: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") -42px 1px no-repeat;
  font-size: 1px;
}

/* line 293, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover {
  background-position: -42px -10px;
}

/* line 296, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice-disabled {
  padding-right: 5px;
  border: 1px solid #ccc;
  background-color: #e4e4e4;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #f4f4f4), color-stop(50%, #f0f0f0), color-stop(52%, #e8e8e8), color-stop(100%, #eeeeee));
  background-image: -webkit-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -moz-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: -o-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
  color: #666;
}

/* line 307, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice-focus {
  background: #d4d4d4;
}

/* line 310, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-choices li.search-choice-focus .search-choice-close {
  background-position: -42px -10px;
}

/* line 313, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-results {
  margin: 0;
  padding: 0;
}

/* line 317, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-multi .chosen-drop .result-selected {
  display: list-item;
  color: #ccc;
  cursor: default;
}

/* @end */
/* @group Active  */
/* line 325, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active .chosen-single {
  border: 1px solid #5897fb;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

/* line 329, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active.chosen-with-drop .chosen-single {
  border: 1px solid #aaa;
  -moz-border-radius-bottomright: 0;
  border-bottom-right-radius: 0;
  -moz-border-radius-bottomleft: 0;
  border-bottom-left-radius: 0;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(20%, #eeeeee), color-stop(80%, #ffffff));
  background-image: -webkit-linear-gradient(#eeeeee 20%, #ffffff 80%);
  background-image: -moz-linear-gradient(#eeeeee 20%, #ffffff 80%);
  background-image: -o-linear-gradient(#eeeeee 20%, #ffffff 80%);
  background-image: linear-gradient(#eeeeee 20%, #ffffff 80%);
  box-shadow: 0 1px 0 #fff inset;
}

/* line 342, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active.chosen-with-drop .chosen-single div {
  border-left: none;
  background: transparent;
}

/* line 346, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active.chosen-with-drop .chosen-single div b {
  background-position: -18px 2px;
}

/* line 349, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active .chosen-choices {
  border: 1px solid #5897fb;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

/* line 353, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-container-active .chosen-choices li.search-field input[type="text"] {
  color: #222 !important;
}

/* @end */
/* @group Disabled Support */
/* line 359, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-disabled {
  opacity: 0.5 !important;
  cursor: default;
}

/* line 363, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-disabled .chosen-single {
  cursor: default;
}

/* line 366, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-disabled .chosen-choices .search-choice .search-choice-close {
  cursor: default;
}

/* @end */
/* @group Right to Left */
/* line 372, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl {
  text-align: right;
}

/* line 375, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-single {
  overflow: visible;
  padding: 0 8px 0 0;
}

/* line 379, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-single span {
  margin-right: 0;
  margin-left: 26px;
  direction: rtl;
}

/* line 384, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-single-with-deselect span {
  margin-left: 38px;
}

/* line 387, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-single div {
  right: auto;
  left: 3px;
}

/* line 391, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-single abbr {
  right: auto;
  left: 26px;
}

/* line 395, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-choices li {
  float: right;
}

/* line 398, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-choices li.search-field input[type="text"] {
  direction: rtl;
}

/* line 401, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-choices li.search-choice {
  margin: 3px 5px 3px 0;
  padding: 3px 5px 3px 19px;
}

/* line 405, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-choices li.search-choice .search-choice-close {
  right: auto;
  left: 4px;
}

/* line 409, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl.chosen-container-single-nosearch .chosen-search,
.chosen-rtl .chosen-drop {
  left: 9999px;
}

/* line 413, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl.chosen-container-single .chosen-results {
  margin: 0 0 4px 4px;
  padding: 0 4px 0 0;
}

/* line 417, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-results li.group-option {
  padding-right: 15px;
  padding-left: 0;
}

/* line 421, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl.chosen-container-active.chosen-with-drop .chosen-single div {
  border-right: none;
}

/* line 424, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl .chosen-search input[type="text"] {
  padding: 4px 5px 4px 20px;
  background: white url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") no-repeat -30px -20px;
  background: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite.png") no-repeat -30px -20px;
  direction: rtl;
}

/* line 430, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl.chosen-container-single .chosen-single div b {
  background-position: 6px 2px;
}

/* line 433, app/assets/stylesheets/lib/jquery.chosen.scss */
.chosen-rtl.chosen-container-single.chosen-with-drop .chosen-single div b {
  background-position: -12px 2px;
}

/* @end */
/* @group Retina compatibility */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi), only screen and (min-resolution: 1.5dppx) {
  /* line 440, app/assets/stylesheets/lib/jquery.chosen.scss */
  .chosen-rtl .chosen-search input[type="text"],
.chosen-container-single .chosen-single abbr,
.chosen-container-single .chosen-single div b,
.chosen-container-single .chosen-search input[type="text"],
.chosen-container-multi .chosen-choices .search-choice .search-choice-close,
.chosen-container .chosen-results-scroll-down span,
.chosen-container .chosen-results-scroll-up span {
    background-image: url("//webassets.zearn.org/app_assets/account/chosen/chosen-sprite@2x.png") !important;
    background-size: 52px 37px !important;
    background-repeat: no-repeat !important;
  }
}

/* @end */
/* qTip2 v2.0.1-183 basic css3 | qtip2.com | Licensed MIT, GPL | Wed Aug 28 2013 08:56:19 */
.qtip{position:absolute;left:-28000px;top:-28000px;display:none;max-width:280px;min-width:50px;font-size:10.5px;line-height:12px;direction:ltr;box-shadow:none;padding:0}.qtip-content{position:relative;padding:5px 9px;overflow:hidden;text-align:left;word-wrap:break-word}.qtip-titlebar{position:relative;padding:5px 35px 5px 10px;overflow:hidden;border-width:0 0 1px;font-weight:700}.qtip-titlebar+.qtip-content{border-top-width:0!important}.qtip-close{position:absolute;right:-9px;top:-9px;cursor:pointer;outline:medium none;border-width:1px;border-style:solid;border-color:transparent}.qtip-titlebar .qtip-close{right:4px;top:50%;margin-top:-9px}* html .qtip-titlebar .qtip-close{top:16px}.qtip-titlebar .ui-icon,.qtip-icon .ui-icon{display:block;text-indent:-1000em;direction:ltr}.qtip-icon,.qtip-icon .ui-icon{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;text-decoration:none}.qtip-icon .ui-icon{width:18px;height:14px;line-height:14px;text-align:center;text-indent:0;font:400 bold 10px/13px Tahoma,sans-serif;color:inherit;background:transparent none no-repeat -100em -100em}.qtip-focus{}.qtip-hover{}.qtip-default{border-width:1px;border-style:solid;border-color:#F1D031;background-color:#FFFFA3;color:#555}.qtip-default .qtip-titlebar{background-color:#FFEF93}.qtip-default .qtip-icon{border-color:#CCC;background:#F1F1F1;color:#777}.qtip-default .qtip-titlebar .qtip-close{border-color:#AAA;color:#111} .qtip-light{background-color:#fff;border-color:#E2E2E2;color:#454545}.qtip-light .qtip-titlebar{background-color:#f1f1f1} .qtip-dark{background-color:#505050;border-color:#303030;color:#f3f3f3}.qtip-dark .qtip-titlebar{background-color:#404040}.qtip-dark .qtip-icon{border-color:#444}.qtip-dark .qtip-titlebar .ui-state-hover{border-color:#303030} .qtip-cream{background-color:#FBF7AA;border-color:#F9E98E;color:#A27D35}.qtip-cream .qtip-titlebar{background-color:#F0DE7D}.qtip-cream .qtip-close .qtip-icon{background-position:-82px 0} .qtip-red{background-color:#F78B83;border-color:#D95252;color:#912323}.qtip-red .qtip-titlebar{background-color:#F06D65}.qtip-red .qtip-close .qtip-icon{background-position:-102px 0}.qtip-red .qtip-icon{border-color:#D95252}.qtip-red .qtip-titlebar .ui-state-hover{border-color:#D95252} .qtip-green{background-color:#CAED9E;border-color:#90D93F;color:#3F6219}.qtip-green .qtip-titlebar{background-color:#B0DE78}.qtip-green .qtip-close .qtip-icon{background-position:-42px 0} .qtip-blue{background-color:#E5F6FE;border-color:#ADD9ED;color:#5E99BD}.qtip-blue .qtip-titlebar{background-color:#D0E9F5}.qtip-blue .qtip-close .qtip-icon{background-position:-2px 0}.qtip-shadow{-webkit-box-shadow:1px 1px 3px 1px rgba(0,0,0,.15);-moz-box-shadow:1px 1px 3px 1px rgba(0,0,0,.15);box-shadow:1px 1px 3px 1px rgba(0,0,0,.15)}.qtip-rounded,.qtip-tipsy,.qtip-bootstrap{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}.qtip-rounded .qtip-titlebar{-moz-border-radius:4px 4px 0 0;-webkit-border-radius:4px 4px 0 0;border-radius:4px 4px 0 0}.qtip-youtube{-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;-webkit-box-shadow:0 0 3px #333;-moz-box-shadow:0 0 3px #333;box-shadow:0 0 3px #333;color:#fff;border-width:0;background:#4A4A4A;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#4A4A4A),color-stop(100%,#000));background-image:-webkit-linear-gradient(top,#4A4A4A 0,#000 100%);background-image:-moz-linear-gradient(top,#4A4A4A 0,#000 100%);background-image:-ms-linear-gradient(top,#4A4A4A 0,#000 100%);background-image:-o-linear-gradient(top,#4A4A4A 0,#000 100%)}.qtip-youtube .qtip-titlebar{background-color:#4A4A4A;background-color:rgba(0,0,0,0)}.qtip-youtube .qtip-content{padding:.75em;font:12px arial,sans-serif;filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#4a4a4a, EndColorStr=#000000);-ms-filter:"progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#4a4a4a, EndColorStr=#000000);"}.qtip-youtube .qtip-icon{border-color:#222}.qtip-youtube .qtip-titlebar .ui-state-hover{border-color:#303030}.qtip-jtools{background:#232323;background:rgba(0,0,0,.7);background-image:-webkit-gradient(linear,left top,left bottom,from(#717171),to(#232323));background-image:-moz-linear-gradient(top,#717171,#232323);background-image:-webkit-linear-gradient(top,#717171,#232323);background-image:-ms-linear-gradient(top,#717171,#232323);background-image:-o-linear-gradient(top,#717171,#232323);border:2px solid #ddd;border:2px solid rgba(241,241,241,1);-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px;-webkit-box-shadow:0 0 12px #333;-moz-box-shadow:0 0 12px #333;box-shadow:0 0 12px #333}.qtip-jtools .qtip-titlebar{background-color:transparent;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171, endColorstr=#4A4A4A);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171, endColorstr=#4A4A4A)"}.qtip-jtools .qtip-content{filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A, endColorstr=#232323);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A, endColorstr=#232323)"}.qtip-jtools .qtip-titlebar,.qtip-jtools .qtip-content{background:transparent;color:#fff;border:0 dashed transparent}.qtip-jtools .qtip-icon{border-color:#555}.qtip-jtools .qtip-titlebar .ui-state-hover{border-color:#333}.qtip-cluetip{-webkit-box-shadow:4px 4px 5px rgba(0,0,0,.4);-moz-box-shadow:4px 4px 5px rgba(0,0,0,.4);box-shadow:4px 4px 5px rgba(0,0,0,.4);background-color:#D9D9C2;color:#111;border:0 dashed transparent}.qtip-cluetip .qtip-titlebar{background-color:#87876A;color:#fff;border:0 dashed transparent}.qtip-cluetip .qtip-icon{border-color:#808064}.qtip-cluetip .qtip-titlebar .ui-state-hover{border-color:#696952;color:#696952}.qtip-tipsy{background:#000;background:rgba(0,0,0,.87);color:#fff;border:0 solid transparent;font-size:11px;font-family:'Lucida Grande',sans-serif;font-weight:700;line-height:16px;text-shadow:0 1px #000}.qtip-tipsy .qtip-titlebar{padding:6px 35px 0 10px;background-color:transparent}.qtip-tipsy .qtip-content{padding:6px 10px}.qtip-tipsy .qtip-icon{border-color:#222;text-shadow:none}.qtip-tipsy .qtip-titlebar .ui-state-hover{border-color:#303030}.qtip-tipped{border:3px solid #959FA9;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background-color:#F9F9F9;color:#454545;font-weight:400;font-family:serif}.qtip-tipped .qtip-titlebar{border-bottom-width:0;color:#fff;background:#3A79B8;background-image:-webkit-gradient(linear,left top,left bottom,from(#3A79B8),to(#2E629D));background-image:-webkit-linear-gradient(top,#3A79B8,#2E629D);background-image:-moz-linear-gradient(top,#3A79B8,#2E629D);background-image:-ms-linear-gradient(top,#3A79B8,#2E629D);background-image:-o-linear-gradient(top,#3A79B8,#2E629D);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8, endColorstr=#2E629D);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8, endColorstr=#2E629D)"}.qtip-tipped .qtip-icon{border:2px solid #285589;background:#285589}.qtip-tipped .qtip-icon .ui-icon{background-color:#FBFBFB;color:#555}.qtip-bootstrap{font-size:14px;line-height:20px;color:#333;padding:1px;background-color:#fff;border:1px solid #ccc;border:1px solid rgba(0,0,0,.2);-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,.2);-moz-box-shadow:0 5px 10px rgba(0,0,0,.2);box-shadow:0 5px 10px rgba(0,0,0,.2);-webkit-background-clip:padding-box;-moz-background-clip:padding;background-clip:padding-box}.qtip-bootstrap .qtip-titlebar{padding:8px 14px;margin:0;font-size:14px;font-weight:400;line-height:18px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;-webkit-border-radius:5px 5px 0 0;-moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}.qtip-bootstrap .qtip-titlebar .qtip-close{right:11px;top:45%;border-style:none}.qtip-bootstrap .qtip-content{padding:9px 14px}.qtip-bootstrap .qtip-icon{background:transparent}.qtip-bootstrap .qtip-icon .ui-icon{width:auto;height:auto;float:right;font-size:20px;font-weight:700;line-height:18px;color:#000;text-shadow:0 1px 0 #fff;opacity:.2;filter:alpha(opacity=20)}.qtip-bootstrap .qtip-icon .ui-icon:hover{color:#000;text-decoration:none;cursor:pointer;opacity:.4;filter:alpha(opacity=40)}.qtip:not(.ie9haxors) div.qtip-content,.qtip:not(.ie9haxors) div.qtip-titlebar{filter:none;-ms-filter:none}.qtip .qtip-tip{margin:0 auto;overflow:hidden;z-index:10}x:-o-prefocus,.qtip .qtip-tip{visibility:hidden}.qtip .qtip-tip,.qtip .qtip-tip .qtip-vml,.qtip .qtip-tip canvas{position:absolute;color:#123456;background:transparent;border:0 dashed transparent}.qtip .qtip-tip canvas{top:0;left:0}.qtip .qtip-tip .qtip-vml{behavior:url(#default#VML);display:inline-block;visibility:visible}#qtip-overlay{position:fixed;left:-10000em;top:-10000em}#qtip-overlay.blurs{cursor:pointer}#qtip-overlay div{position:absolute;left:0;top:0;width:100%;height:100%;background-color:#000;opacity:.7;filter:alpha(opacity=70);-ms-filter:"alpha(Opacity=70)"}.qtipmodal-ie6fix{position:absolute!important}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* line 5, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 8, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns .flex-column {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-grow: 1;
  flex-grow: 1;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-1 .flex-column {
  -webkit-flex-basis: 100%;
  flex-basis: 100%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-2 .flex-column {
  -webkit-flex-basis: 50%;
  flex-basis: 50%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-3 .flex-column {
  -webkit-flex-basis: 33.3333333333%;
  flex-basis: 33.3333333333%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-4 .flex-column {
  -webkit-flex-basis: 25%;
  flex-basis: 25%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-5 .flex-column {
  -webkit-flex-basis: 20%;
  flex-basis: 20%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-6 .flex-column {
  -webkit-flex-basis: 16.6666666667%;
  flex-basis: 16.6666666667%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-7 .flex-column {
  -webkit-flex-basis: 14.2857142857%;
  flex-basis: 14.2857142857%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-8 .flex-column {
  -webkit-flex-basis: 12.5%;
  flex-basis: 12.5%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-9 .flex-column {
  -webkit-flex-basis: 11.1111111111%;
  flex-basis: 11.1111111111%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-10 .flex-column {
  -webkit-flex-basis: 10%;
  flex-basis: 10%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-11 .flex-column {
  -webkit-flex-basis: 9.0909090909%;
  flex-basis: 9.0909090909%;
}

/* line 14, app/assets/stylesheets/shared/flexbox_columns.scss */
.flex-columns.flex-columns-12 .flex-column {
  -webkit-flex-basis: 8.3333333333%;
  flex-basis: 8.3333333333%;
}
/* line 5, app/assets/stylesheets/shared/flexbox_table.scss */
.flex-table {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 10, app/assets/stylesheets/shared/flexbox_table.scss */
.flex-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
}

/* line 16, app/assets/stylesheets/shared/flexbox_table.scss */
.flex-row:not(:last-of-type) .flex-cell {
  border-bottom-width: 0;
}

/* line 19, app/assets/stylesheets/shared/flexbox_table.scss */
.flex-row .flex-cell:not(:first-of-type) {
  border-left-width: 0;
}

/* line 24, app/assets/stylesheets/shared/flexbox_table.scss */
.flex-cell {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  border: 2px solid black;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen #footer {
  background-color: transparent;
}

/* line 11, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .page {
  width: 960px;
  min-height: 540px;
  position: relative;
  margin: 0 auto;
  background-color: #fff;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 50px 50px rgba(209, 209, 209, 0.1);
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 21, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .activity-final-sp-bg-owl {
  position: absolute;
  bottom: 0;
  left: 20px;
}

/* line 26, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .activity-final-sp-bg-cat {
  position: absolute;
  right: 30px;
  top: 40px;
}

/* line 31, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .blurb {
  text-align: center;
  margin: auto;
  padding: 120px 0 0 0;
  color: #444;
  height: 540px;
}

/* line 37, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .blurb h1 {
  font-size: 50px;
  font-weight: 300;
  margin: 0 0 10px;
}

/* line 42, app/assets/stylesheets/shared/general/activity_final_screen.scss */
.final-screen .blurb .sub-title {
  font-size: 24px;
  font-weight: 300;
  margin: 0 0 30px 0;
}
/* line 28, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/general/discs.scss */
.array-token.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 9, app/assets/stylesheets/shared/general/array_discs.scss */
.array-token.discs .slot-item:not(.ghost) {
  background-color: #7029a5;
  width: 26px;
  height: 26px;
  margin: 0;
  border: 0;
  background-size: 26px 26px;
}

/* line 17, app/assets/stylesheets/shared/general/array_discs.scss */
.array-token.discs .slot-item.with-image:not(.ghost) {
  background-color: transparent;
  box-shadow: none;
  border-radius: 0;
}
/* line 3, app/assets/stylesheets/shared/general/arrow.scss */
.blue-arrow {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/BlueArrow.png");
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/BlueArrow.svg"), none;
  width: 60px;
  height: 40px;
  background-size: 60px 40px;
}

/* line 10, app/assets/stylesheets/shared/general/arrow.scss */
.blue-arrow.right {
  -moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  -webkit-transform: scaleX(-1);
  transform: scaleX(-1);
  filter: FlipH;
  -ms-filter: "FlipH";
}
/* line 3, app/assets/stylesheets/shared/general/button-base.scss */
.zearn-back-button, .blue-button {
  border: none;
  padding: 6px 30px;
  border-radius: 50px;
  cursor: pointer;
  text-align: center;
  font-size: 15px;
  width: auto;
  display: inline-block;
  font-weight: normal;
}

/* line 14, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button {
  color: white;
  background-color: #007b94;
}

/* line 18, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button:hover {
  background-color: #005c73;
}

/* line 21, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button a {
  color: white;
}

/* line 25, app/assets/stylesheets/shared/general/button-base.scss */
.zearn-back-button {
  background: white;
  color: #007b94;
  border: 1px solid #007b94;
  font-size: 10px;
  margin-right: 10px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}
/* line 3, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled, .radio-styled {
  display: block;
  cursor: pointer;
  position: relative;
}

/* line 8, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled input, .radio-styled input {
  display: none;
}

/* line 12, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled .fa-check, .check-styled .radio-circle, .radio-styled .fa-check, .radio-styled .radio-circle {
  padding: 2px;
  border-width: 1px;
  border-style: solid;
  pointer-events: none;
}

/* line 22, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled {
  color: #808080;
  font-size: 10px;
}

/* line 26, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled .fa-check {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  text-indent: 0;
  color: transparent;
  border-color: #b3b3b3;
}

/* line 33, app/assets/stylesheets/shared/general/checkbox.scss */
.check-styled input:checked + .fa-check {
  color: #808080;
}

/* line 39, app/assets/stylesheets/shared/general/checkbox.scss */
.radio-styled .radio-circle {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  border-color: #0097b6;
}

/* line 46, app/assets/stylesheets/shared/general/checkbox.scss */
.radio-styled input:checked + .radio-circle {
  background-color: #0097b6;
}
/* line 3, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label {
  position: relative;
  display: inline-block;
  background: white;
  color: black;
  border: 2px solid #c1d8ed;
  border-radius: 4px;
  min-width: 20px;
  white-space: nowrap;
  padding: 2px;
}

/* line 14, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label.static {
  padding: 10px 4px;
  background: transparent;
  border-color: transparent;
}

/* line 20, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-num-input {
  display: inline-block;
  margin: 6px 4px;
  font-size: 20px;
  width: 60px;
  vertical-align: middle;
}

/* line 27, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-static-num, .combo-label .combo-label-static-units {
  vertical-align: middle;
  margin: 4px;
  font-size: 20px;
}

/* line 33, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select-container {
  display: inline-block;
  vertical-align: middle;
}

/* line 38, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select {
  background: transparent;
  padding: 0 20px 0 0;
  cursor: pointer;
  height: 40px;
  font-size: 20px;
  -webkit-appearance: none;
  border: 0;
  border-radius: 0;
}

/* line 50, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select option {
  color: black;
}

/* line 53, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select:disabled {
  color: black;
}

/* line 57, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select:focus {
  outline: none;
}

/* line 61, app/assets/stylesheets/shared/general/combo_label.scss */
.combo-label .combo-label-select-arrow {
  color: #0c91cc;
  background: white;
  position: absolute;
  right: 0px;
  top: 0px;
  font-size: 20px;
  height: 100%;
  line-height: 44px;
  pointer-events: none;
  text-align: center;
  width: 18px;
  border-left: 1px solid #c1d8ed;
}

@-moz-document url-prefix() {
  /* line 81, app/assets/stylesheets/shared/general/combo_label.scss */
  .combo-label .combo-label-num-input {
    margin: 4px;
  }
  /* line 84, app/assets/stylesheets/shared/general/combo_label.scss */
  .combo-label .combo-label-select {
    padding-right: 0px;
    padding-top: 6px;
  }
}
/* line 3, app/assets/stylesheets/shared/general/curly_bracket.scss */
.curly-bracket {
  color: #303b40;
}

/* line 7, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket {
  position: relative;
  overflow: hidden;
  min-width: 4px;
}

/* line 13, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket .bracket-point-side1, .bracket .bracket-point-side2 {
  position: absolute;
  border-radius: 12px;
  z-index: 2;
  border: 4px solid;
}

/* line 21, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket .bracket-long-1, .bracket .bracket-long-2 {
  z-index: 0;
  position: absolute;
  border-radius: 12px;
  border: 4px solid;
}

/* line 29, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right, .bracket-left {
  width: 24px;
}

/* line 32, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side1, .bracket-right .bracket-point-side2, .bracket-left .bracket-point-side1, .bracket-left .bracket-point-side2 {
  max-height: 30%;
  height: 30px;
  width: 40px;
  border-bottom-width: 4px;
}

/* line 38, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side1, .bracket-left .bracket-point-side1 {
  border-top: 0;
  bottom: 50%;
  margin-bottom: -2px;
}

/* line 43, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side2, .bracket-left .bracket-point-side2 {
  border-bottom: 0;
  top: 50%;
  margin-top: -2px;
}

/* line 49, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-1, .bracket-left .bracket-long-1 {
  border-bottom: 0;
}

/* line 52, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-2, .bracket-left .bracket-long-2 {
  bottom: 0;
  border-top: 0;
}

/* line 57, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-1, .bracket-right .bracket-long-2, .bracket-left .bracket-long-1, .bracket-left .bracket-long-2 {
  height: calc(50% - 8px);
  min-height: 10px;
  width: 40px;
}

/* line 66, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side1, .bracket-right .bracket-point-side2 {
  left: 12px;
}

/* line 69, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side1 {
  border-top-left-radius: 0;
}

/* line 72, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-point-side2 {
  border-bottom-left-radius: 0;
}

/* line 75, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-1 {
  border-bottom-right-radius: 0;
}

/* line 78, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-2 {
  border-top-right-radius: 0;
}

/* line 81, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-right .bracket-long-1, .bracket-right .bracket-long-2 {
  right: 8px;
}

/* line 87, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-point-side1, .bracket-left .bracket-point-side2 {
  right: 12px;
}

/* line 90, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-point-side1 {
  border-top-right-radius: 0;
}

/* line 93, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-point-side2 {
  border-bottom-right-radius: 0;
}

/* line 96, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-long-1 {
  border-bottom-left-radius: 0;
}

/* line 99, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-long-2 {
  border-top-left-radius: 0;
}

/* line 102, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-left .bracket-long-1, .bracket-left .bracket-long-2 {
  left: 8px;
}

/* line 107, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top, .bracket-bottom {
  height: 24px;
}

/* line 110, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side1, .bracket-top .bracket-point-side2, .bracket-bottom .bracket-point-side1, .bracket-bottom .bracket-point-side2 {
  width: calc(50% - 8px);
  height: 40px;
  border-right-width: 4px;
}

/* line 115, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side1, .bracket-bottom .bracket-point-side1 {
  right: 50%;
  margin-right: -2px;
  border-left: 0;
}

/* line 120, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side2, .bracket-bottom .bracket-point-side2 {
  left: 50%;
  margin-left: -2px;
  border-right: 0;
}

/* line 125, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-1, .bracket-bottom .bracket-long-1 {
  border-right: 0;
}

/* line 128, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-2, .bracket-bottom .bracket-long-2 {
  border-left: 0;
  right: 0;
}

/* line 133, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-1, .bracket-top .bracket-long-2, .bracket-bottom .bracket-long-1, .bracket-bottom .bracket-long-2 {
  width: calc(50% - 8px);
  min-width: 10px;
  height: 40px;
}

/* line 142, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side1, .bracket-top .bracket-point-side2 {
  bottom: 12px;
}

/* line 145, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side1 {
  border-bottom-left-radius: 0px;
}

/* line 148, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-point-side2 {
  border-bottom-right-radius: 0px;
}

/* line 152, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-1 {
  border-top-right-radius: 0;
}

/* line 155, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-2 {
  border-top-left-radius: 0;
}

/* line 158, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-top .bracket-long-1, .bracket-top .bracket-long-2 {
  top: 8px;
}

/* line 164, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-point-side1, .bracket-bottom .bracket-point-side2 {
  top: 12px;
}

/* line 167, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-point-side1 {
  border-top-left-radius: 0px;
}

/* line 170, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-point-side2 {
  border-top-right-radius: 0px;
}

/* line 174, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-long-1 {
  border-bottom-right-radius: 0;
}

/* line 177, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-long-2 {
  border-bottom-left-radius: 0;
}

/* line 181, app/assets/stylesheets/shared/general/curly_bracket.scss */
.bracket-bottom .bracket-long-1, .bracket-bottom .bracket-long-2 {
  bottom: 8px;
}
/* line 2, app/assets/stylesheets/shared/general/doodle-backgrounds.scss */
.doodle-bg {
  background-image: url("//webassets.zearn.org/app_assets/general/background_doodles/feed/0_grey.png");
  background-attachment: fixed;
}
/* line 3, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer {
  font-family: "Source Sans Pro", Verdana, Geneva, sans-serif;
  background: #303b40;
  width: 100%;
  color: white;
  margin-top: 55px;
}

/* line 10, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom {
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid white;
}

/* line 18, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer h4, footer.external-footer a, footer.external-footer .ef-copyright, footer.external-footer li {
  font-size: 14px;
  white-space: nowrap;
}

/* line 23, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer a {
  color: white;
}

/* line 27, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer ul {
  padding-left: 0;
  display: flex;
  font-size: 0;
}

/* line 33, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom-container {
  padding: 12px 0;
  display: flex;
  justify-content: space-between;
  margin: 0 16px;
}

/* line 39, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom-container .ef-bottom-links, footer.external-footer .ef-bottom-container .ef-copyright {
  display: flex;
}

/* line 43, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom-container .ef-bottom-links {
  justify-content: flex-start;
}

/* line 46, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom-container .ef-bottom-links li {
  margin: 0 8px;
}

/* line 49, app/assets/stylesheets/shared/general/external_footer.scss */
footer.external-footer .ef-bottom-container .ef-bottom-links li:first-child {
  margin-left: 0px;
}

@media only screen and (min-width: 992px) {
  /* line 59, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container {
    width: 960px;
  }
  /* line 62, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-bottom-links {
    width: 468px;
    justify-content: center;
  }
}

@media only screen and (max-width: 991px) and (min-width: 767px) {
  /* line 73, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container {
    width: 768px;
    margin: 0 8px;
  }
  /* line 77, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-copyright {
    justify-content: center;
    width: 240px;
  }
  /* line 82, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-bottom-links {
    width: 480px;
    justify-content: center;
  }
}

@media only screen and (max-width: 767px) {
  /* line 92, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom {
    height: unset;
  }
  /* line 96, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container {
    padding: 20px 12px;
    margin: 0;
    width: 100%;
  }
  /* line 101, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-copyright, footer.external-footer .ef-bottom-container .ef-bottom-links {
    justify-content: flex-end;
    width: auto;
  }
  /* line 106, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-bottom-links li, footer.external-footer .ef-bottom-container .ef-bottom-links li a, footer.external-footer .ef-bottom-container .ef-copyright {
    font-size: 10px;
    font-weight: 600;
  }
  /* line 110, app/assets/stylesheets/shared/general/external_footer.scss */
  footer.external-footer .ef-bottom-container .ef-bottom-links li:not(.list-bullet), footer.external-footer .ef-bottom-container .ef-bottom-links li a:not(.list-bullet), footer.external-footer .ef-bottom-container .ef-copyright:not(.list-bullet) {
    margin: 0;
  }
}
/* line 3, app/assets/stylesheets/shared/general/flag.scss */
.flag-main, .flag-end, .flag-fold {
  vertical-align: top;
  position: relative;
  display: inline-block;
}

/* line 9, app/assets/stylesheets/shared/general/flag.scss */
.flag-main {
  z-index: 12;
}

/* line 13, app/assets/stylesheets/shared/general/flag.scss */
.flag-end {
  z-index: 10;
}

/* line 17, app/assets/stylesheets/shared/general/flag.scss */
.flag-fold {
  z-index: 11;
}

/* line 21, app/assets/stylesheets/shared/general/flag.scss */
.flag-left, .flag-right {
  display: inline-block;
  vertical-align: top;
  position: relative;
}

/* line 26, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-end, .flag-right .flag-end {
  background-color: #a8cfe6;
  height: 40px;
  line-height: 32px;
  color: white;
  font-size: 18px;
}

/* line 33, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-end img, .flag-right .flag-end img {
  margin-top: 1px;
}

/* line 38, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-fold, .flag-right .flag-fold {
  background-color: #86b5ce;
  width: 19px;
  height: 46px;
}

/* line 43, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-main, .flag-right .flag-main {
  background-color: #bfdcee;
  height: 40px;
  line-height: 40px;
  letter-spacing: 1px;
  font-size: 14px;
  color: #0c91cc;
}

/* line 53, app/assets/stylesheets/shared/general/flag.scss */
.flag-right {
  text-align: left;
}

/* line 56, app/assets/stylesheets/shared/general/flag.scss */
.flag-right .flag-end {
  right: 34px;
  top: 6px;
  padding: 4px 16px 0px 26px;
  border-top-right-radius: 40px;
  border-bottom-right-radius: 40px;
}

/* line 64, app/assets/stylesheets/shared/general/flag.scss */
.flag-right .flag-fold {
  right: 19px;
  border-top-right-radius: 60px;
  border-bottom-right-radius: 50px;
}

/* line 69, app/assets/stylesheets/shared/general/flag.scss */
.flag-right .flag-main {
  padding: 0px 20px 0px 12px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

/* line 76, app/assets/stylesheets/shared/general/flag.scss */
.flag-left {
  text-align: right;
}

/* line 79, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-end {
  left: 34px;
  top: 6px;
  padding: 4px 26px 0px 16px;
  border-top-left-radius: 40px;
  border-bottom-left-radius: 40px;
}

/* line 87, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-fold {
  left: 19px;
  border-top-left-radius: 60px;
  border-bottom-left-radius: 50px;
}

/* line 93, app/assets/stylesheets/shared/general/flag.scss */
.flag-left .flag-main {
  padding: 0px 12px 0px 20px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}
/* line 3, app/assets/stylesheets/shared/general/footer.scss */
#footer {
  position: relative;
  width: 100%;
  text-align: center;
  margin-top: 100px;
  font-size: 12px;
  line-height: 12px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  color: #444;
  min-height: 120px;
}

/* line 15, app/assets/stylesheets/shared/general/footer.scss */
#footer .content.internal-footer {
  padding: 0;
}

/* line 18, app/assets/stylesheets/shared/general/footer.scss */
#footer .content ul {
  padding: 0;
}

/* line 21, app/assets/stylesheets/shared/general/footer.scss */
#footer .content li {
  display: inline-block;
  border-right: 1px solid #444;
  padding: 0 10px;
  margin: 5px 0;
}

/* line 26, app/assets/stylesheets/shared/general/footer.scss */
#footer .content li:last-of-type {
  border-right: none;
}

/* line 32, app/assets/stylesheets/shared/general/footer.scss */
#footer a {
  color: #444;
  text-decoration: underline;
}

/* line 37, app/assets/stylesheets/shared/general/footer.scss */
#footer p {
  font-size: 12px;
  margin-bottom: 0px;
}

/* line 42, app/assets/stylesheets/shared/general/footer.scss */
#footer .cci-footer {
  max-width: 1024px;
  line-height: 1.5;
  margin: 5px auto;
}
/* line 11, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 14, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat {
  border-color: #bdbec0;
}

/* line 16, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat:not(.active) .graded-point-mat-task-inner {
  pointer-events: none;
}

/* line 19, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat.correct {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 23, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat.correct.first-fade-complete {
  border-color: #bdbec0;
  background-color: white;
  -webkit-transition: background-color 0.5s ease-in-out;
  -moz-transition: background-color 0.5s ease-in-out;
  -ms-transition: background-color 0.5s ease-in-out;
  -o-transition: background-color 0.5s ease-in-out;
  transition: background-color 0.5s ease-in-out;
}

/* line 33, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat.incorrect.final {
  border-color: #ff4d76;
  background-color: white;
}

/* line 40, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat.incorrect:not(.final) {
  border-color: #bdbec0;
  background-color: white;
}

/* line 44, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat.incorrect.try-again:not(.final) {
  border-color: #ff4d76;
  background-color: #ffe3ee;
  cursor: pointer;
  -webkit-transition: background-color 0.5s ease-in-out;
  -moz-transition: background-color 0.5s ease-in-out;
  -ms-transition: background-color 0.5s ease-in-out;
  -o-transition: background-color 0.5s ease-in-out;
  transition: background-color 0.5s ease-in-out;
  -webkit-transition: border 0.5s ease-in-out;
  -moz-transition: border 0.5s ease-in-out;
  -ms-transition: border 0.5s ease-in-out;
  -o-transition: border 0.5s ease-in-out;
  transition: border 0.5s ease-in-out;
}

/* line 56, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.prepop, .graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.correct {
  pointer-events: none;
}

/* line 17, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct .point {
  opacity: 1;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.circle .point {
  background-position: -48px 0px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.square .point {
  background-position: -48px -24px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.triangle .point {
  background-position: -48px -48px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.star .point {
  background-position: -48px -72px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.heart .point {
  background-position: -48px -96px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.polygon .point {
  background-position: -48px -120px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.circle .correct-point {
  background-position: 0 0px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.square .correct-point {
  background-position: 0 -24px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.triangle .correct-point {
  background-position: 0 -48px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.star .correct-point {
  background-position: 0 -72px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.heart .correct-point {
  background-position: 0 -96px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct.polygon .correct-point {
  background-position: 0 -120px;
}

/* line 66, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item .correct-point {
  opacity: 1;
  visibility: hidden;
  background-image: url("//webassets.zearn.org/app_assets/tokens/numberLine/allShapes3.svg");
}

/* line 71, app/assets/stylesheets/shared/general/graded_point_mat_task.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.correct .correct-point {
  visibility: visible;
  opacity: 0;
  -webkit-transition: opacity 1.5s ease-in-out;
  -moz-transition: opacity 1.5s ease-in-out;
  -ms-transition: opacity 1.5s ease-in-out;
  -o-transition: opacity 1.5s ease-in-out;
  transition: opacity 1.5s ease-in-out;
}

/* line 17, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect .point {
  opacity: 1;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.circle .point {
  background-position: -24px 0px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.square .point {
  background-position: -24px -24px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.triangle .point {
  background-position: -24px -48px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.star .point {
  background-position: -24px -72px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.heart .point {
  background-position: -24px -96px;
}

/* line 22, app/assets/stylesheets/shared/general/plotted_points_mixins.scss */
.graded-point-mat-task .point-mat .graded-point-mat-task-inner .graded-item.plotted.incorrect.polygon .point {
  background-position: -24px -120px;
}
/* line 38, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 40, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-axis {
  position: relative;
  width: 840px;
  height: 35px;
  margin: 0 30px;
  font-size: 0;
}

/* line 49, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-axis-svg {
  position: absolute;
  left: -29px;
  top: 11px;
  width: 898px;
  height: 15px;
  stroke: #4d4d4d;
  stroke-width: 4px;
}

/* line 58, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-left-arrow-svg, .horizontal-number-line .hnl-right-arrow-wrapper {
  position: absolute;
  top: 6.5px;
}

/* line 62, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-arrow-svg {
  width: 13px;
  height: 22px;
  stroke: #4d4d4d;
  stroke-width: 3;
  fill: none;
  stroke-linejoin: round;
}

/* line 70, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-left-arrow-svg {
  left: -31px;
}

/* line 73, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-right-arrow-wrapper {
  right: -31px;
}

/* line 77, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-label {
  white-space: nowrap;
}

/* line 79, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-label .token-container {
  line-height: normal;
}

/* line 88, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-label .token-container .fraction, .horizontal-number-line .hnl-label .token-container .zearn-input.number-input {
  font-size: 18px;
}

/* line 95, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks {
  position: absolute;
  width: 100%;
}

/* line 98, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit {
  position: absolute;
  height: 35px;
  display: inline-block;
}

/* line 102, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit .hnl-tick-label {
  position: relative;
  left: -49%;
  top: 5px;
  font-size: 18px;
  text-align: center;
  pointer-events: none;
}

/* line 110, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit .hnl-tick-label > * {
  pointer-events: auto;
}

/* line 113, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit .hnl-tick-label.has-adjacent-fraction {
  line-height: 35px;
}

/* line 116, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit .hnl-tick-label.has-tile-slots {
  line-height: 55px;
}

/* line 119, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-unit .hnl-tick-label.bold {
  font-weight: bold;
}

/* line 125, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-tick-svg line {
  stroke: #4d4d4d;
  stroke-linecap: round;
}

/* line 131, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.double-number-line-partition .correctable .in-between line {
  stroke: #ff4d76;
}

/* line 135, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-whole-tick .hnl-whole-tick-line {
  stroke-width: 4px;
}

/* line 138, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-whole-tick .hnl-tick-label {
  height: 21px;
}

/* line 143, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-segment-tick .hnl-segment-tick-line {
  stroke-width: 2px;
}

/* line 146, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-ticks .hnl-segment-tick .hnl-tick-label {
  height: 21px;
}

/* line 153, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .point {
  border-radius: 50%;
  width: 16px;
  height: 16px;
  background-color: #a1adb3;
  border: solid 2px #435259;
}

/* line 162, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-arrows {
  display: flex;
  flex-direction: column-reverse;
  width: 840px;
}

/* line 167, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-arrows .horiz-number-line-arrow:not(:first-of-type) {
  margin-bottom: 8px;
}

/* line 173, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 693px;
  height: 26px;
  margin: 0 auto;
}

/* line 180, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows .horiz-number-line-greater-less-arrow {
  position: relative;
  width: 250px;
  height: 26px;
}

/* line 185, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows .horiz-number-line-greater-less-arrow .arrow-svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  stroke: #4d4d4d;
  stroke-width: 3px;
  fill: #4d4d4d;
  overflow: visible;
}

/* line 197, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows .horiz-number-line-greater-less-arrow .arrow-label {
  position: absolute;
  top: 2px;
  left: 50%;
  width: 80px;
  margin-left: -40px;
}

/* line 204, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows .horiz-number-line-greater-less-arrow .arrow-label .arrow-label-inner {
  display: inline-block;
  vertical-align: top;
  padding: 0 10px;
  color: #4d4d4d;
  font-size: 16px;
}

/* line 215, app/assets/stylesheets/shared/general/horizontal_number_line.scss */
.horizontal-number-line .hnl-greater-less-arrows .less-arrow .arrow-svg {
  transform: scale(-1, 1);
}
/* line 1, app/assets/stylesheets/shared/general/icons.scss */
.fa-warn {
  color: #de914c;
}

/* line 5, app/assets/stylesheets/shared/general/icons.scss */
.fa-success {
  color: #7aae7d;
}
/* line 3, app/assets/stylesheets/shared/general/lesson_number.scss */
.lesson-number {
  color: white;
  background: #0c91cc;
  display: inline-block;
  text-align: right;
  font-weight: bold;
  width: 50px;
  height: 40px;
  line-height: 40px;
  text-align: right;
  padding-right: 10px;
}

/* line 18, app/assets/stylesheets/shared/general/lesson_number.scss */
.lesson-number .pencil {
  height: 30px;
  width: 25px;
  padding-right: 5px;
  background-image: url("//webassets.zearn.org/assets/icon_assessment_pencil.png");
  background-repeat: no-repeat;
  float: right;
  margin-top: 5px;
}
/* line 36, app/assets/stylesheets/shared/general/operational_buttons.scss */
.operational-buttons, .super-operational-buttons {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  margin-right: 10px;
}

/* line 41, app/assets/stylesheets/shared/general/operational_buttons.scss */
.operational-buttons .buttons-container, .super-operational-buttons .buttons-container {
  display: inline-block;
  float: right;
}

/* line 46, app/assets/stylesheets/shared/general/operational_buttons.scss */
.operational-buttons {
  min-width: 136px;
}

/* line 52, app/assets/stylesheets/shared/general/operational_buttons.scss */
.super-operational-buttons {
  min-width: 102px;
}

/* line 55, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button, .directional-button, .undo-button, .shade-button {
  border: 0px;
  padding: 3px 0px;
  background-color: transparent;
  display: block;
  margin: 0 auto;
}

/* line 62, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button .split-icon, .split-button .directional-icon, .split-button .undo-icon, .split-button .shade-icon, .directional-button .split-icon, .directional-button .directional-icon, .directional-button .undo-icon, .directional-button .shade-icon, .undo-button .split-icon, .undo-button .directional-icon, .undo-button .undo-icon, .undo-button .shade-icon, .shade-button .split-icon, .shade-button .directional-icon, .shade-button .undo-icon, .shade-button .shade-icon {
  height: 53px;
  width: 53px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/fraction_area_model/sprite6.png");
}

/* line 70, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button .split-horizontal-icon {
  background-position: -284px -68px;
}

/* line 73, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button.colored .split-horizontal-icon {
  background-position: -257px -194px;
}

/* line 76, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button:disabled .split-horizontal-icon, .split-button.colored:disabled .split-horizontal-icon {
  background-position: -257px -131px;
}

/* line 80, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button .split-vertical-icon {
  background-position: -131px -194px;
}

/* line 83, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button.colored .split-vertical-icon {
  background-position: -284px -5px;
}

/* line 86, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button:disabled .split-vertical-icon, .split-button.colored:disabled .split-vertical-icon {
  background-position: -194px -194px;
}

/* line 90, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button .split-clear-icon {
  background-position: -5px -131px;
}

/* line 93, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button:disabled .split-clear-icon {
  background-position: -68px -131px;
}

/* line 97, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button .split-clone-icon {
  background-position: -131px -131px;
}

/* line 100, app/assets/stylesheets/shared/general/operational_buttons.scss */
.split-button:disabled .split-clone-icon {
  background-position: -194px -131px;
}

/* line 105, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-buttons {
  display: table;
  margin: 0 auto;
}

/* line 109, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button {
  display: table-cell;
  float: none;
}

/* line 112, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button .arrow-left-icon {
  background-position: -132px -317px;
}

/* line 115, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button:disabled .arrow-left-icon {
  background-position: -195px -317px;
}

/* line 119, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button .arrow-right-icon {
  background-position: -5px -317px;
}

/* line 122, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button:disabled .arrow-right-icon {
  background-position: -68px -317px;
}

/* line 126, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button .double-arrow-left-icon {
  background-position: -257px -254px;
}

/* line 129, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button:disabled .double-arrow-left-icon {
  background-position: -320px -254px;
}

/* line 133, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button .double-arrow-right-icon {
  background-position: -257px -317px;
}

/* line 136, app/assets/stylesheets/shared/general/operational_buttons.scss */
.directional-button:disabled .double-arrow-right-icon {
  background-position: -320px -317px;
}

/* line 142, app/assets/stylesheets/shared/general/operational_buttons.scss */
.undo-button .undo-icon {
  background-position: -5px -257px;
}

/* line 145, app/assets/stylesheets/shared/general/operational_buttons.scss */
.undo-button:disabled .undo-icon {
  background-position: -68px -257px;
}

/* line 151, app/assets/stylesheets/shared/general/operational_buttons.scss */
.shade-button .shade-icon {
  background-position: -5px -194px;
}

/* line 153, app/assets/stylesheets/shared/general/operational_buttons.scss */
.shade-button .shade-icon.vertical {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* line 157, app/assets/stylesheets/shared/general/operational_buttons.scss */
.shade-button:disabled .shade-icon {
  background-position: -68px -194px;
}

/* line 162, app/assets/stylesheets/shared/general/operational_buttons.scss */
.shade-button.cross-out .shade-icon {
  background-position: -132px -256px;
}

/* line 165, app/assets/stylesheets/shared/general/operational_buttons.scss */
.shade-button.cross-out:disabled .shade-icon {
  background-position: -195px -255px;
}

/* line 171, app/assets/stylesheets/shared/general/operational_buttons.scss */
.alignment-button {
  border: 0px;
  padding: 0px;
  background-color: transparent;
}

/* line 176, app/assets/stylesheets/shared/general/operational_buttons.scss */
.alignment-button .arrow-down-icon {
  height: 19px;
  width: 41px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/fraction_area_model/sprite6.png");
  background-position: -56px -68px;
}

/* line 182, app/assets/stylesheets/shared/general/operational_buttons.scss */
.alignment-button.disabled .arrow-down-icon {
  background-position: -56px -5px;
}

/* line 186, app/assets/stylesheets/shared/general/operational_buttons.scss */
.alignment-button .arrow-up-drag-icon {
  height: 61px;
  width: 41px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/fraction_area_model/sprite6.png");
  background-position: -107px -5px;
}

/* line 192, app/assets/stylesheets/shared/general/operational_buttons.scss */
.alignment-button.disabled .arrow-up-drag-icon {
  background-position: -5px -5px;
}
/* line 5, app/assets/stylesheets/shared/general/point_plot.scss */
.point-mat {
  display: inline-block;
  margin-top: 30px;
  border-width: 2px;
  border-style: solid;
  border-radius: 10px;
  background-color: white;
  position: relative;
}

/* line 14, app/assets/stylesheets/shared/general/point_plot.scss */
.point-mat.active {
  background-color: #f3fdff;
}

/* line 18, app/assets/stylesheets/shared/general/point_plot.scss */
.point-mat .point-plot-reset {
  position: absolute;
  bottom: -45px;
  right: 0px;
  width: 35px;
  height: 35px;
  background-size: 35px 35px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/* line 4, app/assets/stylesheets/shared/general/sticky_header.scss */
.sticky-header-wrap .sticky-header.fixed {
  position: fixed;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/general/tokens/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 9, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition .groups-box .group .group-items {
  cursor: inherit;
}

/* line 17, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition .groups-box,
.composition-token .g1-composition-ten-grid-horizontal.g1-composition-ten-grid.g1-composition .groups-box,
.composition-token .g1-composition-unstructured.g1-composition .groups-box {
  padding: 0;
}

/* line 21, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition .groups-box .group .group-items,
.composition-token .g1-composition-ten-grid-horizontal.g1-composition-ten-grid.g1-composition .groups-box .group .group-items,
.composition-token .g1-composition-unstructured.g1-composition .groups-box .group .group-items {
  width: auto;
  height: auto;
}

/* line 29, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only {
  margin: 10px;
  height: inherit;
}

/* line 38, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .groups-box {
  position: relative;
  height: inherit;
  padding: 0;
}

/* line 43, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .groups-box .group {
  width: 474px;
  margin: 0;
}

/* line 46, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .groups-box .group.composition-remaining {
  border-color: transparent;
  background-color: transparent;
}

/* line 55, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle {
  position: absolute;
  top: -10px;
  left: 0;
  height: 81px;
  z-index: 1;
  border: 5px solid black;
  border-radius: 41px;
}

/* line 65, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.side-by-side {
  height: 63.18px;
  border-radius: 32px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1 {
  width: 53px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.composition-circle-remaining {
  width: calc(48px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.side-by-side {
  width: 39.58px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.side-by-side.composition-circle-remaining {
  width: calc(34.58px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.g1-composition-strand-subitized {
  width: 53px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(47px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.g1-composition-strand-subitized.side-by-side {
  width: 39.58px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(33.58px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-1.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2 {
  width: 99px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.composition-circle-remaining {
  width: calc(94px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.side-by-side {
  width: 73.16px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.side-by-side.composition-circle-remaining {
  width: calc(68.16px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.g1-composition-strand-subitized {
  width: 99px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(93px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.g1-composition-strand-subitized.side-by-side {
  width: 73.16px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(67.16px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-2.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3 {
  width: 145px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.composition-circle-remaining {
  width: calc(140px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.side-by-side {
  width: 106.74px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.side-by-side.composition-circle-remaining {
  width: calc(101.74px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.g1-composition-strand-subitized {
  width: 145px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(139px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.g1-composition-strand-subitized.side-by-side {
  width: 106.74px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(100.74px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-3.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4 {
  width: 191px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.composition-circle-remaining {
  width: calc(186px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.side-by-side {
  width: 140.32px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.side-by-side.composition-circle-remaining {
  width: calc(135.32px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.g1-composition-strand-subitized {
  width: 191px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(185px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.g1-composition-strand-subitized.side-by-side {
  width: 140.32px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(134.32px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-4.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5 {
  width: 237px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.composition-circle-remaining {
  width: calc(232px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.side-by-side {
  width: 173.9px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.side-by-side.composition-circle-remaining {
  width: calc(168.9px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.g1-composition-strand-subitized {
  width: 237px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(231px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.g1-composition-strand-subitized.side-by-side {
  width: 173.9px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(167.9px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-5.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6 {
  width: 283px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.composition-circle-remaining {
  width: calc(278px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.side-by-side {
  width: 207.48px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.side-by-side.composition-circle-remaining {
  width: calc(202.48px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.g1-composition-strand-subitized {
  width: 303px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(297px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.g1-composition-strand-subitized.side-by-side {
  width: 222.08px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(216.08px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-6.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7 {
  width: 329px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.composition-circle-remaining {
  width: calc(324px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.side-by-side {
  width: 241.06px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.side-by-side.composition-circle-remaining {
  width: calc(236.06px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.g1-composition-strand-subitized {
  width: 349px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(343px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.g1-composition-strand-subitized.side-by-side {
  width: 255.66px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(249.66px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-7.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8 {
  width: 375px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.composition-circle-remaining {
  width: calc(370px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.side-by-side {
  width: 274.64px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.side-by-side.composition-circle-remaining {
  width: calc(269.64px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.g1-composition-strand-subitized {
  width: 395px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(389px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.g1-composition-strand-subitized.side-by-side {
  width: 289.24px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(283.24px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-8.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9 {
  width: 421px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.composition-circle-remaining {
  width: calc(416px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.side-by-side {
  width: 308.22px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.side-by-side.composition-circle-remaining {
  width: calc(303.22px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.g1-composition-strand-subitized {
  width: 441px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(435px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.g1-composition-strand-subitized.side-by-side {
  width: 322.82px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(316.82px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-9.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 104, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10 {
  width: 467px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.composition-circle-remaining {
  width: calc(462px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.side-by-side {
  width: 341.8px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.side-by-side.composition-circle-remaining {
  width: calc(336.8px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.g1-composition-strand-subitized {
  width: 487px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(481px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.g1-composition-strand-subitized.side-by-side {
  width: 356.4px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(350.4px - 100%);
}

/* line 112, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.second-strand {
  left: 356.02px;
}

/* line 114, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-10.second-strand.g1-composition-strand-subitized {
  left: 370.62px;
}

/* line 122, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11 {
  width: 532.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.composition-circle-remaining {
  width: calc(527.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.side-by-side {
  width: 395.88px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.side-by-side.composition-circle-remaining {
  width: calc(390.88px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.g1-composition-strand-subitized {
  width: 552.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(546.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.g1-composition-strand-subitized.side-by-side {
  width: 410.48px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-11.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(404.48px - 100%);
}

/* line 122, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12 {
  width: 578.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.composition-circle-remaining {
  width: calc(573.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.side-by-side {
  width: 429.46px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.side-by-side.composition-circle-remaining {
  width: calc(424.46px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.g1-composition-strand-subitized {
  width: 598.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(592.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.g1-composition-strand-subitized.side-by-side {
  width: 444.06px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-12.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(438.06px - 100%);
}

/* line 122, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13 {
  width: 624.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.composition-circle-remaining {
  width: calc(619.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.side-by-side {
  width: 463.04px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.side-by-side.composition-circle-remaining {
  width: calc(458.04px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.g1-composition-strand-subitized {
  width: 644.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(638.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.g1-composition-strand-subitized.side-by-side {
  width: 477.64px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-13.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(471.64px - 100%);
}

/* line 122, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14 {
  width: 670.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.composition-circle-remaining {
  width: calc(665.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.side-by-side {
  width: 496.62px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.side-by-side.composition-circle-remaining {
  width: calc(491.62px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.g1-composition-strand-subitized {
  width: 690.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(684.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.g1-composition-strand-subitized.side-by-side {
  width: 511.22px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-14.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(505.22px - 100%);
}

/* line 122, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15 {
  width: 716.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.composition-circle-remaining {
  width: calc(711.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.side-by-side {
  width: 530.2px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.side-by-side.composition-circle-remaining {
  width: calc(525.2px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.g1-composition-strand-subitized {
  width: 736.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(730.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.g1-composition-strand-subitized.side-by-side {
  width: 544.8px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-15.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(538.8px - 100%);
}

/* line 128, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16 {
  width: 762.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.composition-circle-remaining {
  width: calc(757.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.side-by-side {
  width: 563.78px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.side-by-side.composition-circle-remaining {
  width: calc(558.78px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.g1-composition-strand-subitized {
  width: 802.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(796.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.g1-composition-strand-subitized.side-by-side {
  width: 592.98px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-16.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(586.98px - 100%);
}

/* line 128, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17 {
  width: 808.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.composition-circle-remaining {
  width: calc(803.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.side-by-side {
  width: 597.36px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.side-by-side.composition-circle-remaining {
  width: calc(592.36px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.g1-composition-strand-subitized {
  width: 848.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(842.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.g1-composition-strand-subitized.side-by-side {
  width: 626.56px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-17.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(620.56px - 100%);
}

/* line 128, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18 {
  width: 854.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.composition-circle-remaining {
  width: calc(849.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.side-by-side {
  width: 630.94px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.side-by-side.composition-circle-remaining {
  width: calc(625.94px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.g1-composition-strand-subitized {
  width: 894.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(888.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.g1-composition-strand-subitized.side-by-side {
  width: 660.14px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-18.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(654.14px - 100%);
}

/* line 128, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19 {
  width: 900.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.composition-circle-remaining {
  width: calc(895.5px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.side-by-side {
  width: 664.52px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.side-by-side.composition-circle-remaining {
  width: calc(659.52px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.g1-composition-strand-subitized {
  width: 940.5px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(934.5px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.g1-composition-strand-subitized.side-by-side {
  width: 693.72px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-19.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(687.72px - 100%);
}

/* line 133, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20 {
  width: 948px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.composition-circle-remaining {
  width: calc(943px - 100%);
}

/* line 85, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.side-by-side {
  width: 699.6px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.side-by-side.composition-circle-remaining {
  width: calc(694.6px - 100%);
}

/* line 90, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.g1-composition-strand-subitized {
  width: 988px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.g1-composition-strand-subitized.composition-circle-remaining {
  width: calc(982px - 100%);
}

/* line 94, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.g1-composition-strand-subitized.side-by-side {
  width: 728.8px;
}

/* line 76, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle.circled-20.g1-composition-strand-subitized.side-by-side.composition-circle-remaining {
  width: calc(722.8px - 100%);
}

/* line 138, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-circle-remaining {
  top: -5px;
  left: 100%;
}

/* line 145, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .group-items {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 148, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .group-item-slot.cross-out {
  opacity: 0.3;
}

/* line 151, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 4px;
  z-index: 1;
  height: 3px;
  background: #787778;
}

/* line 158, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.side-by-side {
  left: 2px;
}

/* line 176, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1 {
  width: 46px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1.side-by-side {
  width: 33.58px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1.g1-composition-strand-subitized {
  width: 46px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1.g1-composition-strand-subitized.side-by-side {
  width: 33.58px;
}

/* line 178, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1.second-strand {
  left: 362px;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-1.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 176, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2 {
  width: 92px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2.side-by-side {
  width: 67.16px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2.g1-composition-strand-subitized {
  width: 92px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2.g1-composition-strand-subitized.side-by-side {
  width: 67.16px;
}

/* line 178, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2.second-strand {
  left: 362px;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-2.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 176, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3 {
  width: 138px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3.side-by-side {
  width: 100.74px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3.g1-composition-strand-subitized {
  width: 138px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3.g1-composition-strand-subitized.side-by-side {
  width: 100.74px;
}

/* line 178, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3.second-strand {
  left: 362px;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-3.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 176, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4 {
  width: 184px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4.side-by-side {
  width: 134.32px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4.g1-composition-strand-subitized {
  width: 184px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4.g1-composition-strand-subitized.side-by-side {
  width: 134.32px;
}

/* line 178, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4.second-strand {
  left: 362px;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-4.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 176, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5 {
  width: 230px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5.side-by-side {
  width: 167.9px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5.g1-composition-strand-subitized {
  width: 230px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5.g1-composition-strand-subitized.side-by-side {
  width: 167.9px;
}

/* line 178, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5.second-strand {
  left: 362px;
}

/* line 180, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-5.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 188, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6 {
  width: 276px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6.side-by-side {
  width: 201.48px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6.g1-composition-strand-subitized {
  width: 296px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6.g1-composition-strand-subitized.side-by-side {
  width: 216.08px;
}

/* line 190, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6.second-strand {
  left: 362px;
}

/* line 192, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-6.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 188, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7 {
  width: 322px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7.side-by-side {
  width: 235.06px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7.g1-composition-strand-subitized {
  width: 342px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7.g1-composition-strand-subitized.side-by-side {
  width: 249.66px;
}

/* line 190, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7.second-strand {
  left: 362px;
}

/* line 192, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-7.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 188, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8 {
  width: 368px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8.side-by-side {
  width: 268.64px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8.g1-composition-strand-subitized {
  width: 388px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8.g1-composition-strand-subitized.side-by-side {
  width: 283.24px;
}

/* line 190, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8.second-strand {
  left: 362px;
}

/* line 192, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-8.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 188, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9 {
  width: 414px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9.side-by-side {
  width: 302.22px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9.g1-composition-strand-subitized {
  width: 434px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9.g1-composition-strand-subitized.side-by-side {
  width: 316.82px;
}

/* line 190, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9.second-strand {
  left: 362px;
}

/* line 192, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-9.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 188, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10 {
  width: 460px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10.side-by-side {
  width: 335.8px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10.g1-composition-strand-subitized {
  width: 480px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10.g1-composition-strand-subitized.side-by-side {
  width: 350.4px;
}

/* line 190, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10.second-strand {
  left: 362px;
}

/* line 192, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-10.second-strand.g1-composition-strand-subitized {
  left: 376px;
}

/* line 200, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-11 {
  width: 531px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-11.side-by-side {
  width: 394.38px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-11.g1-composition-strand-subitized {
  width: 551px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-11.g1-composition-strand-subitized.side-by-side {
  width: 408.98px;
}

/* line 200, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-12 {
  width: 577px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-12.side-by-side {
  width: 427.96px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-12.g1-composition-strand-subitized {
  width: 597px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-12.g1-composition-strand-subitized.side-by-side {
  width: 442.56px;
}

/* line 200, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-13 {
  width: 623px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-13.side-by-side {
  width: 461.54px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-13.g1-composition-strand-subitized {
  width: 643px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-13.g1-composition-strand-subitized.side-by-side {
  width: 476.14px;
}

/* line 200, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-14 {
  width: 669px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-14.side-by-side {
  width: 495.12px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-14.g1-composition-strand-subitized {
  width: 689px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-14.g1-composition-strand-subitized.side-by-side {
  width: 509.72px;
}

/* line 200, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-15 {
  width: 715px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-15.side-by-side {
  width: 528.7px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-15.g1-composition-strand-subitized {
  width: 735px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-15.g1-composition-strand-subitized.side-by-side {
  width: 543.3px;
}

/* line 206, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-16 {
  width: 761px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-16.side-by-side {
  width: 562.28px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-16.g1-composition-strand-subitized {
  width: 801px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-16.g1-composition-strand-subitized.side-by-side {
  width: 591.48px;
}

/* line 206, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-17 {
  width: 807px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-17.side-by-side {
  width: 595.86px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-17.g1-composition-strand-subitized {
  width: 847px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-17.g1-composition-strand-subitized.side-by-side {
  width: 625.06px;
}

/* line 206, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-18 {
  width: 853px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-18.side-by-side {
  width: 629.44px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-18.g1-composition-strand-subitized {
  width: 893px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-18.g1-composition-strand-subitized.side-by-side {
  width: 658.64px;
}

/* line 206, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-19 {
  width: 899px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-19.side-by-side {
  width: 663.02px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-19.g1-composition-strand-subitized {
  width: 939px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-19.g1-composition-strand-subitized.side-by-side {
  width: 692.22px;
}

/* line 206, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-20 {
  width: 945px;
}

/* line 164, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-20.side-by-side {
  width: 696.6px;
}

/* line 167, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-20.g1-composition-strand-subitized {
  width: 985px;
}

/* line 169, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only .composition-cross-out.cross-out-20.g1-composition-strand-subitized.side-by-side {
  width: 725.8px;
}

/* line 213, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.side-by-side {
  display: inline-block;
  margin: 0;
}

/* line 216, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.side-by-side .groups-box, .composition-token .g1-composition-strand.display-only.side-by-side .groups-box .group {
  width: 348px;
  height: 49px;
}

/* line 223, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.side-by-side .groups-box .group .group-items {
  -webkit-transform: scale(0.73, 0.73);
  -moz-transform: scale(0.73, 0.73);
  -ms-transform: scale(0.73, 0.73);
  -o-transform: scale(0.73, 0.73);
  transform: scale(0.73, 0.73);
  width: auto;
  height: auto;
}

/* line 231, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.side-by-side.g1-composition-strand-subitized .groups-box, .composition-token .g1-composition-strand.display-only.side-by-side.g1-composition-strand-subitized .groups-box .group {
  width: 361px;
}

/* line 238, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.embed.side-by-side {
  margin: 10px 0;
}

/* line 243, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-strand.display-only.side-by-side:first-child {
  margin-right: 6px;
}

/* line 248, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid {
  display: inline-block;
}

/* line 255, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.embed {
  margin-top: 5px;
  margin-bottom: 5px;
}

/* line 261, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid:nth-child(2) {
  margin-left: 35px;
}

/* line 265, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid .composition-highlight-bg {
  position: absolute;
  left: -8px;
  top: -8px;
  width: 108px;
  height: 246px;
  border: 5px solid #fad232;
  border-radius: 20px;
}

/* line 276, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal .composition-highlight-bg {
  width: 246px;
  height: 108px;
}

/* line 281, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal.embed .composition-highlight-bg {
  width: 211px;
  height: 94px;
}

/* line 291, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal.g1-composition.embed .groups-box, .composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal.g1-composition.embed .groups-box .group {
  width: 201px;
  height: 84px;
}

/* line 296, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal.g1-composition.embed .groups-box {
  padding: 0;
}

/* line 299, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid.g1-composition-ten-grid-horizontal.g1-composition.embed .groups-box .group .group-items {
  -webkit-transform: scale(0.85, 0.85);
  -moz-transform: scale(0.85, 0.85);
  -ms-transform: scale(0.85, 0.85);
  -o-transform: scale(0.85, 0.85);
  transform: scale(0.85, 0.85);
  width: auto;
  height: auto;
}

/* line 313, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-unstructured.display-only.embed {
  margin-bottom: 0;
}

/* line 315, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-unstructured.display-only.embed .groups-box {
  padding: 0;
  height: auto;
}

/* line 318, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-unstructured.display-only.embed .groups-box .group {
  margin: 0;
  width: 225px;
  height: 150px;
}

/* line 323, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-unstructured.display-only.embed .groups-box .group .group-items {
  -webkit-transform: scale(0.6, 0.6);
  -moz-transform: scale(0.6, 0.6);
  -ms-transform: scale(0.6, 0.6);
  -o-transform: scale(0.6, 0.6);
  transform: scale(0.6, 0.6);
}

/* line 332, app/assets/stylesheets/shared/general/tokens/composition.scss */
.composition-token .g1-composition-ten-grid .composition-highlight, .composition-token .g1-composition-strand .composition-highlight {
  position: absolute;
  left: -5px;
  top: -5px;
  width: 50px;
  height: 50px;
  border: 5px solid #fad232;
  border-radius: 25px;
  z-index: 1;
}
/* line 20, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token {
  display: inline-block;
}

/* line 22, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.scaled {
  width: 297px;
  height: 155.25px;
}

/* line 26, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.scaled.two-rows {
  height: 292.5px;
}

/* line 29, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.scaled .counting-mat-mat {
  -webkit-transform: scale(0.75);
  -moz-transform: scale(0.75);
  -ms-transform: scale(0.75);
  -o-transform: scale(0.75);
  transform: scale(0.75);
  -webkit-transform-origin: top left 0;
  -moz-transform-origin: top left 0;
  -ms-transform-origin: top left 0;
  -o-transform-origin: top left 0;
  transform-origin: top left 0;
}

/* line 35, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-mat {
  width: 396px;
  height: 207px;
  padding: 14px 24px;
  border: 3px solid #808080;
  border-radius: 15px;
  background-color: white;
  font-size: 0;
  text-align: left;
}

/* line 45, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-row {
  position: relative;
  height: 173px;
}

/* line 52, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.two-rows .counting-mat-mat {
  height: 390px;
}

/* line 56, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.two-rows .counting-mat-row:last-child {
  margin-top: 10px;
}

/* line 62, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-mat {
  padding: 14px 16px;
}

/* line 66, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-clm.ones {
  position: absolute;
  right: 0;
  width: 105px;
  white-space: normal;
  margin-left: 0;
  margin-right: 0;
}

/* line 77, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-cell.ones {
  position: relative;
  display: inline-block;
  margin-right: 0;
  margin-bottom: 4px;
  margin-left: 7px;
}

/* line 100, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .circle-part {
  position: absolute;
  z-index: 1;
  border-width: 0;
  border-style: solid;
  border-color: #4d4d4d;
}

/* line 107, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .circle-part.highlight-circle {
  border-color: #fad234;
}

/* line 138, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-right-straight {
  top: -7px;
  left: -4px;
  height: 27px;
  width: 23px;
  border-top-width: 3px;
}

/* line 141, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-left-straight {
  top: -7px;
  left: -2px;
  height: 27px;
  width: 21px;
  border-top-width: 3px;
}

/* line 144, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .bottom-right-straight {
  top: -7px;
  left: -2px;
  height: 27px;
  width: 23px;
  border-bottom-width: 3px;
}

/* line 147, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .bottom-left-straight {
  top: -7px;
  left: -2px;
  height: 27px;
  width: 28px;
  border-bottom-width: 3px;
}

/* line 150, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .left-top-straight {
  top: -7px;
  left: -9px;
  height: 27px;
  width: 28px;
  border-left-width: 3px;
}

/* line 153, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .left-bottom-straight {
  top: -7px;
  left: -9px;
  height: 27px;
  width: 28px;
  border-left-width: 3px;
}

/* line 157, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-left-curve {
  top: -7px;
  left: -9px;
  height: 27px;
  width: 28px;
  border-top-width: 3px;
  border-left-width: 3px;
  border-top-left-radius: 10px;
}

/* line 160, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-right-curve-half {
  top: -7px;
  left: -2px;
  height: 27px;
  width: 23px;
  border-top-width: 3px;
  border-right-width: 3px;
  border-top-right-radius: 10px;
}

/* line 165, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .bottom-right-curve-half {
  top: -7px;
  left: -2px;
  height: 27px;
  width: 23px;
  border-right-width: 3px;
  border-bottom-width: 3px;
  border-bottom-right-radius: 10px;
}

/* line 170, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .bottom-left-curve {
  top: -7px;
  left: -9px;
  height: 27px;
  width: 30px;
  border-bottom-width: 3px;
  border-left-width: 3px;
  border-bottom-left-radius: 10px;
}

/* line 174, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-right-inverted {
  top: -4px;
  left: 18px;
  height: 14px;
  width: 13px;
  border-top-width: 3px;
  border-left-width: 3px;
  border-top-left-radius: 10px;
}

/* line 184, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .top-left-inverted {
  top: -18px;
  left: -4px;
  height: 14px;
  width: 12px;
  border-bottom-width: 3px;
  border-left-width: 3px;
  border-bottom-left-radius: 10px;
}

/* line 196, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .extended {
  top: 0;
  left: -9px;
  height: 176px;
  width: 28px;
  border-left-width: 3px;
}

/* line 204, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .extended-hook, .counting-mat-token.vertical .long-extended-hook {
  top: 17px;
  left: -4px;
  width: 30px;
  border-left-width: 3px;
  border-top-width: 3px;
  border-top-left-radius: 10px;
}

/* line 212, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .extended-hook {
  height: 134px;
}

/* line 215, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .long-extended-hook {
  height: 154px;
}

/* line 219, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .half-width-left {
  width: 14px;
}

/* line 222, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .half-width-right {
  left: 8px;
  width: 13px;
}

/* line 226, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .three-quarter-width-right {
  left: 9px;
  width: 18px;
}

/* line 230, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .half-height-top, .counting-mat-token.vertical .top-right-curve-half {
  height: 15px;
}

/* line 233, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .half-height-bottom, .counting-mat-token.vertical .bottom-right-curve-half {
  top: 7px;
  height: 13px;
}

/* line 241, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-row:first-child .singleton {
  top: -7px;
  left: -9px;
  height: 183px;
  width: 15px;
  border-top-width: 3px;
  border-left-width: 3px;
  border-top-left-radius: 10px;
}

/* line 249, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-row:first-child .singleton::after {
  content: '';
  position: absolute;
  top: -3px;
  left: 10px;
  height: 173px;
  width: 13px;
  border-width: 0;
  border-radius: 0;
  border-color: inherit;
  border-style: inherit;
  border-top-width: 3px;
  border-right-width: 3px;
  border-top-right-radius: 10px;
}

/* line 270, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token.vertical .counting-mat-row:last-child .singleton {
  top: -15px;
  left: -9px;
  height: 35px;
  width: 29px;
  border-right-width: 3px;
  border-bottom-width: 3px;
  border-left-width: 3px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

/* line 284, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-clm {
  display: inline-block;
  position: relative;
  vertical-align: top;
  margin: 0 9px 0 3px;
}

/* line 289, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-clm:first-child {
  margin-left: 0;
}

/* line 292, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-clm:last-child {
  margin-right: 0;
}

/* line 296, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-clm.decorate {
  outline: 4px solid #fad234;
}

/* line 309, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell {
  display: block;
  margin: 3px;
  width: 14px;
  height: 14px;
  outline-width: 3px;
  outline-style: solid;
  outline-color: transparent;
}

/* line 318, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.tens.addend-0 {
  outline-color: #bc7fe3;
}

/* line 304, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.tens.addend-0.cross-out {
  outline-color: #e9d5f6;
}

/* line 321, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.tens.addend-1 {
  outline-color: #cd1f2e;
}

/* line 304, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.tens.addend-1.cross-out {
  outline-color: #efb5ba;
}

/* line 326, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.decorate {
  outline-color: #fad234;
}

/* line 333, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.addend-0, .counting-mat-token .counting-mat-clm.addend-0 {
  background-color: #7a00c9;
}

/* line 304, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.addend-0.cross-out, .counting-mat-token .counting-mat-clm.addend-0.cross-out {
  background-color: #d3abed;
}

/* line 336, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.addend-1, .counting-mat-token .counting-mat-clm.addend-1 {
  background-color: #eb731c;
}

/* line 304, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cell.addend-1.cross-out, .counting-mat-token .counting-mat-clm.addend-1.cross-out {
  background-color: #f8d1b4;
}

/* line 342, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cross-out-clm {
  position: absolute;
  left: -3.5px;
  top: 53px;
  height: 67px;
  width: 27px;
  stroke: #999999;
  stroke-width: 4px;
}

/* line 354, app/assets/stylesheets/shared/general/tokens/counting_mat.scss */
.counting-mat-token .counting-mat-cross-out-cell {
  height: 100%;
  width: 100%;
  stroke: #999999;
  stroke-width: 3px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* TODO: SFI / SLAS tasks convert to vue - keep variables for number_bond_parts
         move nbp-specific scss into SFI / SLAS tasks when converted
*/
/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .super-fill-in-widget .number-bond-parts-token .nbp-whole-token-wrapper .fraction, body:not(.g6plus) .super-fill-in-widget .number-bond-parts-token .nbp-whole-token-wrapper .number-input {
  font-size: 24px;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .super-fill-in-widget .number-bond-parts-token .nbp-whole-token-wrapper .fraction, body.g6plus .super-fill-in-widget .number-bond-parts-token .nbp-whole-token-wrapper .number-input {
  font-size: 25px;
}

/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .super-fill-in-widget .number-bond-parts-token .nbp-part-token-wrapper .fraction, body:not(.g6plus) .super-fill-in-widget .number-bond-parts-token .nbp-part-token-wrapper .number-input {
  font-size: 18px;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .super-fill-in-widget .number-bond-parts-token .nbp-part-token-wrapper .fraction, body.g6plus .super-fill-in-widget .number-bond-parts-token .nbp-part-token-wrapper .number-input {
  font-size: 19px;
}

/* line 32, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .graded .nbp-whole-part-token {
  height: calc(100% + 2 * 2px);
  width: calc(100% + 2 * 2px);
}

/* line 42, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .super-input:not(.correct):not(.try-again):not(.incorrect), .super-fill-in-widget .number-bond-parts-token .super-input.correct.done {
  border-color: #435259;
}

/* line 64, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .large .super-input, .super-fill-in-widget .number-bond-parts-token .whole .super-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 104px;
  height: 104px;
  border-radius: 52px;
  position: relative;
  top: -2px;
  left: -2px;
}

/* line 51, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .large .super-input.fraction-input, .super-fill-in-widget .number-bond-parts-token .whole .super-input.fraction-input {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0;
}

/* line 67, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .small .super-input {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 70px;
  height: 70px;
  border-radius: 35px;
  position: relative;
  top: -2px;
  left: -2px;
}

/* line 51, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-fill-in-widget .number-bond-parts-token .small .super-input.fraction-input {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 0;
}

/* line 74, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .graded .nbp-whole-part-token {
  height: calc(100% + 2 * 2px);
  width: calc(100% + 2 * 2px);
}

/* line 79, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .tile-destination-slot {
  position: relative;
  top: -2px;
  left: -2px;
}

/* line 91, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected) {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 104px;
  height: 104px;
  border-radius: 52px;
  transition: none;
  min-width: 0 !important;
  min-height: 0 !important;
}

/* line 102, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .large .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .whole .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected) .tile {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-width: 0;
  border-radius: 52px;
  width: 100% !important;
  height: 100% !important;
}

/* line 91, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected), .super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected) {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 70px;
  height: 70px;
  border-radius: 35px;
  transition: none;
  min-width: 0 !important;
  min-height: 0 !important;
}

/* line 102, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.try-again:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-sentence .number-bond-parts-token .small .tile-destination-slot.incorrect-tile:not(.prepopulated):not(.autocorrected) .tile {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-width: 0;
  border-radius: 35px;
  width: 100% !important;
  height: 100% !important;
}

/* line 122, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .tile-destination-slot.autocorrected {
  min-width: 0 !important;
  min-height: 0 !important;
}

/* line 126, app/assets/stylesheets/shared/general/tokens/number_bond_parts.scss */
.super-label-a-sentence .number-bond-parts-token .correct-answer {
  height: auto !important;
  width: auto !important;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.number-line-token path, .double-number-line.token path {
  fill: none;
  stroke-width: 2px;
  stroke: #4d4d4d;
}

/* line 13, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.number-line-token path.filled, .double-number-line.token path.filled {
  fill: #4d4d4d;
}

/* line 24, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.multiple-choice-task .multiple-choice .multiple-choice-inner .number-line-token .nl-fraction .token-text, .multiple-choice-task .smc-choice .smc-choice-inner .number-line-token .nl-fraction .token-text, .super-multiple-choice-widget .multiple-choice .multiple-choice-inner .number-line-token .nl-fraction .token-text, .super-multiple-choice-widget .smc-choice .smc-choice-inner .number-line-token .nl-fraction .token-text {
  line-height: 41px;
}

/* line 27, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.multiple-choice-task .multiple-choice .multiple-choice-inner .number-line-token .nl-fraction .fraction-token .token-text, .multiple-choice-task .smc-choice .smc-choice-inner .number-line-token .nl-fraction .fraction-token .token-text, .super-multiple-choice-widget .multiple-choice .multiple-choice-inner .number-line-token .nl-fraction .fraction-token .token-text, .super-multiple-choice-widget .smc-choice .smc-choice-inner .number-line-token .nl-fraction .fraction-token .token-text {
  line-height: normal;
}

/* line 35, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.multiple-choice-task .scaled-down .number-line-token .nl-point-label, .super-multiple-choice-widget .scaled-down .number-line-token .nl-point-label {
  bottom: 38px;
}

/* line 44, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in .number-line-token .nl-top-label {
  bottom: 33px;
}

/* line 47, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in .number-line-token .nl-bottom-labels {
  top: 33px;
}

/* line 52, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in .number-line-token .super-input.number-input {
  height: 32px;
}

/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .super-fill-in-widget .number-line-token input.number-input, body:not(.g6plus) .super-fill-in-widget .number-line-token .fraction {
  font-size: 16px;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .super-fill-in-widget .number-line-token input.number-input, body.g6plus .super-fill-in-widget .number-line-token .fraction {
  font-size: 17px;
}

/* line 61, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in-widget .number-line-token .fraction.token:not(.fraction-input) {
  width: calc(1.7em + 8px);
}

/* line 63, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in-widget .number-line-token .fraction.token:not(.fraction-input) .numerator .token-text, .super-fill-in-widget .number-line-token .fraction.token:not(.fraction-input) .denominator .token-text {
  display: block;
  border: 2px solid transparent;
  margin: 4px 0;
}

/* line 70, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in-widget .number-line-token .nl-fraction .token-text {
  line-height: 41px;
}

/* line 73, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-fill-in-widget .number-line-token .nl-fraction .fraction-token .token-text {
  line-height: normal;
}

/* line 82, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-label-a-sentence .number-line-token {
  font-size: 16px;
}

/* line 85, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-label-a-sentence .number-line-token .nl-axis {
  margin: 50px auto;
}

/* line 89, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-label-a-sentence .number-line-token .nl-label:not(.nl-fraction) {
  margin-top: 9px;
}

/* line 92, app/assets/stylesheets/shared/general/tokens/number_line.scss */
.super-label-a-sentence .number-line-token .nl-fraction {
  line-height: 102px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 248, app/assets/stylesheets/shared/_student_variables.scss */
.super-input:not(.correct):not(.incorrect) .zearn-input:not(.full):not(.inactive):not(.dropdown-selected-display)::after, .zearn-input:not(.correct):not(.incorrect):not(.full):not(.inactive):not(.dropdown-selected-display)::after {
  content: "|";
  font-weight: 100;
  position: relative;
  top: -3px;
  left: 2px;
  margin-left: -2px;
  -webkit-animation: blink 1300ms linear infinite;
  -moz-animation: blink 1300ms linear infinite;
  -ms-animation: blink 1300ms linear infinite;
  -o-animation: blink 1300ms linear infinite;
  animation: blink 1300ms linear infinite;
}

/* line 51, app/assets/stylesheets/shared/general/zearn_input.scss */
.zearn-input:focus {
  outline: none !important;
}

/* line 59, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input-box, .number-sense-task-group .zearn-input {
  border: 4px solid black;
  border-radius: 8px;
  min-width: 85px;
  display: inline-block;
}

/* line 66, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input {
  font-size: 40px;
  transition: background 250ms, color 250ms, border-color 250ms;
}

/* line 71, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 15px;
}

/* line 76, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.correct:not(.correct-done) {
  background-color: #50cb13;
  color: white;
  border-color: #50cb13;
}

/* line 82, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.correct.correct-done {
  border-color: transparent;
}

/* line 86, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.incorrect {
  background-color: #ff005b;
  color: white;
  border-color: #ff005b;
}

/* line 92, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.try-again {
  border-color: #ff4d76;
  color: #323232;
  background-color: #ffe3ee;
}

/* line 98, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.incorrect-done {
  border-color: transparent;
}

/* line 102, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.clickable {
  cursor: pointer;
  z-index: 20;
}

/* line 107, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.grayed {
  border-color: #e4e4e4;
  background-color: #e4e4e4;
}

/* line 112, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.unknown {
  border-color: transparent;
}

/* line 116, app/assets/stylesheets/shared/general/zearn_input.scss */
.number-sense-task-group .zearn-input.jiggle {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 128, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input, .super-fill-in-widget .number-input, .super-fill-in-widget .super-input, .place-value-mat-widget .zearn-input, .place-value-mat-widget .number-input, .place-value-mat-widget .super-input, .sf-problems .zearn-input, .sf-problems .number-input, .sf-problems .super-input {
  -webkit-transition: all 200ms;
  -moz-transition: all 200ms;
  -ms-transition: all 200ms;
  -o-transition: all 200ms;
  transition: all 200ms;
  border-width: 2px;
  border-style: solid;
  border-radius: 4px;
  background-color: white;
  display: inline-block;
  margin-top: 1px;
}

/* line 139, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input:not(.zearn-input), .super-fill-in-widget .number-input:not(.zearn-input), .super-fill-in-widget .super-input:not(.zearn-input), .place-value-mat-widget .zearn-input:not(.zearn-input), .place-value-mat-widget .number-input:not(.zearn-input), .place-value-mat-widget .super-input:not(.zearn-input), .sf-problems .zearn-input:not(.zearn-input), .sf-problems .number-input:not(.zearn-input), .sf-problems .super-input:not(.zearn-input) {
  border-color: transparent;
}

/* line 143, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.try-again, .super-fill-in-widget .zearn-input.correct, .super-fill-in-widget .zearn-input.incorrect, .super-fill-in-widget .zearn-input.pre-ghost-autocorrect, .super-fill-in-widget .number-input.try-again, .super-fill-in-widget .number-input.correct, .super-fill-in-widget .number-input.incorrect, .super-fill-in-widget .number-input.pre-ghost-autocorrect, .super-fill-in-widget .super-input.try-again, .super-fill-in-widget .super-input.correct, .super-fill-in-widget .super-input.incorrect, .super-fill-in-widget .super-input.pre-ghost-autocorrect, .place-value-mat-widget .zearn-input.try-again, .place-value-mat-widget .zearn-input.correct, .place-value-mat-widget .zearn-input.incorrect, .place-value-mat-widget .zearn-input.pre-ghost-autocorrect, .place-value-mat-widget .number-input.try-again, .place-value-mat-widget .number-input.correct, .place-value-mat-widget .number-input.incorrect, .place-value-mat-widget .number-input.pre-ghost-autocorrect, .place-value-mat-widget .super-input.try-again, .place-value-mat-widget .super-input.correct, .place-value-mat-widget .super-input.incorrect, .place-value-mat-widget .super-input.pre-ghost-autocorrect, .sf-problems .zearn-input.try-again, .sf-problems .zearn-input.correct, .sf-problems .zearn-input.incorrect, .sf-problems .zearn-input.pre-ghost-autocorrect, .sf-problems .number-input.try-again, .sf-problems .number-input.correct, .sf-problems .number-input.incorrect, .sf-problems .number-input.pre-ghost-autocorrect, .sf-problems .super-input.try-again, .sf-problems .super-input.correct, .sf-problems .super-input.incorrect, .sf-problems .super-input.pre-ghost-autocorrect {
  border-width: 4px;
}

/* line 147, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.correct, .super-fill-in-widget .number-input.correct, .super-fill-in-widget .super-input.correct, .place-value-mat-widget .zearn-input.correct, .place-value-mat-widget .number-input.correct, .place-value-mat-widget .super-input.correct, .sf-problems .zearn-input.correct, .sf-problems .number-input.correct, .sf-problems .super-input.correct {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 152, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.try-again, .super-fill-in-widget .zearn-input.incorrect:not(.correctable):not(.done), .super-fill-in-widget .zearn-input.pre-ghost-autocorrect, .super-fill-in-widget .number-input.try-again, .super-fill-in-widget .number-input.incorrect:not(.correctable):not(.done), .super-fill-in-widget .number-input.pre-ghost-autocorrect, .super-fill-in-widget .super-input.try-again, .super-fill-in-widget .super-input.incorrect:not(.correctable):not(.done), .super-fill-in-widget .super-input.pre-ghost-autocorrect, .place-value-mat-widget .zearn-input.try-again, .place-value-mat-widget .zearn-input.incorrect:not(.correctable):not(.done), .place-value-mat-widget .zearn-input.pre-ghost-autocorrect, .place-value-mat-widget .number-input.try-again, .place-value-mat-widget .number-input.incorrect:not(.correctable):not(.done), .place-value-mat-widget .number-input.pre-ghost-autocorrect, .place-value-mat-widget .super-input.try-again, .place-value-mat-widget .super-input.incorrect:not(.correctable):not(.done), .place-value-mat-widget .super-input.pre-ghost-autocorrect, .sf-problems .zearn-input.try-again, .sf-problems .zearn-input.incorrect:not(.correctable):not(.done), .sf-problems .zearn-input.pre-ghost-autocorrect, .sf-problems .number-input.try-again, .sf-problems .number-input.incorrect:not(.correctable):not(.done), .sf-problems .number-input.pre-ghost-autocorrect, .sf-problems .super-input.try-again, .sf-problems .super-input.incorrect:not(.correctable):not(.done), .sf-problems .super-input.pre-ghost-autocorrect {
  border-color: #ff4d76;
  background-color: #ffe3ee;
}

/* line 158, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.incorrect.correctable, .super-fill-in-widget .number-input.incorrect.correctable, .super-fill-in-widget .super-input.incorrect.correctable, .place-value-mat-widget .zearn-input.incorrect.correctable, .place-value-mat-widget .number-input.incorrect.correctable, .place-value-mat-widget .super-input.incorrect.correctable, .sf-problems .zearn-input.incorrect.correctable, .sf-problems .number-input.incorrect.correctable, .sf-problems .super-input.incorrect.correctable {
  background-color: #ff4d76;
  color: white;
  border-color: #ff4d76;
}

/* line 163, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.incorrect.correctable .zearn-input, .super-fill-in-widget .zearn-input.incorrect.correctable .number-input, .super-fill-in-widget .number-input.incorrect.correctable .zearn-input, .super-fill-in-widget .number-input.incorrect.correctable .number-input, .super-fill-in-widget .super-input.incorrect.correctable .zearn-input, .super-fill-in-widget .super-input.incorrect.correctable .number-input, .place-value-mat-widget .zearn-input.incorrect.correctable .zearn-input, .place-value-mat-widget .zearn-input.incorrect.correctable .number-input, .place-value-mat-widget .number-input.incorrect.correctable .zearn-input, .place-value-mat-widget .number-input.incorrect.correctable .number-input, .place-value-mat-widget .super-input.incorrect.correctable .zearn-input, .place-value-mat-widget .super-input.incorrect.correctable .number-input, .sf-problems .zearn-input.incorrect.correctable .zearn-input, .sf-problems .zearn-input.incorrect.correctable .number-input, .sf-problems .number-input.incorrect.correctable .zearn-input, .sf-problems .number-input.incorrect.correctable .number-input, .sf-problems .super-input.incorrect.correctable .zearn-input, .sf-problems .super-input.incorrect.correctable .number-input {
  color: white;
}

/* line 168, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.incorrect.done, .super-fill-in-widget .number-input.incorrect.done, .super-fill-in-widget .super-input.incorrect.done, .place-value-mat-widget .zearn-input.incorrect.done, .place-value-mat-widget .number-input.incorrect.done, .place-value-mat-widget .super-input.incorrect.done, .sf-problems .zearn-input.incorrect.done, .sf-problems .number-input.incorrect.done, .sf-problems .super-input.incorrect.done {
  color: #ff4d76;
}

/* line 171, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.incorrect.done .zearn-input, .super-fill-in-widget .zearn-input.incorrect.done .number-input, .super-fill-in-widget .number-input.incorrect.done .zearn-input, .super-fill-in-widget .number-input.incorrect.done .number-input, .super-fill-in-widget .super-input.incorrect.done .zearn-input, .super-fill-in-widget .super-input.incorrect.done .number-input, .place-value-mat-widget .zearn-input.incorrect.done .zearn-input, .place-value-mat-widget .zearn-input.incorrect.done .number-input, .place-value-mat-widget .number-input.incorrect.done .zearn-input, .place-value-mat-widget .number-input.incorrect.done .number-input, .place-value-mat-widget .super-input.incorrect.done .zearn-input, .place-value-mat-widget .super-input.incorrect.done .number-input, .sf-problems .zearn-input.incorrect.done .zearn-input, .sf-problems .zearn-input.incorrect.done .number-input, .sf-problems .number-input.incorrect.done .zearn-input, .sf-problems .number-input.incorrect.done .number-input, .sf-problems .super-input.incorrect.done .zearn-input, .sf-problems .super-input.incorrect.done .number-input {
  color: #ff4d76;
}

/* line 177, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.try-again, .super-fill-in-widget .zearn-input.incorrect.correctable, .super-fill-in-widget .number-input.try-again, .super-fill-in-widget .number-input.incorrect.correctable, .super-fill-in-widget .super-input.try-again, .super-fill-in-widget .super-input.incorrect.correctable, .place-value-mat-widget .zearn-input.try-again, .place-value-mat-widget .zearn-input.incorrect.correctable, .place-value-mat-widget .number-input.try-again, .place-value-mat-widget .number-input.incorrect.correctable, .place-value-mat-widget .super-input.try-again, .place-value-mat-widget .super-input.incorrect.correctable, .sf-problems .zearn-input.try-again, .sf-problems .zearn-input.incorrect.correctable, .sf-problems .number-input.try-again, .sf-problems .number-input.incorrect.correctable, .sf-problems .super-input.try-again, .sf-problems .super-input.incorrect.correctable {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.try-again .zearn-input, .super-fill-in-widget .zearn-input.try-again .number-input, .super-fill-in-widget .zearn-input.incorrect.correctable .zearn-input, .super-fill-in-widget .zearn-input.incorrect.correctable .number-input, .super-fill-in-widget .number-input.try-again .zearn-input, .super-fill-in-widget .number-input.try-again .number-input, .super-fill-in-widget .number-input.incorrect.correctable .zearn-input, .super-fill-in-widget .number-input.incorrect.correctable .number-input, .super-fill-in-widget .super-input.try-again .zearn-input, .super-fill-in-widget .super-input.try-again .number-input, .super-fill-in-widget .super-input.incorrect.correctable .zearn-input, .super-fill-in-widget .super-input.incorrect.correctable .number-input, .place-value-mat-widget .zearn-input.try-again .zearn-input, .place-value-mat-widget .zearn-input.try-again .number-input, .place-value-mat-widget .zearn-input.incorrect.correctable .zearn-input, .place-value-mat-widget .zearn-input.incorrect.correctable .number-input, .place-value-mat-widget .number-input.try-again .zearn-input, .place-value-mat-widget .number-input.try-again .number-input, .place-value-mat-widget .number-input.incorrect.correctable .zearn-input, .place-value-mat-widget .number-input.incorrect.correctable .number-input, .place-value-mat-widget .super-input.try-again .zearn-input, .place-value-mat-widget .super-input.try-again .number-input, .place-value-mat-widget .super-input.incorrect.correctable .zearn-input, .place-value-mat-widget .super-input.incorrect.correctable .number-input, .sf-problems .zearn-input.try-again .zearn-input, .sf-problems .zearn-input.try-again .number-input, .sf-problems .zearn-input.incorrect.correctable .zearn-input, .sf-problems .zearn-input.incorrect.correctable .number-input, .sf-problems .number-input.try-again .zearn-input, .sf-problems .number-input.try-again .number-input, .sf-problems .number-input.incorrect.correctable .zearn-input, .sf-problems .number-input.incorrect.correctable .number-input, .sf-problems .super-input.try-again .zearn-input, .sf-problems .super-input.try-again .number-input, .sf-problems .super-input.incorrect.correctable .zearn-input, .sf-problems .super-input.incorrect.correctable .number-input {
  cursor: pointer;
}

/* line 187, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.done:not(.pre-ghost-autocorrect), .super-fill-in-widget .number-input.done:not(.pre-ghost-autocorrect), .super-fill-in-widget .super-input.done:not(.pre-ghost-autocorrect), .place-value-mat-widget .zearn-input.done:not(.pre-ghost-autocorrect), .place-value-mat-widget .number-input.done:not(.pre-ghost-autocorrect), .place-value-mat-widget .super-input.done:not(.pre-ghost-autocorrect), .sf-problems .zearn-input.done:not(.pre-ghost-autocorrect), .sf-problems .number-input.done:not(.pre-ghost-autocorrect), .sf-problems .super-input.done:not(.pre-ghost-autocorrect) {
  border-color: transparent;
  background-color: transparent;
}

/* line 193, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.correct .zearn-input, .super-fill-in-widget .zearn-input.correct .number-input, .super-fill-in-widget .zearn-input.incorrect .zearn-input, .super-fill-in-widget .zearn-input.incorrect .number-input, .super-fill-in-widget .zearn-input.try-again .zearn-input, .super-fill-in-widget .zearn-input.try-again .number-input, .super-fill-in-widget .zearn-input.pre-ghost-autocorrect .zearn-input, .super-fill-in-widget .zearn-input.pre-ghost-autocorrect .number-input, .super-fill-in-widget .number-input.correct .zearn-input, .super-fill-in-widget .number-input.correct .number-input, .super-fill-in-widget .number-input.incorrect .zearn-input, .super-fill-in-widget .number-input.incorrect .number-input, .super-fill-in-widget .number-input.try-again .zearn-input, .super-fill-in-widget .number-input.try-again .number-input, .super-fill-in-widget .number-input.pre-ghost-autocorrect .zearn-input, .super-fill-in-widget .number-input.pre-ghost-autocorrect .number-input, .super-fill-in-widget .super-input.correct .zearn-input, .super-fill-in-widget .super-input.correct .number-input, .super-fill-in-widget .super-input.incorrect .zearn-input, .super-fill-in-widget .super-input.incorrect .number-input, .super-fill-in-widget .super-input.try-again .zearn-input, .super-fill-in-widget .super-input.try-again .number-input, .super-fill-in-widget .super-input.pre-ghost-autocorrect .zearn-input, .super-fill-in-widget .super-input.pre-ghost-autocorrect .number-input, .place-value-mat-widget .zearn-input.correct .zearn-input, .place-value-mat-widget .zearn-input.correct .number-input, .place-value-mat-widget .zearn-input.incorrect .zearn-input, .place-value-mat-widget .zearn-input.incorrect .number-input, .place-value-mat-widget .zearn-input.try-again .zearn-input, .place-value-mat-widget .zearn-input.try-again .number-input, .place-value-mat-widget .zearn-input.pre-ghost-autocorrect .zearn-input, .place-value-mat-widget .zearn-input.pre-ghost-autocorrect .number-input, .place-value-mat-widget .number-input.correct .zearn-input, .place-value-mat-widget .number-input.correct .number-input, .place-value-mat-widget .number-input.incorrect .zearn-input, .place-value-mat-widget .number-input.incorrect .number-input, .place-value-mat-widget .number-input.try-again .zearn-input, .place-value-mat-widget .number-input.try-again .number-input, .place-value-mat-widget .number-input.pre-ghost-autocorrect .zearn-input, .place-value-mat-widget .number-input.pre-ghost-autocorrect .number-input, .place-value-mat-widget .super-input.correct .zearn-input, .place-value-mat-widget .super-input.correct .number-input, .place-value-mat-widget .super-input.incorrect .zearn-input, .place-value-mat-widget .super-input.incorrect .number-input, .place-value-mat-widget .super-input.try-again .zearn-input, .place-value-mat-widget .super-input.try-again .number-input, .place-value-mat-widget .super-input.pre-ghost-autocorrect .zearn-input, .place-value-mat-widget .super-input.pre-ghost-autocorrect .number-input, .sf-problems .zearn-input.correct .zearn-input, .sf-problems .zearn-input.correct .number-input, .sf-problems .zearn-input.incorrect .zearn-input, .sf-problems .zearn-input.incorrect .number-input, .sf-problems .zearn-input.try-again .zearn-input, .sf-problems .zearn-input.try-again .number-input, .sf-problems .zearn-input.pre-ghost-autocorrect .zearn-input, .sf-problems .zearn-input.pre-ghost-autocorrect .number-input, .sf-problems .number-input.correct .zearn-input, .sf-problems .number-input.correct .number-input, .sf-problems .number-input.incorrect .zearn-input, .sf-problems .number-input.incorrect .number-input, .sf-problems .number-input.try-again .zearn-input, .sf-problems .number-input.try-again .number-input, .sf-problems .number-input.pre-ghost-autocorrect .zearn-input, .sf-problems .number-input.pre-ghost-autocorrect .number-input, .sf-problems .super-input.correct .zearn-input, .sf-problems .super-input.correct .number-input, .sf-problems .super-input.incorrect .zearn-input, .sf-problems .super-input.incorrect .number-input, .sf-problems .super-input.try-again .zearn-input, .sf-problems .super-input.try-again .number-input, .sf-problems .super-input.pre-ghost-autocorrect .zearn-input, .sf-problems .super-input.pre-ghost-autocorrect .number-input {
  border-color: transparent;
  background-color: transparent;
}

/* line 23, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .zearn-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .number-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .number-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .super-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .super-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .zearn-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .zearn-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .number-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .number-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .super-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .super-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .zearn-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .zearn-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .number-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .number-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .super-input.orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .super-input .orange:not(.try-again):not(.correct):not(.incorrect) .zearn-input {
  color: #f75e00;
  border-color: #f75e00;
}

/* line 27, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange.correct.done .zearn-input, .super-fill-in-widget .zearn-input.orange.autocorrected .zearn-input, .super-fill-in-widget .zearn-input .orange.correct.done .zearn-input, .super-fill-in-widget .zearn-input .orange.autocorrected .zearn-input, .super-fill-in-widget .number-input.orange.correct.done .zearn-input, .super-fill-in-widget .number-input.orange.autocorrected .zearn-input, .super-fill-in-widget .number-input .orange.correct.done .zearn-input, .super-fill-in-widget .number-input .orange.autocorrected .zearn-input, .super-fill-in-widget .super-input.orange.correct.done .zearn-input, .super-fill-in-widget .super-input.orange.autocorrected .zearn-input, .super-fill-in-widget .super-input .orange.correct.done .zearn-input, .super-fill-in-widget .super-input .orange.autocorrected .zearn-input, .place-value-mat-widget .zearn-input.orange.correct.done .zearn-input, .place-value-mat-widget .zearn-input.orange.autocorrected .zearn-input, .place-value-mat-widget .zearn-input .orange.correct.done .zearn-input, .place-value-mat-widget .zearn-input .orange.autocorrected .zearn-input, .place-value-mat-widget .number-input.orange.correct.done .zearn-input, .place-value-mat-widget .number-input.orange.autocorrected .zearn-input, .place-value-mat-widget .number-input .orange.correct.done .zearn-input, .place-value-mat-widget .number-input .orange.autocorrected .zearn-input, .place-value-mat-widget .super-input.orange.correct.done .zearn-input, .place-value-mat-widget .super-input.orange.autocorrected .zearn-input, .place-value-mat-widget .super-input .orange.correct.done .zearn-input, .place-value-mat-widget .super-input .orange.autocorrected .zearn-input, .sf-problems .zearn-input.orange.correct.done .zearn-input, .sf-problems .zearn-input.orange.autocorrected .zearn-input, .sf-problems .zearn-input .orange.correct.done .zearn-input, .sf-problems .zearn-input .orange.autocorrected .zearn-input, .sf-problems .number-input.orange.correct.done .zearn-input, .sf-problems .number-input.orange.autocorrected .zearn-input, .sf-problems .number-input .orange.correct.done .zearn-input, .sf-problems .number-input .orange.autocorrected .zearn-input, .sf-problems .super-input.orange.correct.done .zearn-input, .sf-problems .super-input.orange.autocorrected .zearn-input, .sf-problems .super-input .orange.correct.done .zearn-input, .sf-problems .super-input .orange.autocorrected .zearn-input {
  color: #f75e00;
}

/* line 31, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .zearn-input.orange.correct.done .denominator, .super-fill-in-widget .zearn-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .zearn-input .orange.correct.done .denominator, .super-fill-in-widget .number-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .number-input.orange.correct.done .denominator, .super-fill-in-widget .number-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .number-input .orange.correct.done .denominator, .super-fill-in-widget .super-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .super-input.orange.correct.done .denominator, .super-fill-in-widget .super-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .super-input .orange.correct.done .denominator, .place-value-mat-widget .zearn-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .zearn-input.orange.correct.done .denominator, .place-value-mat-widget .zearn-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .zearn-input .orange.correct.done .denominator, .place-value-mat-widget .number-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .number-input.orange.correct.done .denominator, .place-value-mat-widget .number-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .number-input .orange.correct.done .denominator, .place-value-mat-widget .super-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .super-input.orange.correct.done .denominator, .place-value-mat-widget .super-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .super-input .orange.correct.done .denominator, .sf-problems .zearn-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .zearn-input.orange.correct.done .denominator, .sf-problems .zearn-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .zearn-input .orange.correct.done .denominator, .sf-problems .number-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .number-input.orange.correct.done .denominator, .sf-problems .number-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .number-input .orange.correct.done .denominator, .sf-problems .super-input.orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .super-input.orange.correct.done .denominator, .sf-problems .super-input .orange:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .super-input .orange.correct.done .denominator {
  border-top-color: #f75e00;
}

/* line 35, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange .zearn-input.focus, .super-fill-in-widget .zearn-input .orange .zearn-input.focus, .super-fill-in-widget .number-input.orange .zearn-input.focus, .super-fill-in-widget .number-input .orange .zearn-input.focus, .super-fill-in-widget .super-input.orange .zearn-input.focus, .super-fill-in-widget .super-input .orange .zearn-input.focus, .place-value-mat-widget .zearn-input.orange .zearn-input.focus, .place-value-mat-widget .zearn-input .orange .zearn-input.focus, .place-value-mat-widget .number-input.orange .zearn-input.focus, .place-value-mat-widget .number-input .orange .zearn-input.focus, .place-value-mat-widget .super-input.orange .zearn-input.focus, .place-value-mat-widget .super-input .orange .zearn-input.focus, .sf-problems .zearn-input.orange .zearn-input.focus, .sf-problems .zearn-input .orange .zearn-input.focus, .sf-problems .number-input.orange .zearn-input.focus, .sf-problems .number-input .orange .zearn-input.focus, .sf-problems .super-input.orange .zearn-input.focus, .sf-problems .super-input .orange .zearn-input.focus {
  outline: 0;
  box-shadow: #f75e00 0 0 0 2px inset;
  -webkit-appearance: none;
}

/* line 8, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .zearn-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .number-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .number-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .super-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .super-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .zearn-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .zearn-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .number-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .number-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .super-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .super-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .zearn-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .zearn-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .number-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .number-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .super-input.orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .super-input .orange:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect) {
  color: #f75e00;
  border-color: #f75e00;
}

/* line 12, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.orange.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .orange.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .orange.autocorrected:not(.fraction):not(.mixed-fraction-input) {
  color: #f75e00;
}

/* line 15, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.orange.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .orange.focus:not(.fraction):not(.mixed-fraction-input) {
  box-shadow: #f75e00 0 0 0 2px inset;
  -webkit-appearance: none;
}

/* line 23, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .zearn-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .number-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .number-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .super-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .super-fill-in-widget .super-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .zearn-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .zearn-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .number-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .number-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .super-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .place-value-mat-widget .super-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .zearn-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .zearn-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .number-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .number-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .super-input.purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input, .sf-problems .super-input .purple:not(.try-again):not(.correct):not(.incorrect) .zearn-input {
  color: #7a00c9;
  border-color: #7a00c9;
}

/* line 27, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple.correct.done .zearn-input, .super-fill-in-widget .zearn-input.purple.autocorrected .zearn-input, .super-fill-in-widget .zearn-input .purple.correct.done .zearn-input, .super-fill-in-widget .zearn-input .purple.autocorrected .zearn-input, .super-fill-in-widget .number-input.purple.correct.done .zearn-input, .super-fill-in-widget .number-input.purple.autocorrected .zearn-input, .super-fill-in-widget .number-input .purple.correct.done .zearn-input, .super-fill-in-widget .number-input .purple.autocorrected .zearn-input, .super-fill-in-widget .super-input.purple.correct.done .zearn-input, .super-fill-in-widget .super-input.purple.autocorrected .zearn-input, .super-fill-in-widget .super-input .purple.correct.done .zearn-input, .super-fill-in-widget .super-input .purple.autocorrected .zearn-input, .place-value-mat-widget .zearn-input.purple.correct.done .zearn-input, .place-value-mat-widget .zearn-input.purple.autocorrected .zearn-input, .place-value-mat-widget .zearn-input .purple.correct.done .zearn-input, .place-value-mat-widget .zearn-input .purple.autocorrected .zearn-input, .place-value-mat-widget .number-input.purple.correct.done .zearn-input, .place-value-mat-widget .number-input.purple.autocorrected .zearn-input, .place-value-mat-widget .number-input .purple.correct.done .zearn-input, .place-value-mat-widget .number-input .purple.autocorrected .zearn-input, .place-value-mat-widget .super-input.purple.correct.done .zearn-input, .place-value-mat-widget .super-input.purple.autocorrected .zearn-input, .place-value-mat-widget .super-input .purple.correct.done .zearn-input, .place-value-mat-widget .super-input .purple.autocorrected .zearn-input, .sf-problems .zearn-input.purple.correct.done .zearn-input, .sf-problems .zearn-input.purple.autocorrected .zearn-input, .sf-problems .zearn-input .purple.correct.done .zearn-input, .sf-problems .zearn-input .purple.autocorrected .zearn-input, .sf-problems .number-input.purple.correct.done .zearn-input, .sf-problems .number-input.purple.autocorrected .zearn-input, .sf-problems .number-input .purple.correct.done .zearn-input, .sf-problems .number-input .purple.autocorrected .zearn-input, .sf-problems .super-input.purple.correct.done .zearn-input, .sf-problems .super-input.purple.autocorrected .zearn-input, .sf-problems .super-input .purple.correct.done .zearn-input, .sf-problems .super-input .purple.autocorrected .zearn-input {
  color: #7a00c9;
}

/* line 31, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .zearn-input.purple.correct.done .denominator, .super-fill-in-widget .zearn-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .zearn-input .purple.correct.done .denominator, .super-fill-in-widget .number-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .number-input.purple.correct.done .denominator, .super-fill-in-widget .number-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .number-input .purple.correct.done .denominator, .super-fill-in-widget .super-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .super-input.purple.correct.done .denominator, .super-fill-in-widget .super-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .super-fill-in-widget .super-input .purple.correct.done .denominator, .place-value-mat-widget .zearn-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .zearn-input.purple.correct.done .denominator, .place-value-mat-widget .zearn-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .zearn-input .purple.correct.done .denominator, .place-value-mat-widget .number-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .number-input.purple.correct.done .denominator, .place-value-mat-widget .number-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .number-input .purple.correct.done .denominator, .place-value-mat-widget .super-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .super-input.purple.correct.done .denominator, .place-value-mat-widget .super-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .place-value-mat-widget .super-input .purple.correct.done .denominator, .sf-problems .zearn-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .zearn-input.purple.correct.done .denominator, .sf-problems .zearn-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .zearn-input .purple.correct.done .denominator, .sf-problems .number-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .number-input.purple.correct.done .denominator, .sf-problems .number-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .number-input .purple.correct.done .denominator, .sf-problems .super-input.purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .super-input.purple.correct.done .denominator, .sf-problems .super-input .purple:not(.try-again):not(.correctable):not(.correct):not(.incorrect) .denominator, .sf-problems .super-input .purple.correct.done .denominator {
  border-top-color: #7a00c9;
}

/* line 35, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple .zearn-input.focus, .super-fill-in-widget .zearn-input .purple .zearn-input.focus, .super-fill-in-widget .number-input.purple .zearn-input.focus, .super-fill-in-widget .number-input .purple .zearn-input.focus, .super-fill-in-widget .super-input.purple .zearn-input.focus, .super-fill-in-widget .super-input .purple .zearn-input.focus, .place-value-mat-widget .zearn-input.purple .zearn-input.focus, .place-value-mat-widget .zearn-input .purple .zearn-input.focus, .place-value-mat-widget .number-input.purple .zearn-input.focus, .place-value-mat-widget .number-input .purple .zearn-input.focus, .place-value-mat-widget .super-input.purple .zearn-input.focus, .place-value-mat-widget .super-input .purple .zearn-input.focus, .sf-problems .zearn-input.purple .zearn-input.focus, .sf-problems .zearn-input .purple .zearn-input.focus, .sf-problems .number-input.purple .zearn-input.focus, .sf-problems .number-input .purple .zearn-input.focus, .sf-problems .super-input.purple .zearn-input.focus, .sf-problems .super-input .purple .zearn-input.focus {
  outline: 0;
  box-shadow: #7a00c9 0 0 0 2px inset;
  -webkit-appearance: none;
}

/* line 8, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .zearn-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .number-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .number-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .super-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .super-fill-in-widget .super-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .zearn-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .zearn-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .number-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .number-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .super-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .place-value-mat-widget .super-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .zearn-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .zearn-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .number-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .number-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .super-input.purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect), .sf-problems .super-input .purple:not(.fraction):not(.mixed-fraction-input):not(.try-again):not(.correct):not(.incorrect) {
  color: #7a00c9;
  border-color: #7a00c9;
}

/* line 12, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.purple.autocorrected:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .purple.correct.done:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .purple.autocorrected:not(.fraction):not(.mixed-fraction-input) {
  color: #7a00c9;
}

/* line 15, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .zearn-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .number-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .super-fill-in-widget .super-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .zearn-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .number-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .place-value-mat-widget .super-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .zearn-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .number-input .purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input.purple.focus:not(.fraction):not(.mixed-fraction-input), .sf-problems .super-input .purple.focus:not(.fraction):not(.mixed-fraction-input) {
  box-shadow: #7a00c9 0 0 0 2px inset;
  -webkit-appearance: none;
}

/* line 215, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.fraction-input, .super-fill-in-widget .number-input.fraction-input, .super-fill-in-widget .super-input.fraction-input, .place-value-mat-widget .zearn-input.fraction-input, .place-value-mat-widget .number-input.fraction-input, .place-value-mat-widget .super-input.fraction-input, .sf-problems .zearn-input.fraction-input, .sf-problems .number-input.fraction-input, .sf-problems .super-input.fraction-input {
  padding: 0px 5px;
}

/* line 218, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .super-fill-in-widget .number-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .super-fill-in-widget .super-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .place-value-mat-widget .zearn-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .place-value-mat-widget .number-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .place-value-mat-widget .super-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .sf-problems .zearn-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .sf-problems .number-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect), .sf-problems .super-input.fraction-input:not(.correct):not(.try-again):not(.correctable):not(.incorrect) {
  background-color: transparent;
}

/* line 222, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.fraction-input .zearn-input, .super-fill-in-widget .zearn-input.fraction-input .number-input, .super-fill-in-widget .number-input.fraction-input .zearn-input, .super-fill-in-widget .number-input.fraction-input .number-input, .super-fill-in-widget .super-input.fraction-input .zearn-input, .super-fill-in-widget .super-input.fraction-input .number-input, .place-value-mat-widget .zearn-input.fraction-input .zearn-input, .place-value-mat-widget .zearn-input.fraction-input .number-input, .place-value-mat-widget .number-input.fraction-input .zearn-input, .place-value-mat-widget .number-input.fraction-input .number-input, .place-value-mat-widget .super-input.fraction-input .zearn-input, .place-value-mat-widget .super-input.fraction-input .number-input, .sf-problems .zearn-input.fraction-input .zearn-input, .sf-problems .zearn-input.fraction-input .number-input, .sf-problems .number-input.fraction-input .zearn-input, .sf-problems .number-input.fraction-input .number-input, .sf-problems .super-input.fraction-input .zearn-input, .sf-problems .super-input.fraction-input .number-input {
  margin: 4px 0px;
}

/* line 229, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input, .super-fill-in-widget .number-input, .place-value-mat-widget .zearn-input, .place-value-mat-widget .number-input, .sf-problems .zearn-input, .sf-problems .number-input {
  border-color: #0097b6;
  color: black;
  font-size: 30px;
  min-width: 1em;
  width: 36px;
  height: 1.5em;
  text-align: center;
}

/* line 238, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input:disabled, .super-fill-in-widget .number-input:disabled, .place-value-mat-widget .zearn-input:disabled, .place-value-mat-widget .number-input:disabled, .sf-problems .zearn-input:disabled, .sf-problems .number-input:disabled {
  color: black;
  opacity: 1;
  pointer-events: none;
}

/* line 248, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.hidden, .super-fill-in-widget .number-input.hidden, .place-value-mat-widget .zearn-input.hidden, .place-value-mat-widget .number-input.hidden, .sf-problems .zearn-input.hidden, .sf-problems .number-input.hidden {
  opacity: 0;
}

/* line 252, app/assets/stylesheets/shared/general/zearn_input.scss */
.super-fill-in-widget .zearn-input.focus, .super-fill-in-widget .number-input.focus, .place-value-mat-widget .zearn-input.focus, .place-value-mat-widget .number-input.focus, .sf-problems .zearn-input.focus, .sf-problems .number-input.focus {
  box-shadow: #0097b6 0 0 0 2px inset;
  -webkit-appearance: none;
}

/* line 263, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .number-input, #multiply-manias .sf-problems .number-input {
  font-size: 20px;
  line-height: 26px;
  transition: opacity 200ms ease-in-out;
}

/* line 267, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .number-input, #sprint-fluencies .sf-problems .number-input.inactive, #multiply-manias .sf-problems .number-input, #multiply-manias .sf-problems .number-input.inactive {
  color: #646464;
  opacity: 1;
}

/* line 273, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .number-input.animate-width, #multiply-manias .sf-problems .number-input.animate-width {
  transition: opacity 200ms ease-in-out, width 200ms ease-in-out;
}

/* line 276, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .number-input.correct, #sprint-fluencies .sf-problems .number-input.correct.inactive, #sprint-fluencies .sf-problems .number-input.incorrect, #sprint-fluencies .sf-problems .number-input.incorrect.inactive, #sprint-fluencies .sf-problems .number-input.unanswered, #sprint-fluencies .sf-problems .number-input.unanswered.inactive, #multiply-manias .sf-problems .number-input.correct, #multiply-manias .sf-problems .number-input.correct.inactive, #multiply-manias .sf-problems .number-input.incorrect, #multiply-manias .sf-problems .number-input.incorrect.inactive, #multiply-manias .sf-problems .number-input.unanswered, #multiply-manias .sf-problems .number-input.unanswered.inactive {
  border-color: transparent;
  background-color: transparent;
  font-weight: 200;
}

/* line 287, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr.active-row .zearn-input, #multiply-manias .sf-problems tr.active-row .zearn-input {
  font-size: 28px;
  line-height: 36px;
}

/* line 291, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr.active-row .zearn-input.incorrect, #sprint-fluencies .sf-problems tr.active-row .zearn-input.incorrect.inactive, #multiply-manias .sf-problems tr.active-row .zearn-input.incorrect, #multiply-manias .sf-problems tr.active-row .zearn-input.incorrect.inactive {
  color: #f75e00;
  font-weight: bold;
}

/* line 295, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr.active-row .zearn-input.correct, #sprint-fluencies .sf-problems tr.active-row .zearn-input.correct.inactive, #multiply-manias .sf-problems tr.active-row .zearn-input.correct, #multiply-manias .sf-problems tr.active-row .zearn-input.correct.inactive {
  color: black;
  font-weight: bold;
}

/* line 301, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr.active-row .super-input:not(.zearn-input), #multiply-manias .sf-problems tr.active-row .super-input:not(.zearn-input) {
  background-color: transparent;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 305, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr.active-row .super-input:not(.zearn-input) .zearn-input:not(.correct):not(.incorrect), #multiply-manias .sf-problems tr.active-row .super-input:not(.zearn-input) .zearn-input:not(.correct):not(.incorrect) {
  background-color: white;
}

/* line 312, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr:not(.active-row) .zearn-input, #sprint-fluencies .sf-problems tr:not(.active-row) .super-input, #multiply-manias .sf-problems tr:not(.active-row) .zearn-input, #multiply-manias .sf-problems tr:not(.active-row) .super-input {
  background-color: transparent;
  border-width: 0px;
}

/* line 317, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems tr:not(.active-row) .zearn-input.super-input, #multiply-manias .sf-problems tr:not(.active-row) .zearn-input.super-input {
  border-radius: 0px;
  border-style: solid;
  border-width: 0px 0px 2px 0px;
  border-color: #646464;
}

/* line 328, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .correct-problem .number-input.inactive, #multiply-manias .sf-problems .correct-problem .number-input.inactive {
  font-size: 30px;
  font-weight: 600;
  vertical-align: middle;
}

/* line 335, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .correct-problem .super-input, #multiply-manias .sf-problems .correct-problem .super-input {
  background-color: transparent;
}

/* line 338, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems .correct-problem .super-input .number-input, #multiply-manias .sf-problems .correct-problem .super-input .number-input {
  border: 0px;
}

/* line 345, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems.smaller-text .correct-problem, #sprint-fluencies .sf-problems.smaller-text .correct-problem .number-input.inactive, #multiply-manias .sf-problems.smaller-text .correct-problem, #multiply-manias .sf-problems.smaller-text .correct-problem .number-input.inactive {
  font-size: 20px;
}

/* line 350, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems.smaller-text .sf-problems-table tr, #sprint-fluencies .sf-problems.smaller-text .sf-problems-table .number-input, #multiply-manias .sf-problems.smaller-text .sf-problems-table tr, #multiply-manias .sf-problems.smaller-text .sf-problems-table .number-input {
  font-size: 16px;
}

/* line 354, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems.smaller-text .sf-problems-table .sf-correctness-cell, #multiply-manias .sf-problems.smaller-text .sf-problems-table .sf-correctness-cell {
  width: 40%;
}

/* line 358, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems.smaller-text .sf-problems-table .active-row, #multiply-manias .sf-problems.smaller-text .sf-problems-table .active-row {
  font-size: 18px;
}

/* line 360, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-problems.smaller-text .sf-problems-table .active-row .number-input, #multiply-manias .sf-problems.smaller-text .sf-problems-table .active-row .number-input {
  font-size: 18px;
  line-height: 22px;
}

/* line 375, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies.blast .sf-problems .sf-row.active-row .zearn-input.incorrect, #sprint-fluencies.blast .sf-problems .sf-row.active-row .zearn-input.incorrect:disabled, #multiply-manias.blast .sf-problems .sf-row.active-row .zearn-input.incorrect, #multiply-manias.blast .sf-problems .sf-row.active-row .zearn-input.incorrect:disabled {
  color: #ffb04d;
}

/* line 381, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies.blast .sf-problems .sf-row:not(.active-row) .zearn-input, #sprint-fluencies.blast .sf-problems .sf-row:not(.active-row) .super-input, #multiply-manias.blast .sf-problems .sf-row:not(.active-row) .zearn-input, #multiply-manias.blast .sf-problems .sf-row:not(.active-row) .super-input {
  color: rgba(255, 255, 255, 0.5);
}

/* line 385, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies.blast .sf-problems .sf-row:not(.active-row) .zearn-input.super-input, #multiply-manias.blast .sf-problems .sf-row:not(.active-row) .zearn-input.super-input {
  border-color: rgba(255, 255, 255, 0.5);
}

/* line 394, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-mc-problems .sf-row .number-input.inactive, #multiply-manias .sf-mc-problems .sf-row .number-input.inactive {
  border-radius: 0px;
  border-style: solid;
  border-width: 2px 0px 2px 0px;
  border-bottom-color: #646464;
  border-top-color: transparent;
  background-color: transparent;
  color: black;
}

/* line 408, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input), #multiply-manias .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input) {
  background-color: transparent;
  border: 0px;
}

/* line 412, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input) .zearn-input, #sprint-fluencies .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input) .zearn-input:not(.correct):not(.incorrect), #multiply-manias .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input) .zearn-input, #multiply-manias .sf-fraction-mc-problems tr.sf-row .super-input:not(.zearn-input) .zearn-input:not(.correct):not(.incorrect) {
  height: 32px;
  width: 32px;
  min-width: 32px;
  font-size: 18px;
  line-height: 26px;
  border-color: transparent;
  margin: 0px;
  background-color: transparent;
}

/* line 425, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-fraction-mc-problems .correct-popup .fraction, #sprint-fluencies .sf-fraction-mc-problems .incorrect-popup .fraction, #multiply-manias .sf-fraction-mc-problems .correct-popup .fraction, #multiply-manias .sf-fraction-mc-problems .incorrect-popup .fraction {
  background-color: transparent;
  font-size: 24px;
}

/* line 429, app/assets/stylesheets/shared/general/zearn_input.scss */
#sprint-fluencies .sf-fraction-mc-problems .correct-popup .fraction .number-input, #sprint-fluencies .sf-fraction-mc-problems .incorrect-popup .fraction .number-input, #multiply-manias .sf-fraction-mc-problems .correct-popup .fraction .number-input, #multiply-manias .sf-fraction-mc-problems .incorrect-popup .fraction .number-input {
  font-size: 24px;
  border: 0px;
  margin: 0px;
}

/* line 443, app/assets/stylesheets/shared/general/zearn_input.scss */
#multiply-manias .sf-problems .number-input {
  font-size: 24px;
}

/* line 448, app/assets/stylesheets/shared/general/zearn_input.scss */
#multiply-manias .sf-problems tr.active-row .number-input {
  font-size: 34px;
  height: 44px;
}
/* line 3, app/assets/stylesheets/shared/modal.scss */
.modal.hide {
  z-index: -1;
  display: none;
}

/* line 4, app/assets/stylesheets/shared/modal.scss */
.modal.hide.in {
  z-index: 16500;
}

/* line 5, app/assets/stylesheets/shared/modal.scss */
div.modal-backdrop {
  z-index: 16040;
}

/* line 6, app/assets/stylesheets/shared/modal.scss */
div.modal {
  z-index: 16050;
}

/* line 8, app/assets/stylesheets/shared/modal.scss */
.modal .close {
  float: right;
  position: relative;
  top: -25px;
  left: 30px;
  z-index: 1;
  background: url("//webassets.zearn.org/assets/btn_landing_close.png") no-repeat center;
  width: 60px;
  height: 60px;
  border: none;
  cursor: pointer;
}

/* line 22, app/assets/stylesheets/shared/modal.scss */
.modals-content {
  display: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed #top-space {
  height: 46px;
  margin-bottom: 8px;
}

@media only screen and (device-width: 768px) {
  /* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
  .feed #top-space {
    /* For iPad */
    height: 0px;
  }
}

/* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar {
  position: fixed;
  width: 100%;
  height: 46px;
  background-color: #fff;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
  z-index: 16000;
  -webkit-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -moz-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -ms-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -o-box-shadow: 1px 5px 6px -1px #b3b3b3;
  box-shadow: 1px 5px 6px -1px #b3b3b3;
}

@media only screen and (device-width: 768px) {
  /* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
  .feed .navbar {
    /* For iPad */
    position: relative;
  }
}

/* line 31, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar .back {
  display: inline-block;
  height: 46px;
}

/* line 35, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar .back .zearn-logo, .feed .navbar .back .zearn-home {
  display: inline-block;
  position: relative;
  top: -2px;
}

/* line 42, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar .actions {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 2;
  font-size: 0;
}

/* line 50, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar a {
  height: 46px;
  display: inline-block;
  margin-left: 8px;
}

/* line 55, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar a:hover .btn, .feed .navbar a:active .btn {
  border: 2px solid #005c73;
  color: #005c73;
}

/* line 59, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar a:hover .btn.signout-btn, .feed .navbar a:hover .btn.action-btn, .feed .navbar a:active .btn.signout-btn, .feed .navbar a:active .btn.action-btn {
  color: white;
  background-color: #005c73;
}

/* line 67, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar .btn {
  display: inline-block;
  height: 29px;
  line-height: 25px;
  border: 1px solid #007b94;
  color: #007b94;
  min-width: 104px;
  text-align: center;
  border-radius: 15px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  position: relative;
  top: -2px;
}

/* line 82, app/assets/stylesheets/shared/guided_practice_nav.scss */
.feed .navbar .btn.signout-btn, .feed .navbar .btn.action-btn {
  background-color: #007b94;
  color: #fff;
}

/* line 15, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed {
  line-height: 46px;
}

/* line 9, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back-links {
  position: absolute;
  width: 136px;
  height: 46px;
  left: 1px;
  top: 0px;
  z-index: 3;
}

/* line 18, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back {
  width: 64px;
  height: 100%;
  padding: 0 14px;
  margin: 0;
}

/* line 24, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back:not(:last-of-type) {
  border-right: 1px solid #cccccc;
}

/* line 28, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back .zearn-logo {
  width: 36px;
  height: 36px;
  background-image: url("//webassets.zearn.org/app_assets/general/logos/zearn-icon.svg");
  background-size: 32px 32px;
  background-repeat: no-repeat;
  vertical-align: middle;
}

/* line 37, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back .zearn-home {
  width: 36px;
  height: 36px;
  background-image: url("//webassets.zearn.org/app_assets/general/logos/zearn-home-icons2.svg");
  background-size: cover;
  vertical-align: middle;
  background-position: left;
}

/* line 47, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back:hover .zearn-home {
  background-position: center;
}

/* line 53, app/assets/stylesheets/shared/_back_nav.scss */
.feed .navbar-feed .back:active .zearn-home {
  background-position: right;
}

/* line 18, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .title {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  white-space: nowrap;
  text-align: center;
  color: #444;
  font-weight: 700;
  font-size: 14px;
  z-index: 1;
}

/* line 30, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .title .content {
  margin: 0 10px;
}

/* line 34, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .title .activity-icon {
  display: inline-block;
  vertical-align: middle;
  margin-top: -5px;
}

/* line 40, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .title .activity {
  font-weight: 300;
  font-size: 24px;
  padding-right: 12px;
}

/* line 47, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .actions {
  right: 10px;
}

/* line 50, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .actions .btn .icon-uni-nav-notes {
  display: inline-block;
  vertical-align: middle;
  width: 13px;
  height: 18px;
  margin-right: 2px;
  background-image: url("//webassets.zearn.org/app_assets/general/icons/icon-notes.svg");
  background-position: 0 0;
  background-size: 26px 18px;
  position: relative;
  top: -2px;
}

/* line 64, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed .actions .admin-delete-btn {
  background-color: red;
  padding: 0px 12px;
  color: white;
  text-transform: uppercase;
}

/* line 72, app/assets/stylesheets/shared/navbar_feed.scss */
.feed .navbar-feed a {
  line-height: 46px;
}

/* line 79, app/assets/stylesheets/shared/navbar_feed.scss */
.feed.video_guided_practices .navbar .title .title-wrap {
  max-width: 490px;
}
/* line 11, app/assets/stylesheets/shared/popup.scss */
i.popup-link {
  cursor: pointer;
  position: relative;
  color: #999999;
}

/* line 16, app/assets/stylesheets/shared/popup.scss */
i.popup-link:hover {
  color: #303b40;
}

/* line 23, app/assets/stylesheets/shared/popup.scss */
.v-tooltip {
  box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.2);
}

/* line 28, app/assets/stylesheets/shared/popup.scss */
.shared-qtip {
  min-width: 250px;
  background-color: white;
  border: 0 solid white;
  box-shadow: 2px 2px 8px 2px rgba(0, 0, 0, 0.2);
}

/* line 36, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .qtip-tip {
  border-color: white;
  background-color: white;
}

/* line 41, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .qtip-content {
  border-radius: 4px;
  padding: 16px;
  font-size: 11px;
  text-align: center;
  overflow: visible;
}

/* line 49, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .popup-container {
  display: table;
  width: 100%;
}

/* line 53, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .popup-container .popup-container-inner {
  display: table-cell;
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .popup-container .loading-message {
  text-align: center;
  font-size: 20px;
}

/* line 65, app/assets/stylesheets/shared/popup.scss */
.shared-qtip.info-popup {
  border-radius: 3px;
}

/* line 68, app/assets/stylesheets/shared/popup.scss */
.shared-qtip.info-popup p {
  line-height: 16px;
  font-size: 12px;
  color: #303b40;
  margin: 0;
  text-align: left;
}

/* line 80, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .custom-shadow-tip {
  position: absolute;
  width: 15px;
  height: 15px;
  background-color: white;
  -webkit-box-shadow: 3px 3px 4px 0px rgba(67, 82, 89, 0.15);
  -moz-box-shadow: 3px 3px 4px 0px rgba(67, 82, 89, 0.15);
  -ms-box-shadow: 3px 3px 4px 0px rgba(67, 82, 89, 0.15);
  -o-box-shadow: 3px 3px 4px 0px rgba(67, 82, 89, 0.15);
  box-shadow: 3px 3px 4px 0px rgba(67, 82, 89, 0.15);
}

/* line 88, app/assets/stylesheets/shared/popup.scss */
.shared-qtip .custom-shadow-tip.bottom-tip {
  transform: rotate(45deg);
  bottom: -7px;
  left: 50%;
  margin-left: -7.5px;
}

/* line 99, app/assets/stylesheets/shared/popup.scss */
.blue-top {
  border-top: 5px solid #0097b6;
  border-radius: 4px;
}

/* line 103, app/assets/stylesheets/shared/popup.scss */
.blue-top .qtip-content {
  padding: 10px;
}

/* line 107, app/assets/stylesheets/shared/popup.scss */
.blue-top .qtip-tip {
  background-color: #0097b6;
  border-color: #0097b6;
}
/* line 5, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p {
  display: block;
}

/* line 8, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p .login-3p-img {
  display: block;
  height: 50px;
  width: 233px;
  font-size: 0;
  border: 1px solid #cccccc;
  border-radius: 4px;
  background-size: contain;
  background-position: center center;
}

/* line 19, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p.login-with-clever .login-3p-img {
  background-image: url("//webassets.zearn.org/app_assets/sign_in/login_3p_clever_normal.png"), url("//webassets.zearn.org/app_assets/sign_in/login_3p_clever_hover.png");
}

/* line 22, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p.login-with-clever .login-3p-img:hover {
  background-image: url("//webassets.zearn.org/app_assets/sign_in/login_3p_clever_hover.png");
}

/* line 27, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p.login-with-google .login-3p-img {
  background-image: url("//webassets.zearn.org/app_assets/sign_in/login_3p_google_normal.png"), url("//webassets.zearn.org/app_assets/sign_in/login_3p_google_hover.png");
}

/* line 30, app/assets/stylesheets/shared/sign_in.scss */
a.login-3p.login-with-google .login-3p-img:hover {
  background-image: url("//webassets.zearn.org/app_assets/sign_in/login_3p_google_hover.png");
}

/* line 36, app/assets/stylesheets/shared/sign_in.scss */
.buttons-3p {
  margin-bottom: 20px;
  position: absolute;
  bottom: 0;
  left: calc(50% - 175px);
  width: 350px;
}

/* line 43, app/assets/stylesheets/shared/sign_in.scss */
.buttons-3p hr {
  margin-bottom: 30px;
}

/* line 47, app/assets/stylesheets/shared/sign_in.scss */
.buttons-3p .login-3p {
  margin: 10px auto;
}

/* line 49, app/assets/stylesheets/shared/sign_in.scss */
.buttons-3p .login-3p .login-3p-img {
  margin: 0 auto;
}

/* line 55, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area {
  text-align: center;
}

/* line 58, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area .credentials {
  margin: 0 auto;
  width: 300px;
  max-width: 80vw;
}

/* line 64, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area input {
  height: 42px;
  width: 100%;
  font-size: 18px;
  padding: 0 10px;
  margin-top: 5px;
  text-align: left;
  border-radius: 4px;
}

/* line 73, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area input:first-child {
  margin-top: 0;
}

/* line 76, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area input:not([type='submit']) {
  border: 1px solid #b3b3b3;
}

/* line 81, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area .buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 20px 0;
}

/* line 88, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area .buttons button.btn {
  display: block;
  text-align: center;
  width: 300px;
  max-width: 100%;
  height: 50px;
  margin: 0;
}

/* line 97, app/assets/stylesheets/shared/sign_in.scss */
div.sign-in-area .buttons a.btn-sized-link {
  display: block;
  height: 50px;
  line-height: 50px;
  margin-top: 5px;
}

/* line 105, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper {
  margin-top: auto;
  margin-bottom: auto;
  padding: 10px;
}

/* line 109, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box {
  width: 400px;
  height: 570px;
  background-color: #ffffff;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  padding: 0 25px;
  overflow: hidden;
  text-align: center;
  position: relative;
}

/* line 119, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .logo {
  display: block;
  width: 152px;
  height: 74px;
  margin: 0 auto;
}

/* line 126, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .flash-wrapper {
  width: 300px;
  min-height: 52px;
  margin: 5px auto;
  display: flex;
  align-items: center;
}

/* line 133, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .flash-wrapper .flash-message {
  margin: 2px auto;
  padding: 0;
  font-size: 16px;
}

/* line 138, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .flash-wrapper .flash-message a.link {
  font-size: 16px;
}

/* line 144, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .btn {
  text-align: center;
  width: 100%;
}

/* line 148, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .btn.login-with-clever {
  margin-top: 10px;
}

/* line 153, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .link {
  display: inline-block;
}

/* line 158, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .credentials input {
  height: 42px;
  width: 100%;
  font-size: 18px;
  padding: 0 10px;
  border: 1px solid #b3b3b3;
  color: #303b40;
  margin-top: 5px;
  text-align: left;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
}

/* line 76, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input:focus::-moz-placeholder {
  color: transparent;
}

/* line 77, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input::-moz-placeholder {
  color: #b3b3b3;
  opacity: 1;
}

/* line 81, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input:-ms-input-placeholder {
  color: #b3b3b3 !important;
}

/* line 82, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input:focus:-ms-placeholder {
  color: transparent;
}

/* line 83, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input::-webkit-input-placeholder {
  color: #b3b3b3;
}

/* line 84, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input:focus::-webkit-input-placeholder {
  color: transparent;
}

/* line 86, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input::placeholder {
  color: #b3b3b3;
}

/* line 87, app/assets/stylesheets/shared/_deprecated_prefix_mixins.scss */
.sign-in-wrapper .sign-in-box .credentials input:focus::placeholder {
  color: transparent;
}

/* line 171, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box .credentials input:first-child {
  margin-top: 0;
}

/* line 177, app/assets/stylesheets/shared/sign_in.scss */
.sign-in-wrapper .sign-in-box hr {
  border: none;
  border-bottom: 1px solid #d0d2d3;
}
/* line 22, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/activity/activity_sprite_2017_11_30.svg");
  background-repeat: no-repeat;
  display: inline-block;
  vertical-align: middle;
  background-size: 500px 500px;
  width: 30px;
  height: 30px;
}

/* line 32, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon.activity-icon-lg {
  background-size: 1000px 1000px;
  width: 60px;
  height: 60px;
}

/* line 37, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon.activity-icon-sm {
  background-size: 250px 250px;
  width: 15px;
  height: 15px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab {
  background-position: -5px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab.activity-icon-lg {
  background-position: -10px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab.activity-icon-sm {
  background-position: -2.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab-wh {
  background-position: -40px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab-wh.activity-icon-lg {
  background-position: -80px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-learning_lab-wh.activity-icon-sm {
  background-position: -20px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency {
  background-position: -75px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency.activity-icon-lg {
  background-position: -150px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency.activity-icon-sm {
  background-position: -37.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency-wh {
  background-position: -110px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency-wh.activity-icon-lg {
  background-position: -220px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-sprint_fluency-wh.activity-icon-sm {
  background-position: -55px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad {
  background-position: -145px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad.activity-icon-lg {
  background-position: -290px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad.activity-icon-sm {
  background-position: -72.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad-wh {
  background-position: -180px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad-wh.activity-icon-lg {
  background-position: -360px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-z_squad-wh.activity-icon-sm {
  background-position: -90px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat {
  background-position: -215px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat.activity-icon-lg {
  background-position: -430px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat.activity-icon-sm {
  background-position: -107.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat-wh {
  background-position: -250px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat-wh.activity-icon-lg {
  background-position: -500px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-math_chat-wh.activity-icon-sm {
  background-position: -125px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus {
  background-position: -285px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus.activity-icon-lg {
  background-position: -570px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus.activity-icon-sm {
  background-position: -142.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus-wh {
  background-position: -320px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus-wh.activity-icon-lg {
  background-position: -640px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bonus-wh.activity-icon-sm {
  background-position: -160px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower {
  background-position: -355px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower.activity-icon-lg {
  background-position: -710px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower.activity-icon-sm {
  background-position: -177.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower-wh {
  background-position: -390px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower-wh.activity-icon-lg {
  background-position: -780px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-tower-wh.activity-icon-sm {
  background-position: -195px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania {
  background-position: -425px -5px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania.activity-icon-lg {
  background-position: -850px -10px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania.activity-icon-sm {
  background-position: -212.5px -2.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania-wh {
  background-position: -460px -5px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania-wh.activity-icon-lg {
  background-position: -920px -10px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-multiply_mania-wh.activity-icon-sm {
  background-position: -230px -2.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare {
  background-position: -5px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare.activity-icon-lg {
  background-position: -10px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare.activity-icon-sm {
  background-position: -2.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare-wh {
  background-position: -40px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare-wh.activity-icon-lg {
  background-position: -80px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-pair-compare-wh.activity-icon-sm {
  background-position: -20px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb {
  background-position: -75px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb.activity-icon-lg {
  background-position: -150px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb.activity-icon-sm {
  background-position: -37.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb-wh {
  background-position: -110px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb-wh.activity-icon-lg {
  background-position: -220px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bulb-wh.activity-icon-sm {
  background-position: -55px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb {
  background-position: -75px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb.activity-icon-lg {
  background-position: -150px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb.activity-icon-sm {
  background-position: -37.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb-wh {
  background-position: -110px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb-wh.activity-icon-lg {
  background-position: -220px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-light_bulb-wh.activity-icon-sm {
  background-position: -55px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times {
  background-position: -75px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times.activity-icon-lg {
  background-position: -150px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times.activity-icon-sm {
  background-position: -37.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times-wh {
  background-position: -110px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times-wh.activity-icon-lg {
  background-position: -220px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-totally-times-wh.activity-icon-sm {
  background-position: -55px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match {
  background-position: -145px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match.activity-icon-lg {
  background-position: -290px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match.activity-icon-sm {
  background-position: -72.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match-wh {
  background-position: -180px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match-wh.activity-icon-lg {
  background-position: -360px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-mix-and-match-wh.activity-icon-sm {
  background-position: -90px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action {
  background-position: -215px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action.activity-icon-lg {
  background-position: -430px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action.activity-icon-sm {
  background-position: -107.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action-wh {
  background-position: -250px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action-wh.activity-icon-lg {
  background-position: -500px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-fraction-action-wh.activity-icon-sm {
  background-position: -125px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey {
  background-position: -285px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey.activity-icon-lg {
  background-position: -570px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey.activity-icon-sm {
  background-position: -142.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey-wh {
  background-position: -320px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey-wh.activity-icon-lg {
  background-position: -640px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-survey-wh.activity-icon-sm {
  background-position: -160px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician {
  background-position: -355px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician.activity-icon-lg {
  background-position: -710px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician.activity-icon-sm {
  background-position: -177.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-wh {
  background-position: -390px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-wh.activity-icon-lg {
  background-position: -780px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-wh.activity-icon-sm {
  background-position: -195px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns {
  background-position: -425px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns.activity-icon-lg {
  background-position: -850px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns.activity-icon-sm {
  background-position: -212.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns-wh {
  background-position: -460px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns-wh.activity-icon-lg {
  background-position: -920px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-magician-returns-wh.activity-icon-sm {
  background-position: -230px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns {
  background-position: -425px -40px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns.activity-icon-lg {
  background-position: -850px -80px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns.activity-icon-sm {
  background-position: -212.5px -20px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns-wh {
  background-position: -460px -40px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns-wh.activity-icon-lg {
  background-position: -920px -80px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-addition-magician-returns-wh.activity-icon-sm {
  background-position: -230px -20px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten {
  background-position: -5px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten.activity-icon-lg {
  background-position: -10px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten.activity-icon-sm {
  background-position: -2.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-wh {
  background-position: -40px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-wh.activity-icon-lg {
  background-position: -80px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-wh.activity-icon-sm {
  background-position: -20px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction {
  background-position: -5px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction.activity-icon-lg {
  background-position: -10px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction.activity-icon-sm {
  background-position: -2.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction-wh {
  background-position: -40px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction-wh.activity-icon-lg {
  background-position: -80px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-ns-take-from-ten-subtraction-wh.activity-icon-sm {
  background-position: -20px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break {
  background-position: -75px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break.activity-icon-lg {
  background-position: -150px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break.activity-icon-sm {
  background-position: -37.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break-wh {
  background-position: -110px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break-wh.activity-icon-lg {
  background-position: -220px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-make-and-break-wh.activity-icon-sm {
  background-position: -55px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top {
  background-position: -145px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top.activity-icon-lg {
  background-position: -290px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top.activity-icon-sm {
  background-position: -72.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top-wh {
  background-position: -180px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top-wh.activity-icon-lg {
  background-position: -360px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-next-stop-top-wh.activity-icon-sm {
  background-position: -90px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash {
  background-position: -215px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash.activity-icon-lg {
  background-position: -430px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash.activity-icon-sm {
  background-position: -107.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash-wh {
  background-position: -250px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash-wh.activity-icon-lg {
  background-position: -500px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-bond-dash-wh.activity-icon-sm {
  background-position: -125px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time {
  background-position: -285px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time.activity-icon-lg {
  background-position: -570px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time.activity-icon-sm {
  background-position: -142.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time-wh {
  background-position: -320px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time-wh.activity-icon-lg {
  background-position: -640px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-story_time-wh.activity-icon-sm {
  background-position: -160px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form {
  background-position: -355px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form.activity-icon-lg {
  background-position: -710px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form.activity-icon-sm {
  background-position: -177.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form-wh {
  background-position: -390px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form-wh.activity-icon-lg {
  background-position: -780px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-form-2-form-wh.activity-icon-sm {
  background-position: -195px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting {
  background-position: -425px -75px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting.activity-icon-lg {
  background-position: -850px -150px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting.activity-icon-sm {
  background-position: -212.5px -37.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-wh {
  background-position: -460px -75px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-wh.activity-icon-lg {
  background-position: -920px -150px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-wh.activity-icon-sm {
  background-position: -230px -37.5px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river {
  background-position: -5px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river.activity-icon-lg {
  background-position: -10px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river.activity-icon-sm {
  background-position: -2.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river-wh {
  background-position: -40px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river-wh.activity-icon-lg {
  background-position: -80px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-frog-river-wh.activity-icon-sm {
  background-position: -20px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast {
  background-position: -75px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast.activity-icon-lg {
  background-position: -150px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast.activity-icon-sm {
  background-position: -37.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast-wh {
  background-position: -110px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast-wh.activity-icon-lg {
  background-position: -220px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-blast-wh.activity-icon-sm {
  background-position: -55px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym {
  background-position: -145px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym.activity-icon-lg {
  background-position: -290px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym.activity-icon-sm {
  background-position: -72.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym-wh {
  background-position: -180px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym-wh.activity-icon-lg {
  background-position: -360px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-number-gym-wh.activity-icon-sm {
  background-position: -90px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out {
  background-position: -215px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out.activity-icon-lg {
  background-position: -430px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out.activity-icon-sm {
  background-position: -107.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out-wh {
  background-position: -250px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out-wh.activity-icon-lg {
  background-position: -500px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-counting-out-wh.activity-icon-sm {
  background-position: -125px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling {
  background-position: -285px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling.activity-icon-lg {
  background-position: -570px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling.activity-icon-sm {
  background-position: -142.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling-wh {
  background-position: -320px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling-wh.activity-icon-lg {
  background-position: -640px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-bundling-wh.activity-icon-sm {
  background-position: -160px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon {
  background-position: -355px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon.activity-icon-lg {
  background-position: -710px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon.activity-icon-sm {
  background-position: -177.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon-wh {
  background-position: -390px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon-wh.activity-icon-lg {
  background-position: -780px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-discovery_canyon-wh.activity-icon-sm {
  background-position: -195px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting {
  background-position: -425px -110px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting.activity-icon-lg {
  background-position: -850px -220px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting.activity-icon-sm {
  background-position: -212.5px -55px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting-wh {
  background-position: -460px -110px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting-wh.activity-icon-lg {
  background-position: -920px -220px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-skip-counting-wh.activity-icon-sm {
  background-position: -230px -55px;
}

/* line 57, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value {
  background-position: -5px -145px;
}

/* line 59, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value.activity-icon-lg {
  background-position: -10px -290px;
}

/* line 62, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value.activity-icon-sm {
  background-position: -2.5px -72.5px;
}

/* line 66, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value-wh {
  background-position: -40px -145px;
}

/* line 68, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value-wh.activity-icon-lg {
  background-position: -80px -290px;
}

/* line 71, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-icon-compare-by-place-value-wh.activity-icon-sm {
  background-position: -20px -72.5px;
}

/* line 80, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-final-sp {
  background-image: url("//webassets.zearn.org/app_assets/general/activity-final-screen-sp.png");
  background-repeat: no-repeat;
  display: inline-block;
  line-height: 0;
}

/* line 87, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-final-sp-bg-cat {
  width: 135px;
  height: 148px;
  background-position: 0 0;
}

/* line 93, app/assets/stylesheets/shared/sprites/activity.scss */
.activity-final-sp-bg-owl {
  width: 171px;
  height: 164px;
  background-position: -135px 0;
}
/* line 6, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/feed-uni-nav-sp-v2.png");
  background-repeat: no-repeat;
  display: inline-block;
  line-height: 0;
}

/* line 13, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-lg-left {
  width: 27px;
  height: 25px;
  background-position: 0 0;
}

/* line 19, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-micro-right {
  width: 9px;
  height: 8px;
  background-position: -27px 0;
}

/* line 25, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-sm-up,
.icon-uni-nav-arrow-blue-sm-right,
.icon-uni-nav-arrow-blue-sm-down,
.icon-uni-nav-arrow-blue-sm-left {
  width: 13px;
  height: 14px;
  background-position: -27px -8px;
}

/* line 33, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-sm-right {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* line 36, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-sm-down {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

/* line 39, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-blue-sm-left {
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

/* line 43, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-arrow-green-md-down {
  width: 22px;
  height: 23px;
  background-position: -40px 0;
}

/* line 49, app/assets/stylesheets/shared/sprites/universal_nav.scss */
.icon-uni-nav-notes {
  width: 16px;
  height: 17px;
  background-position: -27px -23px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes hideFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes hideFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes hideFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes hideFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 12, app/assets/stylesheets/shared/task_groups.scss */
.task-group {
  min-height: 520px;
  padding-top: 1px;
  position: relative;
}

/* line 19, app/assets/stylesheets/shared/task_groups.scss */
.task-group .task-group-header {
  position: relative;
}

/* line 21, app/assets/stylesheets/shared/task_groups.scss */
.task-group .task-group-header .dialog-arrow {
  position: absolute;
  left: -12px;
  top: 50%;
  height: 0;
  width: 0;
  margin-top: -12px;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  border-right: 12px solid #fad232;
}

/* line 32, app/assets/stylesheets/shared/task_groups.scss */
.task-group .task-group-header .dialog-character {
  position: absolute;
  left: -80px;
  top: 50%;
  margin-top: -29.1375px;
  width: 63.375px;
  height: 58.275px;
}

/* line 44, app/assets/stylesheets/shared/task_groups.scss */
.task-group-header .dialog-arrow, .task-group-header .dialog-character {
  display: none;
}

/* line 51, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  display: none;
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 1024px;
  pointer-events: none;
}

/* line 60, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.fade-in {
  -webkit-animation: hideFadeIn 200ms ease-in-out;
  -moz-animation: hideFadeIn 200ms ease-in-out;
  -ms-animation: hideFadeIn 200ms ease-in-out;
  -o-animation: hideFadeIn 200ms ease-in-out;
  animation: hideFadeIn 200ms ease-in-out;
}

/* line 65, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback .task-group-feedback-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/task_group/tg_feedback_sprites.png");
  background-size: 219px 60px;
  background-position: 0px 0px;
  height: 60px;
  margin-right: 10px;
}

/* line 71, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback .task-group-feedback-message {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 30px;
  font-weight: 300;
}

/* line 77, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.correct, .task-group-feedback.incorrect, .task-group-feedback.try-again, .task-group-feedback.correctable, .task-group-feedback.pre-ghost-autocorrect {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 82, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.incorrect .task-group-feedback-message, .task-group-feedback.try-again .task-group-feedback-message, .task-group-feedback.correctable .task-group-feedback-message, .task-group-feedback.pre-ghost-autocorrect .task-group-feedback-message {
  color: #cc1f50;
}

/* line 88, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.correct .task-group-feedback-icon {
  width: 44px;
  background-position: 0px 0px;
}

/* line 92, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.correct .task-group-feedback-message {
  color: #006644;
}

/* line 98, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.incorrect .task-group-feedback-icon {
  width: 9px;
  background-position: -131px 0px;
}

/* line 105, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.try-again .task-group-feedback-icon {
  width: 36px;
  background-position: -60px 0px;
}

/* line 112, app/assets/stylesheets/shared/task_groups.scss */
.task-group-feedback.correctable .task-group-feedback-icon, .task-group-feedback.pre-ghost-autocorrect .task-group-feedback-icon {
  width: 36px;
  background-position: -173px 0px;
}

/* line 120, app/assets/stylesheets/shared/task_groups.scss */
#tower-of-power .task-group {
  background-color: #ffffff;
  border: none;
  margin-bottom: 35px;
  opacity: 0.4;
  -webkit-transition: opacity, 500ms, linear;
  -moz-transition: opacity, 500ms, linear;
  -ms-transition: opacity, 500ms, linear;
  -o-transition: opacity, 500ms, linear;
  transition: opacity, 500ms, linear;
  transition-delay: 1s;
}

/* line 127, app/assets/stylesheets/shared/task_groups.scss */
#tower-of-power .task-group:last-of-type {
  opacity: 1;
}

/* line 133, app/assets/stylesheets/shared/task_groups.scss */
#tower-of-power.remediation .task-group {
  -webkit-transition: all 2000ms;
  -moz-transition: all 2000ms;
  -ms-transition: all 2000ms;
  -o-transition: all 2000ms;
  transition: all 2000ms;
}

/* line 7, app/assets/stylesheets/shared_vue_component_mixins/tower_headers_mixin.scss */
#tower-of-power.remediation .task-group .task-group-header {
  font-size: 20px;
  margin: 20px 80px 20px 120px;
  width: 824px;
}

/* line 12, app/assets/stylesheets/shared_vue_component_mixins/tower_headers_mixin.scss */
#tower-of-power.remediation .task-group .task-group-header .header-inner {
  background: #fad232;
  padding: 10px;
  box-shadow: 2px 2px 0px #888;
}

/* line 16, app/assets/stylesheets/shared_vue_component_mixins/tower_headers_mixin.scss */
#tower-of-power.remediation .task-group .task-group-header .header-inner:empty {
  background: transparent;
  box-shadow: none;
}

/* line 21, app/assets/stylesheets/shared_vue_component_mixins/tower_headers_mixin.scss */
#tower-of-power.remediation .task-group .task-group-header .dialog-arrow, #tower-of-power.remediation .task-group .task-group-header .dialog-character {
  display: block;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/tasks.scss */
.tasks-page {
  background: white;
  font-size: 0px;
  text-align: center;
  position: relative;
  width: 1024px;
  padding-top: 10px;
  margin: 0px auto;
}

/* line 12, app/assets/stylesheets/shared/tasks.scss */
.tasks-page.ended {
  margin-bottom: 10px;
}

/* line 16, app/assets/stylesheets/shared/tasks.scss */
#tower-of-power .tasks-page {
  background: none;
}

/* line 21, app/assets/stylesheets/shared/tasks.scss */
.task-container {
  position: relative;
  min-height: 60px;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 16px;
  margin-left: 8px;
  margin-right: 8px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-1 {
  width: 64px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-2 {
  width: 144px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-3 {
  width: 224px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-4 {
  width: 304px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-5 {
  width: 384px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-6 {
  width: 464px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-7 {
  width: 544px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-8 {
  width: 624px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-9 {
  width: 704px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-10 {
  width: 784px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-11 {
  width: 864px;
}

/* line 30, app/assets/stylesheets/shared/tasks.scss */
.task-container.grid-12 {
  width: 944px;
}

/* line 35, app/assets/stylesheets/shared/tasks.scss */
.task-container.valign-top {
  vertical-align: top;
}

/* line 38, app/assets/stylesheets/shared/tasks.scss */
.task-container.valign-bottom {
  vertical-align: bottom;
}

/* line 42, app/assets/stylesheets/shared/tasks.scss */
.task-container.highlighted {
  background-color: rgba(250, 210, 50, 0.5);
}

/* line 47, app/assets/stylesheets/shared/tasks.scss */
.task-header, .task-group-header {
  margin: 5px;
  white-space: normal;
  text-align: left;
}

/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .task-header, body:not(.g6plus) .task-group-header {
  font-size: 22px;
  font-weight: 700;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .task-header, body.g6plus .task-group-header {
  font-size: 22px;
  font-weight: 600;
}

/* line 53, app/assets/stylesheets/shared/tasks.scss */
#tower-of-power .task-header, .checkpoints-taskable .task-header, .lab-sections .task-header, #tower-of-power .task-group-header, .checkpoints-taskable .task-group-header, .lab-sections .task-group-header {
  text-align: center;
}

/* line 58, app/assets/stylesheets/shared/tasks.scss */
.std-text {
  font-size: 20px;
}

/* line 62, app/assets/stylesheets/shared/tasks.scss */
.task {
  margin-top: 10px;
  margin-bottom: 10px;
}

/* line 67, app/assets/stylesheets/shared/tasks.scss */
#touch-keypad {
  display: none;
  margin-bottom: 5px;
}

/* line 71, app/assets/stylesheets/shared/tasks.scss */
#touch-keypad button {
  font-size: 0px;
  width: 70px;
  height: 60px;
  margin: 5px;
}

/* line 72, app/assets/stylesheets/shared/tasks.scss */
#touch-keypad button span {
  font-size: 30px;
}

/* line 80, app/assets/stylesheets/shared/tasks.scss */
#touch-keypad button.touch-keypad-delete-button {
  width: 75px;
}

/* line 86, app/assets/stylesheets/shared/tasks.scss */
.touched-input {
  transition: all 0.3s ease-in-out 0s;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -webkit-appearance: none;
  -webkit-box-shadow: 0px 0px 5px 2px #0497e7;
  -moz-box-shadow: 0px 0px 5px 2px #0497e7;
  -ms-box-shadow: 0px 0px 5px 2px #0497e7;
  -o-box-shadow: 0px 0px 5px 2px #0497e7;
  box-shadow: 0px 0px 5px 2px #0497e7;
}

/* line 96, app/assets/stylesheets/shared/tasks.scss */
.number-input {
  text-align: center;
  font-size: 24px;
}

/* line 104, app/assets/stylesheets/shared/tasks.scss */
.fraction {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  margin-left: 2px;
  margin-right: 2px;
}

/* line 110, app/assets/stylesheets/shared/tasks.scss */
.fraction .denominator {
  border-top: 2px solid;
  padding-left: 4px;
  padding-right: 4px;
}

/* line 116, app/assets/stylesheets/shared/tasks.scss */
.fraction.small {
  font-size: 0.67em;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/algorithm/algorithm_2016.scss */
.algorithm-2016-task .algo-row-answer {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 11, app/assets/stylesheets/shared/tasks/algorithm/algorithm_2016.scss */
.algorithm-2016-task .algo-operator-column.algo-answer-placeholder {
  width: 1.2em;
  margin-right: 7px;
}

/* line 16, app/assets/stylesheets/shared/tasks/algorithm/algorithm_2016.scss */
.algorithm-2016-task .super-reset-button {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
  vertical-align: top;
  font-size: inherit;
  height: 1.2em;
  width: 1.2em;
}

/* line 24, app/assets/stylesheets/shared/tasks/algorithm/algorithm_2016.scss */
.algorithm-2016-task .super-reset-button i {
  font-size: 0.6em;
}

/* line 30, app/assets/stylesheets/shared/tasks/algorithm/algorithm_2016.scss */
.algorithm-2016-task .super-fill-in-widget .super-input.try-again.correct {
  border-color: #aaaaaa;
  background: #ffffff;
}
@charset "UTF-8";
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 15, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 17, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-wrap {
  font-size: 0;
  margin-left: 24px;
}

/* line 21, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 24, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-row.has-bundle {
  margin: 13px 0;
}

/* line 28, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-row.highlight .multiplication-col:not(:empty) {
  background: #fde999;
}

/* line 31, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-row.highlight .multiplication-col:not(:empty) + .multiplication-gutter-col {
  height: 26px;
  background: #fde999;
}

/* line 37, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .units-factor, .multiplication-algorithm-2016-task:not(.vueified) .units-product {
  margin-left: 10px;
  font-size: 20px;
}

/* line 41, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-equals-row {
  margin: 5px 0;
}

/* line 44, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-answer-row {
  height: 30px;
}

/* line 47, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-bundle-row {
  height: 26px;
}

/* line 50, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-bundle-row .multiplication-col .token-text, .multiplication-algorithm-2016-task:not(.vueified) .multiplication-bundle-row .multiplication-col .number-input {
  font-size: 14px;
}

/* line 54, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-bundle-row.overlaps-equals {
  margin-top: -28px;
}

/* line 57, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-bundle-row.cross-out .multiplication-col:not(:empty)::before {
  content: '';
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2026%2031.2%27%20%3E%3Cline%20x1%3D%2790%25%27%20y1%3D%2710%25%27%20x2%3D%2710%25%27%20y2%3D%2790%25%27%20stroke%3D%27rgba(122%2C%200%2C%20201%2C%201.0)%27%20stroke-width%3D%272%27%2F%3E%3C%2Fsvg%3E") no-repeat center center;
}

/* line 68, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col {
  display: inline-block;
  position: relative;
  width: 20px;
}

/* line 72, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col .token-text, .multiplication-algorithm-2016-task:not(.vueified) .multiplication-col .number-input {
  font-size: 20px;
}

/* line 76, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-times-operator:empty, .multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-plus-operator:empty {
  height: 20px;
}

/* line 79, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-times-operator::before, .multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-plus-operator::before {
  position: absolute;
  left: -100%;
  font-size: 20px;
}

/* line 85, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-times-operator::before {
  content: '×';
}

/* line 88, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.has-plus-operator::before {
  content: '+';
}

/* line 91, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-col.highlight {
  background: #fde999;
}

/* line 95, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-gutter-col {
  display: inline-block;
  width: 4px;
  font-size: 20px;
}

/* line 100, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg {
  display: inline-block;
  height: 2px;
  vertical-align: top;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-1 {
  width: 26px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-2 {
  width: 50px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-3 {
  width: 74px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-4 {
  width: 98px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-5 {
  width: 122px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-6 {
  width: 146px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-7 {
  width: 170px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-8 {
  width: 194px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-9 {
  width: 218px;
}

/* line 105, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg.num-cols-10 {
  width: 242px;
}

/* line 109, app/assets/stylesheets/shared/tasks/algorithm/multiplication_2016.scss */
.multiplication-algorithm-2016-task:not(.vueified) .multiplication-line-svg line {
  stroke: black;
  stroke-width: 2;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 27, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .task {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 50px;
}

/* line 33, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 38, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat {
  background-color: #f3fdff;
  border: 2px solid #999999;
  border-radius: 12px;
  padding: 25px;
  position: relative;
}

/* line 46, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-controls.small {
  padding: 0 30px 30px 0;
}

/* line 49, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-controls.medium {
  padding: 0 40px 40px 0;
}

/* line 52, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-controls.large {
  padding: 0 50px 50px 0;
}

/* line 57, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold .scaffold-cell:not(.plotted):not(.hover) {
  background-color: #e4e4e4;
}

/* line 61, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .scaffold-cell {
  outline-color: transparent;
  border-style: dashed;
  border-width: 2px;
}

/* line 65, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .scaffold-cell.plotted, .area-plot .plot-mat.with-scaffold.hide-scaffold-units .scaffold-cell.hover {
  border-color: transparent;
}

/* line 69, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .plot-row:not(.scaffold-start) .scaffold-cell {
  border-top-width: 0;
}

/* line 72, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .plot-row:not(.scaffold-end) .scaffold-cell {
  border-bottom-width: 0;
}

/* line 75, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .scaffold-cell:not(.scaffold-start) {
  border-left-width: 0;
}

/* line 78, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold.hide-scaffold-units .scaffold-cell:not(.scaffold-end) {
  border-right-width: 0;
}

/* line 82, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold:not(.hide-scaffold-units) .scaffold-cell {
  border: none;
}

/* line 84, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.with-scaffold:not(.hide-scaffold-units) .scaffold-cell:not(.plotted):not(.hover) {
  outline-color: #999999;
  outline-style: dashed;
}

/* line 90, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.hide-grid .plot-cell:not(.scaffold-cell) {
  border-color: transparent;
}

/* line 93, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.correct {
  border-color: #00c372;
}

/* line 96, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.incorrect {
  border-color: #ff4d76;
}

/* line 99, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.try-again {
  background-color: #ffe3ee;
  cursor: pointer;
}

/* line 104, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.correct.final:not(.try-again), .area-plot .plot-mat.incorrect.final:not(.try-again) {
  background-color: white;
}

/* line 107, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.correct:not(.try-again):not(.final), .area-plot .plot-mat.incorrect:not(.try-again):not(.final) {
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  -ms-animation-duration: 1.5s;
  -o-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

/* line 111, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.correct:not(.try-again):not(.final) {
  -webkit-animation-name: whiteMatBackgroundFlashCorrect;
  -moz-animation-name: whiteMatBackgroundFlashCorrect;
  -ms-animation-name: whiteMatBackgroundFlashCorrect;
  -o-animation-name: whiteMatBackgroundFlashCorrect;
  animation-name: whiteMatBackgroundFlashCorrect;
}

/* line 114, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.incorrect:not(.try-again):not(.final) {
  -webkit-animation-name: whiteMatBackgroundFlashIncorrect;
  -moz-animation-name: whiteMatBackgroundFlashIncorrect;
  -ms-animation-name: whiteMatBackgroundFlashIncorrect;
  -o-animation-name: whiteMatBackgroundFlashIncorrect;
  animation-name: whiteMatBackgroundFlashIncorrect;
}

/* line 120, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-row {
  height: auto;
}

/* line 124, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-row:not(:last-child) .plot-cell {
  background-position: 50% calc(50% - $cellBorder);
}

/* line 127, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-row .plot-cell:not(:first-child) {
  background-position: calc(50% - $cellBorder) 50%;
}

/* line 132, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell {
  border: 1px solid #999999;
  outline: 2px solid transparent;
  outline-offset: -1px;
  background-color: transparent;
  position: relative;
}

/* line 140, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.plotted:not(.button-cell), .area-plot .plot-cell.hover:not(.button-cell) {
  z-index: 1;
}

/* line 142, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.plotted.purple:not(.button-cell), .area-plot .plot-cell.hover.purple:not(.button-cell) {
  background-color: #7029a5;
  outline-color: #f1d9ff;
}

/* line 146, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.plotted.blue:not(.button-cell), .area-plot .plot-cell.hover.blue:not(.button-cell) {
  background-color: #136fcb;
  outline-color: #65c6fd;
}

/* line 152, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.hover:not(.button-cell):not(.ui-draggable-dragging) {
  cursor: pointer;
  opacity: 0.5;
  background-repeat: no-repeat;
  background-size: 24px 24px;
  background-position: center;
}

/* line 158, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.hover:not(.button-cell):not(.ui-draggable-dragging):not(.plotted) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/area_plot/plus.svg");
}

/* line 161, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.hover.plotted:not(.button-cell):not(.ui-draggable-dragging) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/area_plot/minus.svg");
}

/* line 167, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.ui-draggable:not(.ui-draggable-disabled) {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -ms-grab;
  cursor: -o-grab;
  cursor: grab;
}

/* line 170, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-cell.ui-draggable.ui-draggable-dragging {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -ms-grabbing;
  cursor: -o-grabbing;
  cursor: grabbing;
  z-index: 2;
}

/* line 176, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.small .plot-cell, .area-plot .bank-tile.small {
  width: 30px;
  height: 30px;
}

/* line 14, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.small .plot-cell .plus-button, .area-plot .plot-mat.small .plot-cell .minus-button, .area-plot .bank-tile.small .plus-button, .area-plot .bank-tile.small .minus-button {
  width: 24px;
  height: 24px;
}

/* line 18, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.small .plot-cell .plus-button i, .area-plot .plot-mat.small .plot-cell .minus-button i, .area-plot .bank-tile.small .plus-button i, .area-plot .bank-tile.small .minus-button i {
  vertical-align: middle;
  font-size: 12px;
}

/* line 180, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.medium .plot-cell, .area-plot .bank-tile.medium {
  width: 40px;
  height: 40px;
}

/* line 14, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.medium .plot-cell .plus-button, .area-plot .plot-mat.medium .plot-cell .minus-button, .area-plot .bank-tile.medium .plus-button, .area-plot .bank-tile.medium .minus-button {
  width: 27px;
  height: 27px;
}

/* line 18, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.medium .plot-cell .plus-button i, .area-plot .plot-mat.medium .plot-cell .minus-button i, .area-plot .bank-tile.medium .plus-button i, .area-plot .bank-tile.medium .minus-button i {
  vertical-align: middle;
  font-size: 13.5px;
}

/* line 184, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.large .plot-cell, .area-plot .bank-tile.large {
  width: 50px;
  height: 50px;
}

/* line 14, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.large .plot-cell .plus-button, .area-plot .plot-mat.large .plot-cell .minus-button, .area-plot .bank-tile.large .plus-button, .area-plot .bank-tile.large .minus-button {
  width: 30px;
  height: 30px;
}

/* line 18, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.large .plot-cell .plus-button i, .area-plot .plot-mat.large .plot-cell .minus-button i, .area-plot .bank-tile.large .plus-button i, .area-plot .bank-tile.large .minus-button i {
  vertical-align: middle;
  font-size: 15px;
}

/* line 188, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-row:first-child .button-cell {
  border-right-width: 0;
}

/* line 192, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .button-cell {
  border-bottom-width: 0;
  border-top-width: 0;
  border-left-width: 0;
}

/* line 198, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plus-button, .area-plot .minus-button {
  display: none;
  position: relative;
  margin: auto;
}

/* line 204, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .minus-button {
  opacity: 0;
}

/* line 206, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .minus-button:hover {
  opacity: 1;
}

/* line 211, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .counter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 0px;
  right: 0px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 18px;
  background-color: #666666;
  color: white;
  border-radius: 8px;
  width: 35px;
}

/* line 225, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.small .counter {
  height: 25px;
  margin-top: 3px;
  margin-right: 3px;
}

/* line 231, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.medium .counter {
  height: 35px;
  margin-top: 5px;
  margin-right: 5px;
}

/* line 237, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .plot-mat.large .counter {
  height: 35px;
  margin-top: 10px;
  margin-right: 10px;
}

/* line 243, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank {
  margin: 20px;
}

/* line 246, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.infinite {
  position: relative;
  top: 20px;
  width: 75px;
  height: 75px;
}

/* line 252, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.infinite .bank-tile {
  position: absolute;
}

/* line 254, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.infinite .bank-tile:nth-child(2) {
  top: 6px;
  left: 6px;
}

/* line 258, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.infinite .bank-tile:nth-child(3) {
  top: 12px;
  left: 12px;
}

/* line 265, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.organized, .area-plot .tile-bank.scattered {
  margin-right: 50px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 273, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.organized.small .bank-row {
  height: 30px;
}

/* line 277, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.organized.medium .bank-row {
  height: 40px;
}

/* line 281, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.organized.large .bank-row {
  height: 50px;
}

/* line 286, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.organized .flex-row .bank-cell:not(:first-child) .flex-cell {
  border-left-width: 0;
}

/* line 291, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.scattered {
  width: 320px;
}

/* line 293, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.scattered .bank-cell {
  -webkit-flex-grow: 1;
  flex-grow: 1;
}

/* line 296, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.scattered .bank-cell .flex-cell {
  border: 0;
}

/* line 301, app/assets/stylesheets/shared/tasks/area_plot.scss */
.area-plot .tile-bank.scattered .bank-tile:not(.visible) {
  visibility: hidden;
}
/* line 2, app/assets/stylesheets/shared/tasks/bank_to_groups_2017.scss */
.bank-to-groups-2017 .groups-box-2017 {
  padding: 10px 0px 35px 0px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .number-line {
  width: 648px;
  margin: 100px 0 100px 0;
}

/* line 11, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .number-line .number-line-containment {
  width: 600px;
  height: 100%;
}

/* line 15, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .number-line .number-line-left-arrow {
  float: left;
}

/* line 18, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .number-line .number-line-right-arrow {
  float: right;
}

/* line 23, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .fnl-tick {
  position: absolute;
  width: 4px;
  height: 100%;
  border-radius: 4px;
  background: black;
  top: 0;
  margin-left: -2px;
}

/* line 32, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .fnl-tick .bfg-choice, .benchmark-fraction-game .fnl-tick .bfg-bm-label {
  left: -28px;
}

/* line 35, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .fnl-tick .bfg-bm-label {
  top: 100%;
  height: 60px;
}

/* line 39, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .fnl-tick .bfg-choice {
  top: 100%;
  top: calc(100% + 10px);
}

/* line 45, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice, .benchmark-fraction-game .bfg-bm-label {
  position: absolute;
  font-size: 20px;
  width: 60px;
}

/* line 50, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.mixed-frac .fnl-label:not(.no-frac) .fnl-whole, .benchmark-fraction-game .bfg-bm-label.mixed-frac .fnl-label:not(.no-frac) .fnl-whole {
  display: inline-block;
}

/* line 53, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.mixed-frac .fraction:not(.no-whole), .benchmark-fraction-game .bfg-bm-label.mixed-frac .fraction:not(.no-whole) {
  display: inline-block;
  font-size: 16px;
}

/* line 58, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice .fraction.no-whole, .benchmark-fraction-game .bfg-bm-label .fraction.no-whole {
  font-size: 18px;
  margin-top: 9px;
}

/* line 62, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice .fnl-whole, .benchmark-fraction-game .bfg-bm-label .fnl-whole {
  line-height: 60px;
}

/* line 66, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice {
  padding: 5px;
  height: 80px;
  border: 2px solid #00c6e4;
  border-radius: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 73, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.correct, .benchmark-fraction-game .bfg-choice.incorrect {
  cursor: default;
  color: white;
  border-width: 0;
  padding: 7px;
}

/* line 78, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.correct .fraction .denominator, .benchmark-fraction-game .bfg-choice.incorrect .fraction .denominator {
  border-color: white;
}

/* line 82, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.correct {
  background-color: #02d02d;
}

/* line 86, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.incorrect {
  background-color: #ff9e00;
}

/* line 89, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.incorrect.incorrect-2 {
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
  background-color: white;
  color: #8c8c8c;
}

/* line 93, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.incorrect.incorrect-2 .fraction .denominator {
  -webkit-transition: border-color, 500ms, linear;
  -moz-transition: border-color, 500ms, linear;
  -ms-transition: border-color, 500ms, linear;
  -o-transition: border-color, 500ms, linear;
  transition: border-color, 500ms, linear;
  border-color: #8c8c8c;
}

/* line 101, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie {
  margin-left: -30px;
  bottom: 100%;
  bottom: calc(100% + 8px);
}

/* line 105, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie .fnl-label {
  display: none;
}

/* line 108, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie .bfg-choice-quest {
  line-height: 60px;
  font-size: 40px;
  color: #00c6e4;
}

/* line 113, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie .bfg-choice-tick {
  border-left: 4px dotted transparent;
  height: 40px;
  width: 0;
  left: 50%;
  left: calc(50% - 2px);
  position: absolute;
  bottom: -50px;
}

/* line 124, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.correct .bfg-choice-quest, .benchmark-fraction-game .bfg-choice.indie.incorrect .bfg-choice-quest {
  display: none;
}

/* line 127, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.correct .fnl-label, .benchmark-fraction-game .bfg-choice.indie.incorrect .fnl-label {
  display: block;
}

/* line 131, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.correct .bfg-choice-tick {
  border-color: #02d02d;
}

/* line 135, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.incorrect .bfg-choice-tick {
  border-color: #ff9e00;
}

/* line 138, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.incorrect-2 .bfg-choice-tick {
  border-color: #8c8c8c;
}

/* line 144, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct {
  display: none;
}

/* line 146, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show {
  display: block;
  border-color: transparent;
}

/* line 149, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show .bfg-choice-tick {
  border-color: black;
}

/* line 153, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show .fnl-label {
  display: block;
}

/* line 158, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show.show-2 .fnl-label .fnl-whole {
  color: #8c8c8c;
}

/* line 161, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show.show-2 .fnl-label .fraction {
  color: #8c8c8c;
}

/* line 163, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show.show-2 .fnl-label .fraction .denominator {
  border-color: #8c8c8c;
}

/* line 167, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-choice.indie.bfg-real-correct.show.show-2 .bfg-choice-tick {
  border-color: #8c8c8c;
}

/* line 174, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback {
  height: 40px;
  margin: 15px 0;
  text-align: left;
}

/* line 179, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face {
  width: 40px;
  height: 40px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/benchmark_fraction_game/smiley.png");
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

/* line 187, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.happy {
  background-image: url("//webassets.zearn.org/app_assets/tasks/benchmark_fraction_game/smiley_purple.png");
}

/* line 191, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.sad {
  background-image: url("//webassets.zearn.org/app_assets/tasks/benchmark_fraction_game/smiley_sad.png");
}

/* line 195, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face .bfg-face-owl {
  position: absolute;
  height: 58px;
  width: 44px;
  top: -10px;
  left: -4px;
  display: none;
}

/* line 205, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.correct .bfg-face-owl, .benchmark-fraction-game .bfg-feedback .bfg-face.incorrect .bfg-face-owl {
  display: block;
}

/* line 211, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.correct-big .bfg-face-owl, .benchmark-fraction-game .bfg-feedback .bfg-face.incorrect-2 .bfg-face-owl {
  height: 73px;
  width: 58px;
  top: -18px;
  left: -8px;
}

/* line 219, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.correct-big .bfg-face-owl {
  -webkit-transition: all 200ms;
  -moz-transition: all 200ms;
  -ms-transition: all 200ms;
  -o-transition: all 200ms;
  transition: all 200ms;
}

/* line 226, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face.incorrect-2 .bfg-face-owl {
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
}

/* line 232, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face-line {
  width: 20px;
  height: 4px;
  background: #8c8c8c;
  display: inline-block;
  vertical-align: middle;
}

/* line 238, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game .bfg-feedback .bfg-face-line.happy {
  background: #d100b7;
}

/* line 246, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game.active-task .bfg-choice:not(.incorrect):not(.correct) {
  cursor: pointer;
}

/* line 248, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game.active-task .bfg-choice:not(.incorrect):not(.correct):hover {
  border-width: 4px;
  padding: 3px;
}

/* line 252, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game.active-task .bfg-choice.indie:not(.incorrect):not(.correct):hover .bfg-choice-tick {
  border-color: #00c6e4;
}

/* line 256, app/assets/stylesheets/shared/tasks/benchmark_fraction_game.scss */
.benchmark-fraction-game.active-task .bfg-choice:not(.incorrect):not(.correct):active {
  background-color: #bceff7;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 17, app/assets/stylesheets/shared/tasks/clock.scss */
.clock {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 20, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-button {
  margin: 5px;
  background-color: #007b94;
  color: white;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

/* line 130, app/assets/stylesheets/shared/_student_variables.scss */
.clock .clock-button.disabled, .clock .clock-button:disabled {
  pointer-events: none;
  cursor: default;
  background-color: #cfdee6;
}

/* line 136, app/assets/stylesheets/shared/_student_variables.scss */
.clock .clock-button.hover:not(.disabled), .clock .clock-button:not(.disabled):hover {
  background-color: #005c73;
}

/* line 137, app/assets/stylesheets/shared/_student_variables.scss */
.clock .clock-button.active:not(.disabled), .clock .clock-button:not(.disabled):active {
  background-color: #003e4d;
}

/* line 26, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-controls {
  margin: 20px auto 0 auto;
}

/* line 29, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-controls .clock-hour-buttons, .clock .clock-controls .clock-minute-buttons {
  display: block;
}

/* line 33, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-controls .clock-h, .clock .clock-controls .clock-m {
  display: inline;
  font-size: 18px;
  font-weight: bold;
  color: #4d4d4d;
  vertical-align: bottom;
  line-height: 48px;
}

/* line 42, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-controls .clock-m {
  margin: 0 5px;
}

/* line 46, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-controls .clock-h {
  margin: 0 16px;
}

/* line 51, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-box {
  position: relative;
  margin: auto;
  width: 300px;
  height: 300px;
  border-radius: 150px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/clock/Clock_Sprite_2017.svg");
  background-repeat: no-repeat;
  background-position: -8px -8px;
}

/* line 63, app/assets/stylesheets/shared/tasks/clock.scss */
.clock.alternate-color .clock-hour-hand, .clock.alternate-color .clock-hour-hand.final-neutral {
  background-position: -49px -339px;
}

/* line 68, app/assets/stylesheets/shared/tasks/clock.scss */
.clock.alternate-color .clock-minute-hand, .clock.alternate-color .clock-minute-hand.final-neutral {
  background-position: -329px -299px;
}

/* line 74, app/assets/stylesheets/shared/tasks/clock.scss */
.clock.alternate-color .clock-controls .clock-h {
  color: #7029a5;
}

/* line 77, app/assets/stylesheets/shared/tasks/clock.scss */
.clock.alternate-color .clock-controls .clock-m {
  color: #f75e00;
}

/* line 83, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand, .clock .clock-minute-hand, .clock .clock-circle {
  position: absolute;
}

/* line 86, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand {
  background-image: url("//webassets.zearn.org/app_assets/tasks/clock/Clock_Sprite_2017.svg");
  background-repeat: no-repeat;
  background-position: -19px -339px;
  width: 18px;
  height: 82px;
  bottom: 150px;
  left: 141px;
  -webkit-transform-origin: 9px 82px;
  -moz-transform-origin: 9px 82px;
  -ms-transform-origin: 9px 82px;
  -o-transform-origin: 9px 82px;
  transform-origin: 9px 82px;
}

/* line 98, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.correct {
  background-position: -229px -339px;
}

/* line 101, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.incorrect {
  background-position: -199px -339px;
}

/* line 104, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.try-again {
  background-position: -169px -339px;
}

/* line 107, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.neutral {
  background-position: -139px -339px;
}

/* line 110, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.final-neutral {
  background-position: -109px -339px;
}

/* line 113, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-hour-hand.inactive {
  background-position: -79px -339px;
}

/* line 118, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand {
  background-image: url("//webassets.zearn.org/app_assets/tasks/clock/Clock_Sprite_2017.svg");
  background-repeat: no-repeat;
  background-position: -299px -299px;
  width: 18px;
  height: 120px;
  bottom: 150px;
  left: 141px;
  -webkit-transform-origin: 9px 120px;
  -moz-transform-origin: 9px 120px;
  -ms-transform-origin: 9px 120px;
  -o-transform-origin: 9px 120px;
  transform-origin: 9px 120px;
}

/* line 130, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.correct {
  background-position: -509px -299px;
}

/* line 133, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.incorrect {
  background-position: -479px -299px;
}

/* line 136, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.try-again {
  background-position: -449px -299px;
}

/* line 139, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.neutral {
  background-position: -419px -299px;
}

/* line 142, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.final-neutral {
  background-position: -389px -299px;
}

/* line 145, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-minute-hand.inactive {
  background-position: -359px -299px;
}

/* line 150, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-circle {
  position: absolute;
  width: 28px;
  height: 28px;
  top: 136px;
  left: 136px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/clock/Clock_Sprite_2017.svg");
  background-repeat: no-repeat;
  background-position: -144px -144px;
}

/* line 165, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-box.correctable:not(.autocorrect) {
  cursor: pointer;
}

/* line 168, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-box.correctable .clock-circle::after {
  content: '?';
  width: 39px;
  height: 39px;
  background: #ff4d76;
  border-radius: 19.5px;
  position: absolute;
  left: -5.5px;
  top: -5.5px;
  font-size: 20px;
  color: white;
  line-height: 39px;
}

@-webkit-keyframes clockCircleAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes clockCircleAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes clockCircleAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes clockCircleAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

/* line 190, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-box.autocorrect .clock-circle::after {
  -webkit-animation: clockCircleAutocorrect 1500ms ease-in forwards;
  -moz-animation: clockCircleAutocorrect 1500ms ease-in forwards;
  -ms-animation: clockCircleAutocorrect 1500ms ease-in forwards;
  -o-animation: clockCircleAutocorrect 1500ms ease-in forwards;
  animation: clockCircleAutocorrect 1500ms ease-in forwards;
}

@-webkit-keyframes clockHandsAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes clockHandsAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes clockHandsAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes clockHandsAutocorrect {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 198, app/assets/stylesheets/shared/tasks/clock.scss */
.clock .clock-box.autocorrect .clock-minute-hand, .clock .clock-box.autocorrect .clock-hour-hand {
  -webkit-animation: clockHandsAutocorrect 1500ms ease-in forwards;
  -moz-animation: clockHandsAutocorrect 1500ms ease-in forwards;
  -ms-animation: clockHandsAutocorrect 1500ms ease-in forwards;
  -o-animation: clockHandsAutocorrect 1500ms ease-in forwards;
  animation: clockHandsAutocorrect 1500ms ease-in forwards;
}

/* line 207, app/assets/stylesheets/shared/tasks/clock.scss */
.active-task .clock-box.minute-controls .clock-minute-hand:not(.disabled) {
  cursor: pointer;
}

/* line 212, app/assets/stylesheets/shared/tasks/clock.scss */
.active-task .clock-box.hour-controls .clock-hour-hand:not(.disabled) {
  cursor: pointer;
}

/* line 218, app/assets/stylesheets/shared/tasks/clock.scss */
.active-task .clock-minute-up:not(.disabled), .active-task .clock-hour-up:not(.disabled), .active-task .clock-minute-down:not(.disabled), .active-task .clock-hour-down:not(.disabled), .active-task .clock-minute-up-5:not(.disabled), .active-task .clock-minute-down-5:not(.disabled) {
  cursor: pointer;
}
/* line 2, app/assets/stylesheets/shared/tasks/count_box_to_groups.scss */
.count-box-to-groups .count-box {
  border-radius: 16px 16px 0px 0px;
}

/* line 5, app/assets/stylesheets/shared/tasks/count_box_to_groups.scss */
.count-box-to-groups .groups-box {
  border-radius: 0px 0px 16px 16px;
  padding: 10px 0px 35px 0px;
}

/* line 8, app/assets/stylesheets/shared/tasks/count_box_to_groups.scss */
.count-box-to-groups .groups-box .gia-total-label {
  bottom: 10px;
  top: auto;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group button:not(:disabled), .decimal-tape-diagram .alignment-button:not(.disabled) {
  cursor: pointer;
}

/* line 13, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  margin-top: 20px;
  width: 100%;
  display: table;
  border-collapse: collapse;
}

/* line 20, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .controls-left, .decimal-tape-diagram .controls-group .controls-center, .decimal-tape-diagram .controls-group .controls-right {
  display: table-cell;
  vertical-align: top;
}

/* line 24, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .controls-left {
  width: 50%;
  text-align: right;
}

/* line 28, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .controls-right {
  width: 50%;
  text-align: left;
}

/* line 33, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .directional-button, .decimal-tape-diagram .controls-group .split-button {
  display: inline-block;
  padding: 0;
  margin: 0 4px;
  width: 53px;
  height: 53px;
  background-color: transparent;
}

/* line 40, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .directional-button::-moz-focus-inner, .decimal-tape-diagram .controls-group .split-button::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/* line 46, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .directional-button:last-child, .decimal-tape-diagram .controls-group .split-button:last-child {
  margin-bottom: 0;
}

/* line 50, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .split-clear-icon {
  display: inline-block;
}

/* line 54, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container {
  border: 2px dotted #bdbec0;
  border-radius: 10px;
  -moz-margin-start: 2px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  display: inline-block;
  margin: 2px 4px 0 4px;
  padding: 0 4px;
  height: 50px;
  min-width: 53px;
  vertical-align: top;
  font-size: 0px;
  white-space: nowrap;
}

/* line 68, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-decimal {
  padding: 5px 2px;
  color: #0f9ed9;
  display: inline-block;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 20px;
}

/* line 75, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-whole, .decimal-tape-diagram .controls-group .total-container .total-unit {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
  padding: 5px 2px;
  color: #0f9ed9;
  font-size: 20px;
}

/* line 82, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-unit {
  color: black;
  vertical-align: top;
}

/* line 86, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-fraction {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
  font-size: 16px;
  padding-left: 4px;
  padding-right: 4px;
}

/* line 92, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-fraction .total-numerator {
  padding-top: 2px;
  color: #0f9ed9;
}

/* line 96, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container .total-fraction .total-denominator {
  padding-bottom: 2px;
  color: black;
  border-top: 2px solid black;
  min-width: 32px;
}

/* line 105, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container.disabled .total-whole, .decimal-tape-diagram .controls-group .total-container.disabled .total-unit, .decimal-tape-diagram .controls-group .total-container.disabled .total-numerator, .decimal-tape-diagram .controls-group .total-container.disabled .total-decimal {
  color: #8c8c8c;
}

/* line 108, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .controls-group .total-container.disabled .total-denominator {
  border-top: 2px solid #8c8c8c;
}

/* line 115, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  display: inline-block;
  width: 800px;
}

/* line 120, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box.has-marker {
  margin-bottom: 60px;
}

/* line 124, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .bracket-top {
  margin-bottom: 10px;
}

/* line 128, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container {
  position: relative;
  background-color: #f7f8f8;
  border-top: solid 2px #6d6e70;
  border-bottom: solid 2px #6d6e70;
}

/* line 134, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .vertical-split {
  display: inline-block;
  border-right-color: #6d6e70;
  border-right-style: solid;
  border-right-width: 0;
  height: 80px;
  width: 8px;
}

/* line 141, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .vertical-split.first {
  border-left: solid 2px #6d6e70;
}

/* line 144, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .vertical-split.hundredths {
  border-right-width: 1px;
}

/* line 147, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .vertical-split.tenths {
  border-right-width: 2px;
}

/* line 150, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .vertical-split.shaded {
  background-color: #0f9ed9;
}

/* line 155, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .marker {
  position: absolute;
  height: 100%;
}

/* line 159, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .marker .marker-middle {
  position: absolute;
  height: 100%;
  top: -80px;
  left: -1px;
  width: 3px;
  background-color: #0f9ed9;
  opacity: 0.5;
}

/* line 169, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .marker .arrow-down-button {
  position: absolute;
  left: -20px;
  top: -100px;
}

/* line 175, app/assets/stylesheets/shared/tasks/decimal_tape_diagram.scss */
.decimal-tape-diagram .line-box .lines-container .marker .arrow-up-drag-button {
  position: absolute;
  left: -20px;
  top: 2px;
}
/* line 2, app/assets/stylesheets/shared/tasks/dynamic_matching.scss */
.dynamic-matching .horizontal-matching-widget {
  font-size: 24px;
}

/* line 6, app/assets/stylesheets/shared/tasks/dynamic_matching.scss */
.dynamic-matching .horizontal-matching-widget .fraction {
  font-size: 24px;
}

/* line 11, app/assets/stylesheets/shared/tasks/dynamic_matching.scss */
.dynamic-matching .horizontal-matching-widget .match-set-handle {
  color: white;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 8, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition *:focus {
  outline: none;
}

/* line 12, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .task {
  text-align: left;
}

/* line 16, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition:not(.grid-12) .operational-buttons {
  min-width: 106px;
}

/* line 20, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .zearn-button {
  display: block;
}

/* line 23, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model {
  display: inline-block;
  vertical-align: middle;
}

/* line 28, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model {
  position: relative;
  min-height: 100px;
  margin: 60px 0 60px 20px;
}

/* line 33, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model.default-height {
  height: 100px;
}

/* line 38, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model-bg {
  width: 604px;
  border: 4px solid #6d6e70;
  height: 100%;
  margin-left: -2px;
}

/* line 44, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model-bg.light-color {
  border-color: white;
}

/* line 48, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-area-model-bg.with-img {
  border-width: 0;
  margin-left: 0;
  width: auto;
}

/* line 55, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-line-box {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

/* line 63, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-marker {
  position: absolute;
  height: 100%;
}

/* line 67, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-marker .e2p-marker-middle {
  position: absolute;
  height: 100%;
  top: 1px;
  left: -1px;
  width: 3px;
  background-color: #6d6e70;
  opacity: 0.5;
}

/* line 76, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-marker .e2p-marker-middle.light-color {
  background-color: white;
}

/* line 81, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-marker .arrow-down-button {
  position: absolute;
  left: -20px;
  top: -19px;
}

/* line 87, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-marker .arrow-up-drag-button {
  position: absolute;
  bottom: -63px;
  left: -20px;
}

/* line 94, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-hint-line, .estimate-to-partition .e2p-split-line {
  position: absolute;
  height: 100%;
  border-width: 0 0 0 5px;
  margin-left: -2px;
  border-color: #6d6e70;
}

/* line 101, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-hint-line.light-color, .estimate-to-partition .e2p-split-line.light-color {
  border-color: white;
}

/* line 106, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-hint-line {
  border-style: dashed;
}

/* line 110, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition .e2p-split-line {
  border-style: solid;
}

/* line 115, app/assets/stylesheets/shared/tasks/estimate_to_partition.scss */
.estimate-to-partition.active-task .arrow-up-drag-button, .estimate-to-partition.active-task .arrow-down-button, .estimate-to-partition.active-task .operational-buttons button:not(:disabled) {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 7, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .horizontal-matching-widget .match-area {
  margin-top: 25px;
  margin-left: auto;
  margin-right: auto;
}

/* line 13, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .horizontal-matching-widget .match-area .match-set-item-container {
  width: 164px;
}

/* line 18, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .horizontal-matching-widget .match-area .match-set-item-container .match-set-handle {
  font-size: 25px;
  color: white;
}

/* line 32, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-whole-tick .fnl-whole-label.extra-bottom {
  bottom: -22px;
}

/* line 38, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick {
  width: 55px;
  height: 62px;
  left: -26px;
  border-radius: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
}

/* line 45, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.bottom {
  margin-top: 5px;
}

/* line 48, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.selected {
  color: white;
  background-color: #f0852e;
}

/* line 52, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.selected .fraction .denominator {
  border-color: white;
}

/* line 57, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.correct {
  color: white;
  background-color: #3aad48;
}

/* line 61, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.correct .fraction .denominator {
  border-color: white;
}

/* line 67, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick .fraction .numerator {
  padding-bottom: 5px;
}

/* line 70, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick .fraction .denominator {
  padding-top: 5px;
}

/* line 74, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick .fnl-whole {
  padding-top: 5px;
  padding-bottom: 5px;
}

/* line 79, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.no-frac {
  height: 39px;
  font-size: 18px;
}

/* line 82, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .fraction-number-line-widget .number-line .fnl-label.tick.no-frac .fnl-whole {
  line-height: 18px;
}

/* line 92, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .task.with-top-spacer .fraction-number-line-widget .number-line {
  margin-top: 70px;
}

/* line 97, app/assets/stylesheets/shared/tasks/fraction_matching.scss */
.fraction-matching .task.with-bottom-spacer .fraction-number-line-widget .number-line {
  margin-bottom: 70px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 12, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-whole-tick .fnl-whole-label.extra-bottom {
  bottom: -22px;
}

/* line 18, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick {
  width: 39px;
  height: 65px;
  left: -18px;
  border: 2px solid #0c91cc;
  border-radius: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
}

/* line 26, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick.bottom {
  margin-top: 5px;
}

/* line 29, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick.selected {
  color: white;
  background-color: #0c91cc;
}

/* line 33, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick.selected .fraction .denominator {
  border-color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick .fraction .numerator {
  padding-bottom: 5px;
}

/* line 42, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick .fraction .denominator {
  padding-top: 5px;
}

/* line 46, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals .fraction-number-line-widget .number-line .fnl-label.tick .fnl-whole {
  padding-top: 5px;
  padding-bottom: 5px;
}

/* line 57, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
.fraction-number-line-equals.active-task .fraction-number-line-widget .fnl-label.tick:not(.immutable) {
  cursor: pointer;
}

/* line 64, app/assets/stylesheets/shared/tasks/fraction_number_line_equals.scss */
body .fraction-number-line-equals .task.with-bottom-spacer .fraction-number-line-widget .number-line {
  margin-bottom: 100px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes blink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #0c9900;
  }
  100% {
    box-shadow: none;
  }
}

@-moz-keyframes blink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #0c9900;
  }
  100% {
    box-shadow: none;
  }
}

@-o-keyframes blink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #0c9900;
  }
  100% {
    box-shadow: none;
  }
}

@keyframes blink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #0c9900;
  }
  100% {
    box-shadow: none;
  }
}

@-webkit-keyframes orangeBlink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #f77e2d;
  }
  100% {
    box-shadow: none;
  }
}

@-moz-keyframes orangeBlink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #f77e2d;
  }
  100% {
    box-shadow: none;
  }
}

@-o-keyframes orangeBlink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #f77e2d;
  }
  100% {
    box-shadow: none;
  }
}

@keyframes orangeBlink {
  0% {
    box-shadow: none;
  }
  50% {
    box-shadow: 0 0 8px 4px #f77e2d;
  }
  100% {
    box-shadow: none;
  }
}

/* line 19, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  overflow: hidden;
}

/* line 23, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-lobby, .fraction-strips .fstrips-whole-box {
  display: inline-block;
  vertical-align: middle;
}

/* line 27, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-lobby {
  width: 400px;
  margin: 0 10px 0 20px;
}

/* line 31, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-whole-box {
  width: 380px;
  margin: 0 20px 0 10px;
}

/* line 36, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip, .fraction-strips .fstrips-slot {
  height: 96px;
  display: inline-block;
  vertical-align: top;
}

/* line 42, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-slot {
  margin: 12px 4px;
}

/* line 46, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip {
  border: 0px solid transparent;
  padding: 4px;
  box-shadow: -2px 2px 0px 1px;
  font-size: 28px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 52, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip.ui-draggable-dragging {
  z-index: 5;
}

/* line 56, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip.small {
  font-size: 12px;
}

/* line 59, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip.extra-small {
  font-size: 8px;
}

/* line 63, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip .fraction {
  color: white;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 68, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip .fraction .denominator {
  border-color: white;
}

/* line 73, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-strip.active {
  box-shadow: none;
  border-width: 4px;
  padding: 0px;
}

/* line 81, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box {
  position: relative;
  border: 2px solid #354359;
  background: #f3fdff;
  height: 100px;
  text-align: left;
  -webkit-white-space: nowrap;
  -moz-white-space: nowrap;
  -ms-white-space: nowrap;
  -o-white-space: nowrap;
  white-space: nowrap;
}

/* line 88, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box:not(:last-child) {
  margin-bottom: 40px;
}

/* line 92, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box .fstrips-strip {
  text-align: center;
}

/* line 94, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box .fstrips-strip:not(.dragging) {
  box-shadow: none;
}

/* line 97, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box .fstrips-strip:not(.active) {
  border-width: 0 2px 0 0;
}

/* line 102, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box.full.full-animate {
  -webkit-animation: blink 1.5s linear;
  -moz-animation: blink 1.5s linear;
  -ms-animation: blink 1.5s linear;
  -o-animation: blink 1.5s linear;
  animation: blink 1.5s linear;
}

/* line 107, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box.full .fstrips-strip:last-child:not(.active) {
  border-width: 0;
  padding-right: 6px;
}

/* line 114, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box.incorrect {
  border-color: #f77e2d;
  -webkit-animation: orangeBlink 1.2s linear;
  -moz-animation: orangeBlink 1.2s linear;
  -ms-animation: orangeBlink 1.2s linear;
  -o-animation: orangeBlink 1.2s linear;
  animation: orangeBlink 1.2s linear;
}

/* line 119, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box.active {
  box-shadow: inset 0px 0px 9px 4px #0097b6;
  background: #d7fcff;
}

/* line 124, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box .fstrips-box-ghost {
  position: absolute;
  top: 0;
  height: 100%;
  opacity: 0.7;
}

/* line 132, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box-label {
  font-size: 28px;
  margin-bottom: 2px;
  color: #354359;
}

/* line 136, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box-label:not(:first-child) {
  margin-top: 40px;
}

/* line 141, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips .fstrips-box-label .fraction {
  font-size: 16px;
}

/* line 147, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips.active-task .fstrips-active-strip, .fraction-strips.active-task .fstrips-box, .fraction-strips.active-task .fstrips-lobby {
  cursor: pointer;
}

/* line 149, app/assets/stylesheets/shared/tasks/fraction_strips.scss */
.fraction-strips.active-task .fstrips-active-strip .fstrips-static-strip, .fraction-strips.active-task .fstrips-box .fstrips-static-strip, .fraction-strips.active-task .fstrips-lobby .fstrips-static-strip {
  cursor: default;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 5, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 8, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box {
  border-radius: 0 0 16px 16px;
  padding: 10px 0 35px 0;
  background-color: transparent;
  position: relative;
  display: inline-block;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box.try-again .group .group-items {
  cursor: pointer;
}

/* line 21, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .gia-total-label {
  top: 10px;
  bottom: auto;
}

/* line 25, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .groups-box-groups {
  text-align: center;
  min-height: 0;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group {
  background-color: #f3fdff;
  border: 3px solid #808080;
  border-radius: 15px;
  min-height: 0;
  margin: auto;
  display: block;
}

/* line 36, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group.incorrect {
  border-color: #ff4d76;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group.incorrect-fill {
  background-color: #ffe3ee;
}

/* line 42, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group.correct {
  border-color: #00c372;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group.correct-fill {
  background-color: #ccffd9;
}

/* line 48, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .group-top-controls {
  display: none;
}

/* line 51, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .group-items {
  top: 0;
  border: none;
  background-color: transparent;
  cursor: auto;
}

/* line 57, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 63, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .group-items .group-item-slot .z-item {
  background-position: center;
  background-repeat: no-repeat;
}

/* line 69, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .group-top-controls {
  background-color: transparent;
}

/* line 72, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .gia-buttons {
  position: absolute;
  background-color: transparent;
  width: 100%;
  height: 65px;
  bottom: -70px;
}

/* line 78, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .gia-buttons .minus-button, .g1-composition .groups-box .group .gia-buttons .plus-button {
  margin-top: 8px;
}

/* line 81, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition .groups-box .group .gia-buttons .group-item-icon {
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 30px;
  height: 30px;
}

/* line 89, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition.black-dots .z-item {
  background-color: #000;
  border-radius: 50%;
}

/* line 96, app/assets/stylesheets/shared/tasks/g1/composition.scss */
.g1-composition.display-only .groups-box .group {
  background-color: white;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box {
  height: 136px;
}

/* line 8, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group {
  margin: auto;
  display: block;
  width: 474px;
  height: 66px;
}

/* line 13, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items {
  width: 474px;
  height: 66px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot {
  width: 46px;
  height: 46px;
  top: 10px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-0 {
  left: 7px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-1 {
  left: 53px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-2 {
  left: 99px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-3 {
  left: 145px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-4 {
  left: 191px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-5 {
  left: 237px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-6 {
  left: 283px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-7 {
  left: 329px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-8 {
  left: 375px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot.slot-9 {
  left: 421px;
}

/* line 27, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}

/* line 35, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 40px 40px;
  height: 40px;
  width: 40px;
}

/* line 46, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group {
  width: 494px;
}

/* line 48, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items {
  width: 494px;
}

/* line 50, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot {
  top: 10px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-0 {
  left: 7px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-1 {
  left: 53px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-2 {
  left: 99px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-3 {
  left: 145px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-4 {
  left: 191px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-5 {
  left: 257px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-6 {
  left: 303px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-7 {
  left: 349px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-8 {
  left: 395px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-9 {
  left: 441px;
}

/* line 72, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.add-disc-a-or-b .groups-box .group .gia-buttons .minus-button {
  margin-left: 45px;
}

/* line 75, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.add-disc-a-or-b .groups-box .group .gia-buttons .plus-button {
  margin-right: 45px;
}

/* line 84, app/assets/stylesheets/shared/tasks/g1/composition_strand.scss */
.g1-composition.g1-composition-strand.display-only .groups-box {
  height: 66px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 5, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box {
  height: 49px;
  padding: 0;
  margin: 10px 0 10px 0;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .groups-box-groups {
  width: 100%;
  text-align: center;
}

/* line 15, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box.try-again .groups-box-groups {
  cursor: pointer;
}

/* line 19, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .group {
  width: 347px;
  display: inline-block;
  height: 49px;
}

/* line 23, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .group:last-child {
  margin-left: 10px;
}

/* line 26, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .group .group-items {
  -webkit-transform: scale(0.73, 0.73);
  -moz-transform: scale(0.73, 0.73);
  -ms-transform: scale(0.73, 0.73);
  -o-transform: scale(0.73, 0.73);
  transform: scale(0.73, 0.73);
  -webkit-transform-origin: left;
  -moz-transform-origin: left;
  -ms-transform-origin: left;
  -o-transform-origin: left;
  transform-origin: left;
  height: 49px;
}

/* line 30, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .group .group-items .group-item-slot {
  top: 2px;
}

/* line 36, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .groups-box .gia-buttons {
  display: none;
}

/* line 42, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group {
  width: 361px;
}

/* line 44, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot {
  top: 0;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-5 {
  left: 252px;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-6 {
  left: 298px;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-7 {
  left: 344px;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-8 {
  left: 390px;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20.g1-composition-strand-subitized .groups-box .group .group-items .group-item-slot.slot-9 {
  left: 436px;
}

/* line 55, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .gia-buttons {
  width: auto;
  height: auto;
  position: relative;
}

/* line 59, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .gia-buttons .minus-button, .g1-composition.g1-composition-strand-20 .gia-buttons .plus-button {
  vertical-align: middle;
}

/* line 62, app/assets/stylesheets/shared/tasks/g1/composition_strand_20.scss */
.g1-composition.g1-composition-strand-20 .gia-buttons .group-item-icon {
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  width: 30px;
  height: 30px;
  display: inline-block;
  margin: 0 4px;
  vertical-align: middle;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 7, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box {
  height: 306px;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group {
  margin: auto;
  display: block;
  width: 98px;
  height: 236px;
}

/* line 14, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items {
  width: 98px;
  height: 236px;
}

/* line 17, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot {
  width: 46px;
  height: 46px;
}

/* line 21, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-0, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-1, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-2, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-3, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-4 {
  left: 2px;
}

/* line 25, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-5, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-6, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-7, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-8, .g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-9 {
  left: 48px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-0 {
  top: 2px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-5 {
  top: 186px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 48px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 140px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 94px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-7 {
  top: 94px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-3 {
  top: 140px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 48px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 186px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 2px;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}

/* line 47, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 40px 40px;
  height: 40px;
  width: 40px;
}

/* line 54, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid .groups-box .group .gia-buttons {
  left: -35px;
  width: 158px;
}

/* line 62, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box .group .gia-buttons {
  height: 140px;
  bottom: -140px;
}

/* line 69, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.grid-6 .groups-box .group {
  left: 0px;
}

/* line 76, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box {
  height: 168px;
}

/* line 78, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group {
  height: 98px;
  width: 236px;
}

/* line 81, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items {
  height: 98px;
  width: 236px;
}

/* line 85, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-0, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-1, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-2, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-3, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 2px;
}

/* line 89, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-5, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-6, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-7, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-8, .g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 48px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-0 {
  left: 2px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-5 {
  left: 2px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-1 {
  left: 48px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-6 {
  left: 48px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-2 {
  left: 94px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-7 {
  left: 94px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-3 {
  left: 140px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-8 {
  left: 140px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-4 {
  left: 186px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .group-items .group-item-slot.slot-9 {
  left: 186px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal .groups-box .group .gia-buttons {
  left: 35px;
}

/* line 111, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal.add-disc-a-or-b .groups-box {
  height: 168px;
}

/* line 113, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal.add-disc-a-or-b .groups-box .group {
  height: 98px;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal.add-disc-a-or-b .groups-box .group .gia-buttons {
  width: 396px;
  left: -62px;
}

/* line 118, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal.add-disc-a-or-b .groups-box .group .gia-buttons .plus-button {
  margin-right: 50px;
}

/* line 127, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.g1-composition-ten-grid-horizontal.display-only .groups-box {
  height: 98px;
}

/* line 134, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box {
  height: 356px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box .group .gia-buttons .zearn-button, .g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box .group .gia-buttons .super-text-button, .g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box .group .gia-buttons .super-forward-button, .g1-composition.g1-composition-ten-grid.add-disc-a-or-b .groups-box .group .gia-buttons .group-item-icon {
  margin-top: 10px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.display-only:not(.room-for-controls):not(.g1-composition-ten-grid-horizontal) .groups-box {
  height: 236px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.align-right {
  margin: auto;
  padding-right: 34px;
  text-align: right;
}

/* line 160, app/assets/stylesheets/shared/tasks/g1/composition_ten_grid.scss */
.g1-composition.g1-composition-ten-grid.align-left {
  margin: auto;
  padding-left: 34px;
  text-align: left;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 11, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 14, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box {
  height: 309px;
  padding-bottom: 0;
}

/* line 17, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group {
  width: 364px;
  height: 234px;
}

/* line 20, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items {
  width: 364px;
  height: 234px;
}

/* line 23, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot {
  width: 70px;
  height: 70px;
}

/* line 30, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-0 {
  top: 15px;
  left: 84px;
}

/* line 34, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 74px;
  left: 48px;
}

/* line 38, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 132px;
  left: 15px;
}

/* line 42, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-3 {
  top: 121px;
  left: 96px;
}

/* line 46, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 57px;
  left: 129px;
}

/* line 50, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-5 {
  top: 30px;
  left: 198px;
}

/* line 54, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 106px;
  left: 176px;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-7 {
  top: 149px;
  left: 225px;
}

/* line 62, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 79px;
  left: 247px;
}

/* line 66, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 31px;
  left: 279px;
}

/* line 71, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 13px;
  left: 13px;
  width: 50px;
  height: 50px;
  border-radius: 25px;
}

/* line 79, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 45px;
  height: 75px;
  width: 75px;
}

/* line 91, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.black-dots .groups-box .group .group-items {
  margin-top: 20px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.black-dots .groups-box .group .group-items .group-item-slot .z-item {
  height: 45px;
  width: 45px;
}

/* line 109, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.add-disc-a-or-b .groups-box .group .gia-buttons .minus-button {
  margin-left: 20px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.add-disc-a-or-b .groups-box .group .gia-buttons .plus-button {
  margin-right: 20px;
}

/* line 121, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.display-only .groups-box {
  height: 244px;
}

/* line 127, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box {
  height: 302.5px;
  padding-bottom: 0;
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group {
  width: 455px;
  height: 292.5px;
}

/* line 133, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot {
  width: 85px;
  height: 85px;
}

/* line 137, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot .z-item {
  width: 85px;
  height: 85px;
  background-size: 75px;
}

/* line 145, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-0 {
  top: 15px;
  left: 71px;
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 94px;
  left: r3px;
}

/* line 153, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 172px;
  left: 15px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-3 {
  top: 148px;
  left: 126px;
}

/* line 161, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 67px;
  left: 153px;
}

/* line 165, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-5 {
  top: 59px;
  left: 242px;
}

/* line 169, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 146px;
  left: 212px;
}

/* line 173, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-7 {
  top: 188px;
  left: 295px;
}

/* line 177, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 106px;
  left: 327px;
}

/* line 181, app/assets/stylesheets/shared/tasks/g1/composition_unstructured.scss */
.g1-composition.g1-composition-unstructured.extra-large.display-only .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 21px;
  left: 349px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/g1/../../tasks/g1/../../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box-groups {
  height: 66px;
  width: 500px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box {
  height: 116px;
}

/* line 24, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group {
  margin: 0 0 0 0;
  display: block;
  width: 500px;
  height: 66px;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items {
  width: 500px;
  height: 66px;
}

/* line 32, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot {
  width: 46px;
  height: 46px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-0 {
  top: 10px;
  left: 7px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 10px;
  left: 53px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 10px;
  left: 99px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-3 {
  top: 10px;
  left: 145px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 10px;
  left: 191px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-5 {
  top: 10px;
  left: 257px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 10px;
  left: 303px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-7 {
  top: 10px;
  left: 349px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 10px;
  left: 395px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 10px;
  left: 441px;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}

/* line 57, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 40px 40px;
  height: 40px;
  width: 40px;
}

/* line 64, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .groups-box .group .gia-buttons {
  width: 158px;
}

/* line 70, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard {
  position: relative;
  margin: auto;
  width: 500px;
  height: 66px;
  background-color: #c4d4d6;
  border: 3px solid #808080;
  border-radius: 15px;
}

/* line 79, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard.incorrect {
  border-color: #ff4d76;
}

/* line 82, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard.incorrect-fill {
  background-color: #ffe3ee;
}

/* line 85, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard.correct {
  border-color: #00c372;
}

/* line 88, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard.correct-fill {
  background-color: #ccffd9;
}

/* line 92, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slots {
  position: relative;
  height: 100%;
  display: inline-block;
  width: 494px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot {
  position: absolute;
  display: inline-block;
  width: 46px;
  height: 46px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-0 {
  top: 10px;
  left: 7px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-1 {
  top: 10px;
  left: 53px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-2 {
  top: 10px;
  left: 99px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-3 {
  top: 10px;
  left: 145px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-4 {
  top: 10px;
  left: 191px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-5 {
  top: 10px;
  left: 257px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-6 {
  top: 10px;
  left: 303px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-7 {
  top: 10px;
  left: 349px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-8 {
  top: 10px;
  left: 395px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-9 {
  top: 10px;
  left: 441px;
}

/* line 116, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot .z-item {
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: contain;
}

/* line 121, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot .z-item.prepops-graveyard {
  opacity: 0.5;
}

/* line 129, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .group-item-slot .z-item, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .graveyard-slot .z-item {
  z-index: 2;
}

/* line 131, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .group-item-slot .z-item.ui-draggable-dragging, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .graveyard-slot .z-item.ui-draggable-dragging {
  z-index: 3;
}

/* line 137, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .group-item-slot.pre-transition .z-item, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .group-item-slot.transition .z-item, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .graveyard-slot.pre-transition .z-item, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .graveyard-slot.transition .z-item {
  z-index: 3;
}

/* line 141, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .group-item-slot.transition .z-item, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .graveyard-slot.transition .z-item {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 146, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-hover, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-scaffold {
  position: absolute;
  z-index: 1;
  border-radius: 50%;
}

/* line 150, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-hover.hide, .g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-scaffold.hide {
  opacity: 0;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-hover {
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  opacity: 0.5;
  width: 40px;
  height: 40px;
  left: 0;
  top: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 40px 40px;
}

/* line 166, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-composition-strand-subitized.g1-decomposition-strand .ghost-scaffold {
  width: 40px;
  height: 40px;
  background-color: rgba(153, 153, 153, 0.4);
  opacity: 1;
  border: 3px dotted #999999;
}

/* line 18, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box-groups {
  height: 66px;
  width: 480px;
}

/* line 22, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box {
  height: 116px;
}

/* line 24, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group {
  margin: 0 0 0 0;
  display: block;
  width: 480px;
  height: 66px;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items {
  width: 480px;
  height: 66px;
}

/* line 32, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot {
  width: 46px;
  height: 46px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-0 {
  top: 10px;
  left: 7px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 10px;
  left: 53px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 10px;
  left: 99px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-3 {
  top: 10px;
  left: 145px;
}

/* line 37, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 10px;
  left: 191px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-5 {
  top: 10px;
  left: 237px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 10px;
  left: 283px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-7 {
  top: 10px;
  left: 329px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 10px;
  left: 375px;
}

/* line 43, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot.slot-9 {
  top: 10px;
  left: 421px;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}

/* line 57, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 40px 40px;
  height: 40px;
  width: 40px;
}

/* line 64, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .groups-box .group .gia-buttons {
  width: 158px;
}

/* line 70, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard {
  position: relative;
  margin: auto;
  width: 480px;
  height: 66px;
  background-color: #c4d4d6;
  border: 3px solid #808080;
  border-radius: 15px;
}

/* line 79, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard.incorrect {
  border-color: #ff4d76;
}

/* line 82, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard.incorrect-fill {
  background-color: #ffe3ee;
}

/* line 85, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard.correct {
  border-color: #00c372;
}

/* line 88, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard.correct-fill {
  background-color: #ccffd9;
}

/* line 92, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slots {
  position: relative;
  height: 100%;
  display: inline-block;
  width: 474px;
}

/* line 98, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot {
  position: absolute;
  display: inline-block;
  width: 46px;
  height: 46px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-0 {
  top: 10px;
  left: 7px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-1 {
  top: 10px;
  left: 53px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-2 {
  top: 10px;
  left: 99px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-3 {
  top: 10px;
  left: 145px;
}

/* line 104, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-4 {
  top: 10px;
  left: 191px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-5 {
  top: 10px;
  left: 237px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-6 {
  top: 10px;
  left: 283px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-7 {
  top: 10px;
  left: 329px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-8 {
  top: 10px;
  left: 375px;
}

/* line 110, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot.slot-9 {
  top: 10px;
  left: 421px;
}

/* line 116, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot .z-item {
  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: contain;
}

/* line 121, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .g1-decomposition-graveyard .graveyard-slot .z-item.prepops-graveyard {
  opacity: 0.5;
}

/* line 129, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .group-item-slot .z-item, .g1-composition.g1-decomposition-strand .graveyard-slot .z-item {
  z-index: 2;
}

/* line 131, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .group-item-slot .z-item.ui-draggable-dragging, .g1-composition.g1-decomposition-strand .graveyard-slot .z-item.ui-draggable-dragging {
  z-index: 3;
}

/* line 137, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .group-item-slot.pre-transition .z-item, .g1-composition.g1-decomposition-strand .group-item-slot.transition .z-item, .g1-composition.g1-decomposition-strand .graveyard-slot.pre-transition .z-item, .g1-composition.g1-decomposition-strand .graveyard-slot.transition .z-item {
  z-index: 3;
}

/* line 141, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .group-item-slot.transition .z-item, .g1-composition.g1-decomposition-strand .graveyard-slot.transition .z-item {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 146, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .ghost-hover, .g1-composition.g1-decomposition-strand .ghost-scaffold {
  position: absolute;
  z-index: 1;
  border-radius: 50%;
}

/* line 150, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .ghost-hover.hide, .g1-composition.g1-decomposition-strand .ghost-scaffold.hide {
  opacity: 0;
}

/* line 154, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .ghost-hover {
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  opacity: 0.5;
  width: 40px;
  height: 40px;
  left: 0;
  top: 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 40px 40px;
}

/* line 166, app/assets/stylesheets/shared/tasks/g1/decomposition_strand.scss */
.g1-composition.g1-decomposition-strand .ghost-scaffold {
  width: 40px;
  height: 40px;
  background-color: rgba(153, 153, 153, 0.4);
  opacity: 1;
  border: 3px dotted #999999;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 19, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 24, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-short .groups-box-groups {
  height: 172px;
}

/* line 27, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-short .groups-box {
  height: 172px;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-short .groups-box .group {
  height: 172px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-short .groups-box .group .group-items {
  height: 172px;
}

/* line 24, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-medium .groups-box-groups {
  height: 238px;
}

/* line 27, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-medium .groups-box {
  height: 238px;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-medium .groups-box .group {
  height: 238px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-medium .groups-box .group .group-items {
  height: 238px;
}

/* line 24, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-tall .groups-box-groups {
  height: 304px;
}

/* line 27, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-tall .groups-box {
  height: 304px;
}

/* line 29, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-tall .groups-box .group {
  height: 304px;
}

/* line 31, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some.five-some-tall .groups-box .group .group-items {
  height: 304px;
}

/* line 49, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group {
  margin: auto;
  display: block;
  width: 172px;
}

/* line 53, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items {
  width: 172px;
}

/* line 55, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot {
  width: 46px;
  height: 46px;
}

/* line 59, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-0, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-1 {
  top: 17px;
}

/* line 62, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-2 {
  top: 63px;
}

/* line 65, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-3, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-4 {
  top: 109px;
}

/* line 68, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-5, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-6 {
  top: 175px;
}

/* line 71, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-7, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-8 {
  top: 241px;
}

/* line 75, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-0, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-3, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-5, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-7 {
  left: 17px;
}

/* line 78, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-2 {
  left: 63px;
}

/* line 81, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-1, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-4, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-6, .g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot.slot-8 {
  left: 109px;
}

/* line 85, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  top: 0;
  left: 0;
  width: 40px;
  height: 40px;
  border-radius: 20px;
}

/* line 93, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot .z-item {
  background-size: 40px 40px;
  height: 40px;
  width: 40px;
}

/* line 97, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .group-items .group-item-slot .z-item.ui-draggable-dragging {
  z-index: 2;
}

/* line 103, app/assets/stylesheets/shared/tasks/g1/five_and_some.scss */
.g1-composition.g1-five-and-some .groups-box .group .gia-buttons {
  display: none;
}
/* line 1, app/assets/stylesheets/shared/tasks/geometry.scss */
.geometry.task {
  padding: 64px;
  font-size: 20px;
}

/* line 5, app/assets/stylesheets/shared/tasks/geometry.scss */
.geometry.task .point-label {
  font-family: Helvetica, Arial, sans-serif;
  font-weight: bold;
}
/* line 2, app/assets/stylesheets/shared/tasks/groups_to_array.scss */
.groups-to-array .groups-box {
  padding: 35px 0px 0px 0px;
  border-radius: 16px 16px 0px 0px;
}

/* line 6, app/assets/stylesheets/shared/tasks/groups_to_array.scss */
.groups-to-array .groups-box .group .group-items .group-item-slot.pegged .group-item-slot-peg {
  display: block;
}

/* line 11, app/assets/stylesheets/shared/tasks/groups_to_array.scss */
.groups-to-array .array-widget {
  border-radius: 0px 0px 16px 16px;
}

/* line 13, app/assets/stylesheets/shared/tasks/groups_to_array.scss */
.groups-to-array .array-widget .gia-total-label {
  bottom: 10px;
  top: auto;
}

/* line 17, app/assets/stylesheets/shared/tasks/groups_to_array.scss */
.groups-to-array .array-widget .array-col-button-wrapper {
  height: 0px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 14, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  color: #4d4d4d;
}

/* line 18, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat {
  background-color: white;
  width: 850px;
}

/* line 21, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.active {
  background-color: #f3fdff;
  border-color: #bdbec0;
}

/* line 25, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.active, .line-plot .line-plot-mat.incorrect, .line-plot .line-plot-mat.correct {
  border-width: 2px;
  border-style: solid;
  border-radius: 10px;
}

/* line 29, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.active .prepop .plot-slot-item, .line-plot .line-plot-mat.incorrect .prepop .plot-slot-item, .line-plot .line-plot-mat.correct .prepop .plot-slot-item {
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2720.2px%27%20height%3D%2720.2px%27%20viewBox%3D%270%200%2020.2%2020.2%27%3E%3Cpath%20style%3D%27fill%3A%20%235D6F78%27%20d%3D%27M14.7%2C9.5l4.7-4.7C20.1%2C4.1%2C20.4%2C3%2C20.1%2C2c-0.8-2.1-3.3-2.5-4.6-1.1l-4.7%2C4.7c-0.3%2C0.3-0.9%2C0.3-1.3%2C0L4.8%2C0.9%0D%0A%20%20%20%20C4.1%2C0.1%2C3-0.2%2C2%2C0.1c-2.1%2C0.8-2.5%2C3.3-1.1%2C4.6l4.7%2C4.7c0.3%2C0.3%2C0.3%2C0.9%2C0%2C1.3l-4.7%2C4.7c-0.7%2C0.7-1.1%2C1.8-0.7%2C2.8%0D%0A%20%20%20%20c0.8%2C2.1%2C3.3%2C2.5%2C4.6%2C1.1l4.7-4.7c0.3-0.3%2C0.9-0.3%2C1.3%2C0l4.7%2C4.7c0.7%2C0.7%2C1.8%2C1.1%2C2.8%2C0.7c2.1-0.8%2C2.5-3.3%2C1.1-4.6l-4.7-4.7%0D%0A%20%20%20%20C14.3%2C10.4%2C14.3%2C9.8%2C14.7%2C9.5z%27%2F%3E%3C%2Fsvg%3E") no-repeat center center;
}

/* line 36, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.with-mixed-fraction-labels .plot-number-line {
  margin-bottom: 80px;
}

/* line 39, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.with-mixed-fraction-labels .nl-tick-label {
  height: 44px;
}

/* line 44, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .title {
  font-size: 20px;
  margin: 7px 0 15px 0;
}

/* line 48, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plots-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 810px;
  margin: 0 auto;
}

/* line 53, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-col {
  -webkit-flex-grow: 1;
  flex-grow: 1;
  height: 180px;
}

/* line 57, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot {
  height: 25px;
}

/* line 59, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot:nth-last-child(2) {
  margin-bottom: 5px;
}

/* line 62, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot.highlight {
  background: #ffe919;
}

/* line 64, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot.highlight.highlight-top {
  border-radius: 7px 7px 0 0;
}

/* line 67, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot.highlight.highlight-bottom {
  border-radius: 0 0 7px 7px;
}

/* line 70, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-cell-slot.highlight.highlight-top.highlight-bottom {
  border-radius: 7px 7px 7px 7px;
}

/* line 75, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-slot-item, .line-plot .plot-slot-item-key {
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2720.2px%27%20height%3D%2720.2px%27%20viewBox%3D%270%200%2020.2%2020.2%27%3E%3Cpath%20style%3D%27fill%3A%20%237029A5%27%20d%3D%27M14.7%2C9.5l4.7-4.7C20.1%2C4.1%2C20.4%2C3%2C20.1%2C2c-0.8-2.1-3.3-2.5-4.6-1.1l-4.7%2C4.7c-0.3%2C0.3-0.9%2C0.3-1.3%2C0L4.8%2C0.9%0D%0A%20%20%20%20C4.1%2C0.1%2C3-0.2%2C2%2C0.1c-2.1%2C0.8-2.5%2C3.3-1.1%2C4.6l4.7%2C4.7c0.3%2C0.3%2C0.3%2C0.9%2C0%2C1.3l-4.7%2C4.7c-0.7%2C0.7-1.1%2C1.8-0.7%2C2.8%0D%0A%20%20%20%20c0.8%2C2.1%2C3.3%2C2.5%2C4.6%2C1.1l4.7-4.7c0.3-0.3%2C0.9-0.3%2C1.3%2C0l4.7%2C4.7c0.7%2C0.7%2C1.8%2C1.1%2C2.8%2C0.7c2.1-0.8%2C2.5-3.3%2C1.1-4.6l-4.7-4.7%0D%0A%20%20%20%20C14.3%2C10.4%2C14.3%2C9.8%2C14.7%2C9.5z%27%2F%3E%3C%2Fsvg%3E") no-repeat center center;
}

/* line 81, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-slot-item {
  height: 100%;
  width: 100%;
  pointer-events: none;
}

/* line 88, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .ghost:not(.filled):not(.hover-add):not(.hover-remove) .plot-slot-item {
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2222.5px%22%20height%3D%2222.3px%22%20viewBox%3D%220%200%2022.5%2022.3%22%3E%0A%3Cpath%20style%3D%27fill%3A%23e4e4e4%27%20stroke%3D%27%23999999%27%20stroke-width%3D%271%27%20d%3D%22M16%2C10.6l4.7-4.7c0.7-0.7%2C1.1-1.8%2C0.7-2.8C20.6%2C1%2C18.1%2C0.6%2C16.7%2C2l-4.7%2C4.7c-0.3%2C0.3-0.9%2C0.3-1.3%2C0L6.1%2C2%0A%20%20%20C5.4%2C1.3%2C4.3%2C0.9%2C3.3%2C1.3C1.2%2C2.1%2C0.8%2C4.5%2C2.2%2C5.9l4.7%2C4.7c0.3%2C0.3%2C0.3%2C0.9%2C0%2C1.3l-4.7%2C4.7c-0.7%2C0.7-1.1%2C1.8-0.7%2C2.8%0A%20%20%20c0.8%2C2.1%2C3.3%2C2.5%2C4.6%2C1.1l4.7-4.7c0.3-0.3%2C0.9-0.3%2C1.3%2C0l4.7%2C4.7c0.7%2C0.7%2C1.8%2C1.1%2C2.8%2C0.7c2.1-0.8%2C2.5-3.3%2C1.1-4.6L16%2C11.9%0A%20%20%20C15.6%2C11.5%2C15.6%2C11%2C16%2C10.6z%22%2F%3E%0A%3C%2Fsvg%3E") no-repeat center center;
}

/* line 92, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .hover-add .plot-slot-item {
  opacity: 0.4;
}

/* line 95, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .hover-remove .plot-slot-item {
  background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220.2px%22%20height%3D%2220.2px%22%20viewBox%3D%220%200%2020.2%2020.2%22%3E%0D%0A%3Cpath%20style%3D%22fill%3A%237029A5%22%20d%3D%22M14.7%2C9.5l4.7-4.7C20.1%2C4.1%2C20.5%2C3%2C20.1%2C2c-0.8-2.1-3.3-2.5-4.6-1.1l-4.7%2C4.7c-0.3%2C0.3-0.9%2C0.3-1.3%2C0L4.8%2C0.9%0D%0A%09C4.1%2C0.1%2C3-0.2%2C2%2C0.1c-2.1%2C0.8-2.5%2C3.3-1.1%2C4.6l4.7%2C4.7c0.3%2C0.3%2C0.3%2C0.9%2C0%2C1.3l-4.7%2C4.7c-0.7%2C0.7-1.1%2C1.8-0.7%2C2.8%0D%0A%09c0.8%2C2.1%2C3.3%2C2.5%2C4.6%2C1.1l4.7-4.7c0.3-0.3%2C0.9-0.3%2C1.3%2C0l4.7%2C4.7c0.7%2C0.7%2C1.8%2C1.1%2C2.8%2C0.7c2.1-0.8%2C2.5-3.3%2C1.1-4.6l-4.7-4.7%0D%0A%09C14.4%2C10.4%2C14.4%2C9.8%2C14.7%2C9.5z%22%2F%3E%0D%0A%3Ccircle%20style%3D%22fill%3A%23FFFFFF%3Bstroke%3A%237029A5%3Bstroke-width%3A1.4%3Bstroke-miterlimit%3A10%22%20cx%3D%2210.1%22%20cy%3D%2210.1%22%20r%3D%227%22%2F%3E%0D%0A%3Cline%20style%3D%22fill%3Anone%3Bstroke%3A%237029A5%3Bstroke-width%3A2%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A10%22%20x1%3D%227.1%22%20y1%3D%2210.1%22%20x2%3D%2213.1%22%20y2%3D%2210.1%22%2F%3E%0D%0A%3C%2Fsvg%3E") no-repeat center center;
}

/* line 98, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-number-line {
  margin: 0 auto 50px auto;
  width: 830px;
}

/* line 102, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-axis {
  position: relative;
  width: 830px;
}

/* line 107, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick-container {
  position: relative;
  height: 20px;
  margin-bottom: 18px;
  z-index: 1;
}

/* line 114, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick {
  width: 0;
  margin: auto;
}

/* line 117, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick::before {
  content: '';
  position: absolute;
  background: #4d4d4d;
}

/* line 122, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick.major::before {
  height: 20px;
  top: 0;
  width: 4px;
  left: calc(50% - 4px / 2);
}

/* line 128, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick.minor::before {
  height: 16px;
  top: 10%;
  width: 3px;
  left: calc(50% - 3px / 2);
}

/* line 135, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick.subdivision::before {
  height: 13px;
  top: 17.5%;
  width: 2px;
  left: calc(50% - 2px / 2);
}

/* line 143, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-tick-label {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 20px;
  left: 0;
  width: 100%;
  font-size: 16px;
  font-weight: bold;
}

/* line 153, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-axis-svg {
  position: absolute;
  left: 0;
  top: 0;
  height: 20px;
  width: 830px;
  stroke: #4d4d4d;
  stroke-width: 3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .nl-arrow-polyline {
  display: inline;
  height: 20px;
  width: 9px;
  fill: none;
  stroke-linejoin: round;
}

/* line 169, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-bottom-labels {
  position: relative;
  margin-bottom: 7px;
}

/* line 173, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-axis-label {
  font-size: 16px;
  font-weight: bold;
}

/* line 177, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-slot-key {
  position: absolute;
  top: 0;
  right: 25px;
}

/* line 182, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-slot-item-key {
  display: inline-block;
  vertical-align: middle;
  height: 15px;
  width: 15px;
  background-size: 15px 15px;
  margin-right: 3px;
}

/* line 191, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .plot-slot-text {
  font-size: 14px;
  vertical-align: middle;
}

/* line 201, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot.task-container.active-task .line-plot-mat.active .plots-area:not(.has-ghosts):hover {
  cursor: pointer;
}

/* line 205, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot.task-container.active-task .line-plot-mat.active .plots-area.has-ghosts .plot-cell-slot.ghost {
  cursor: pointer;
}

/* line 208, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot.task-container.active-task .line-plot-mat.active .plot-cell-slot.prepop:hover {
  cursor: default;
}

/* line 218, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.try-again {
  border-color: #ff4d76;
  background-color: #ffe3ee;
}

/* line 221, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.try-again:hover {
  cursor: pointer;
}

/* line 228, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.correct:not(.try-again) {
  border-color: #00c372;
}

/* line 231, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.incorrect:not(.try-again) {
  border-color: #ff4d76;
}

/* line 235, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.correct:not(.try-again):not(.final) {
  -webkit-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -moz-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -ms-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -o-animation: whiteMatBackgroundFlashCorrect 1.5s;
  animation: whiteMatBackgroundFlashCorrect 1.5s;
}

/* line 238, app/assets/stylesheets/shared/tasks/line_plot.scss */
.line-plot .line-plot-mat.incorrect:not(.try-again):not(.final) {
  -webkit-animation: whiteMatBackgroundFlashIncorrect 1.5s;
  -moz-animation: whiteMatBackgroundFlashIncorrect 1.5s;
  -ms-animation: whiteMatBackgroundFlashIncorrect 1.5s;
  -o-animation: whiteMatBackgroundFlashIncorrect 1.5s;
  animation: whiteMatBackgroundFlashIncorrect 1.5s;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .nb2017-controls {
  margin: 20px 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 13, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .plus-button, .number-bond-2017 .minus-button, .number-bond-2017 .nb2017-part-icon {
  display: inline-block;
}

/* line 16, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .nb2017-part-icon {
  background-image: url("//webassets.zearn.org/app_assets/tasks/number_bond_2017/numberBondPartIcon2.svg");
  background-repeat: no-repeat;
  width: 19px;
  height: 31px;
  margin: 0 5px;
}

/* line 26, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .number-bond-parts-token .nbp-part-line.ghost {
  stroke: #808080;
  stroke-dasharray: 6;
  stroke-miterlimit: 10;
}

/* line 32, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .number-bond-parts-token .nbp-part-token-wrapper.ghost.small, .number-bond-2017 .number-bond-parts-token .nbp-part-token-wrapper.ghost.large {
  border: 2px dashed #808080;
  background: #e4e4e4;
}

/* line 36, app/assets/stylesheets/shared/tasks/number_bond_2017.scss */
.number-bond-2017 .number-bond-parts-token .nbp-part-token-wrapper.ghost .nbp-whole-part-token {
  display: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 15, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid-row {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 18, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid-row:first-child .number-grid-cell {
  border-top: 1px solid #b3b3b3;
}

/* line 23, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid-cell {
  position: relative;
  font-size: 16px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  display: inline-block;
  vertical-align: top;
  border-color: #b3b3b3;
  border-style: solid;
  border-width: 0px 1px 1px 0px;
}

/* line 35, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid-cell:first-child {
  border-left-width: 1px;
}

/* line 40, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid-input {
  position: absolute;
  left: 2px;
  font-size: 16px;
  width: 35px;
  height: 32px;
  margin: 4px 0;
  box-shadow: 0 0 5px 2px #fff088;
}

/* line 50, app/assets/stylesheets/shared/tasks/number_grid.scss */
.axis-cell {
  background: #e1e1e1;
  font-weight: bold;
  font-size: 17px;
}

/* line 57, app/assets/stylesheets/shared/tasks/number_grid.scss */
.active-task .number-grid-cell.val-cell {
  cursor: pointer;
}

/* line 61, app/assets/stylesheets/shared/tasks/number_grid.scss */
.active-task .number-grid-cell.axis-cell.selectable {
  cursor: pointer;
}

/* line 70, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-row.axis-row .axis-cell {
  background: url("//webassets.zearn.org/app_assets/tasks/sieve/SieveColumnSelector.png") no-repeat center center;
  width: 40px;
  padding-bottom: 5px;
  font-size: 0;
  background-color: transparent;
  color: transparent;
  border: none;
  border-bottom: 1px solid #b3b3b3;
}

/* line 83, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-row.val-row:nth-last-child(11) .val-cell:first-child {
  background: #e6e7e8;
}

/* line 88, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .val-cell.hover:not(.selected) {
  background: #dce1ef;
  opacity: 0.63;
}

/* line 92, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .val-cell.prime.permanent:not(.selected-disabled) {
  background: #fce139;
}

/* line 99, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid.prime-mode .val-cell.selected:not(.permanent):not(.selected-disabled) {
  background: #f9ca06;
}

/* line 105, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-cell.selected:not(.selected-disabled) {
  color: white;
  background: #7a8ded;
}

/* line 109, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-cell.permanent:not(.selected-disabled) {
  color: black;
  background: #c3cbe7;
  cursor: default;
}

/* line 114, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-cell.missing {
  border: 4px solid #f75e00;
  line-height: 32px;
}

/* line 120, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .number-grid-incorrect {
  position: absolute;
  width: 32px;
  height: 4px;
  top: 17px;
  left: 3px;
  opacity: 0.63;
  background-color: #f75e00;
}

/* line 129, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .sieve-autocorrect-box {
  position: absolute;
  right: 5px;
  top: 175px;
  width: 200px;
  height: 120px;
  padding: 30px 15px;
  background-color: #e6e7e8;
  font-size: 22px;
}

/* line 139, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .sieve-autocorrect-box.large {
  height: 170px;
  top: 150px;
}

/* line 144, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .sieve-autocorrect-box .sieve-autocorrect-text {
  color: #f75e00;
  font-weight: bold;
}

/* line 148, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .sieve-autocorrect-box .sieve-autocorrect-subtext {
  color: #f75e00;
  font-size: 18px;
}

/* line 153, app/assets/stylesheets/shared/tasks/number_grid.scss */
.sieve-of-eratosthenes .sieve-autocorrect-box .sieve-autocorrect-ok {
  position: absolute;
  right: 70px;
  bottom: 10px;
  width: 60px;
  background-color: #0097b6;
  font-size: 22px;
}

/* line 166, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.unselectable {
  color: #aaa;
  background: white;
  cursor: default;
}

/* line 171, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.selected {
  background: #fff088;
}

/* line 174, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.correct {
  color: white;
  background: #0fa566;
}

/* line 178, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.incorrect {
  color: #f75e00;
  background: white;
}

/* line 182, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.missing {
  color: #555;
  background: #9CD7B6;
}

/* line 186, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.hover {
  background: #FFF8C6;
}

/* line 189, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.hover-unselect {
  color: black;
  background: white;
}

/* line 193, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.permanent {
  color: white;
  background: #0fa566;
  cursor: default;
}

/* line 201, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.axis-cell.incorrect {
  color: #f75e00;
  background: #e1e1e1;
}

/* line 205, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.axis-cell.hover-unselect {
  color: black;
  background: #e1e1e1;
}

/* line 209, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.axis-cell.preselected {
  color: white;
  background: #0fa566;
  cursor: pointer;
}

/* line 213, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.axis-cell.preselected.hover, .times-table-chart .number-grid-cell.axis-cell.preselected.selected {
  color: black;
  background: #fff088;
}

/* line 217, app/assets/stylesheets/shared/tasks/number_grid.scss */
.times-table-chart .number-grid-cell.axis-cell.preselected.hover-unselect {
  color: white;
  background: #0fa566;
}

/* line 225, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid {
  position: relative;
}

/* line 228, app/assets/stylesheets/shared/tasks/number_grid.scss */
.number-grid .number-grid-backdrop {
  display: none;
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -220px;
  width: 440px;
  height: 440px;
  background: black;
  opacity: 0.2;
  filter: alpha(opacity=20);
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  height: 40px;
  display: inline-block;
  margin-bottom: 80px;
  position: relative;
}

/* line 14, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-containment {
  position: absolute;
  left: 24px;
  right: 22px;
}

/* line 19, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-line {
  position: absolute;
  width: 100%;
  top: 50%;
  margin-top: -3px;
  height: 6px;
  background: black;
  border-radius: 6px;
  z-index: 1;
  pointer-events: none;
}

/* line 31, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick, .number-line .number-line-minor-tick, .number-line .number-line-left-arrow, .number-line .number-line-right-arrow {
  display: inline-block;
  vertical-align: middle;
}

/* line 36, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-arrow, .number-line .number-line-right-arrow {
  width: 24px;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
}

/* line 42, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-arrow {
  background-image: url("//webassets.zearn.org/app_assets/tasks/number_line/ArrowLeft.png");
  background-position: left;
}

/* line 46, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-right-arrow {
  background-image: url("//webassets.zearn.org/app_assets/tasks/number_line/ArrowRight.png");
  background-position: right;
}

/* line 51, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick, .number-line .number-line-minor-tick {
  position: relative;
  display: inline-block;
  width: 10px;
}

/* line 55, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick .number-line-tick-inner, .number-line .number-line-minor-tick .number-line-tick-inner {
  height: 100%;
  position: absolute;
  left: 50%;
  z-index: 0;
}

/* line 62, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick {
  height: 72%;
}

/* line 64, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick .number-line-tick-static-num {
  top: 100%;
  font-size: 18px;
  position: absolute;
  left: 50%;
  width: 30px;
  margin-left: -15px;
}

/* line 72, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-major-tick .number-line-tick-inner {
  background: black;
  border-radius: 4px;
  width: 4px;
  margin-left: -2px;
}

/* line 79, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-minor-tick {
  height: 40%;
}

/* line 81, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-minor-tick .number-line-tick-inner {
  width: 2px;
  margin-left: -1px;
  background: #4d4d4d;
}

/* line 87, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-minor-tick.hidden .number-line-tick-inner {
  display: none;
}

/* line 92, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-label, .number-line .number-line-right-label {
  position: absolute;
  bottom: -50px;
}

/* line 96, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-label .number-input, .number-line .number-line-right-label .number-input {
  font-size: 20px;
  width: 40px;
}

/* line 100, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-label .number-line-label-num, .number-line .number-line-right-label .number-line-label-num {
  font-size: 20px;
}

/* line 102, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-label .number-line-label-num.correct, .number-line .number-line-right-label .number-line-label-num.correct {
  display: none;
  color: #f75e00;
}

/* line 108, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-left-label {
  left: -40px;
  width: 140px;
}

/* line 112, app/assets/stylesheets/shared/tasks/number_line.scss */
.number-line .number-line-right-label {
  right: -40px;
  width: 140px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 9, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .point-mat {
  width: 850px;
  padding: 15px 0;
}

/* line 14, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .nl-point .point-hover {
  position: absolute;
  height: 24px;
  margin-left: 12px;
}

/* line 23, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .number-line-token .nl-point:not(.plotted):not(.prepop) {
  opacity: 0;
}

/* line 25, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .number-line-token .nl-point.hover:not(.plotted):not(.prepop) {
  opacity: 0.5;
}

/* line 27, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .number-line-token .nl-point.hover:not(.plotted):not(.prepop) .point-hover {
  cursor: pointer;
}

/* line 33, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .number-line-token .nl-point.plotted.hover .point-hover {
  cursor: pointer;
}

/* line 36, app/assets/stylesheets/shared/tasks/number_line_2016.scss */
.number-line-2016 .number-line-token .nl-point.plotted.hover::after {
  content: "";
  width: 18px;
  height: 18px;
  margin: 3px 3px 0 0;
  float: right;
  position: absolute;
  top: 0px;
  left: 3px;
  background: url("//webassets.zearn.org/app_assets/tasks/area_plot/minus.svg") no-repeat;
}

/* line 17, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover:not(.prepop):not(.plotted) .point {
  opacity: 1;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.circle:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.circle:not(.prepop):not(.plotted) .point {
  background-position: -72px 0px;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.square:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.square:not(.prepop):not(.plotted) .point {
  background-position: -72px -24px;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.triangle:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.triangle:not(.prepop):not(.plotted) .point {
  background-position: -72px -48px;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.star:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.star:not(.prepop):not(.plotted) .point {
  background-position: -72px -72px;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.heart:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.heart:not(.prepop):not(.plotted) .point {
  background-position: -72px -96px;
}

/* line 22, app/assets/stylesheets/shared/tasks/../general/plotted_points_mixins.scss */
.number-line-2016 .number-line-token .nl-point.plotted.polygon:not(.correct):not(.incorrect) .point, .number-line-2016 .number-line-token .nl-point.hover.polygon:not(.prepop):not(.plotted) .point {
  background-position: -72px -120px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .operational-buttons {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 120px;
  width: 120px;
  height: 40px;
  margin-bottom: 20px;
  border-radius: 20px;
  background-color: transparent;
  color: transparent;
}

/* line 16, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .operational-buttons.correctable {
  cursor: pointer;
  line-height: 40px;
  background-color: #ff4d76;
}

/* line 20, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .operational-buttons.correctable::after {
  content: '?';
  color: white;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 20px;
}

/* line 26, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .operational-buttons.correctable .partition-buttons {
  display: none;
}

/* line 32, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .partition-buttons, .number-line-partition-2017 .minus-button, .number-line-partition-2017 .partition-icon, .number-line-partition-2017 .plus-button, .number-line-partition-2017 .graded-mat {
  display: inline-block;
}

/* line 36, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .minus-button, .number-line-partition-2017 .plus-button {
  vertical-align: top;
}

/* line 40, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .partition-icon {
  margin: 0 4px;
  background-image: url("//webassets.zearn.org/app_assets/tasks/number_line_partition_2017/NL-divide.svg");
  background-size: 30px 17px;
  background-repeat: no-repeat;
  background-position: center center;
  height: 32px;
  width: 32px;
}

/* line 52, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .number-line-token.token .nl-axis {
  margin: 0 35px;
}

/* line 56, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .graded-mat.correctable {
  cursor: pointer;
}

/* line 60, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .nl-tick.incorrect {
  background-color: #ff4d76;
}

/* line 64, app/assets/stylesheets/shared/tasks/number_line_partition_2017.scss */
.number-line-partition-2017 .nl-segment-label.incorrect, .number-line-partition-2017 .nl-subdivision-label.incorrect {
  color: #ff4d76;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-area {
  position: relative;
  display: table;
  margin: 30px auto 0 auto;
}

/* line 10, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-area.big .np-slot {
  width: 40px;
}

/* line 13, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-area.big .np-circle {
  width: 51px;
  height: 52px;
  top: -4px;
  left: -7px;
}

/* line 21, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-slot {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  font-size: 18px;
  border: 3px solid #808080;
  border-left-width: 0;
  width: 50px;
  height: 50px;
}

/* line 30, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-slot:first-child {
  border-left-width: 3px;
}

/* line 34, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-circle {
  border: 3px solid #007b94;
  position: absolute;
  width: 66px;
  height: 66px;
  top: -10px;
  left: -10px;
  border-radius: 50%;
}

/* line 43, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-hop {
  position: absolute;
  top: -42px;
  left: 50%;
}

/* line 47, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-hop.left {
  left: -50%;
}

/* line 50, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-hop figure {
  margin: 0;
}

/* line 53, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-hop path {
  fill: none;
  stroke-width: 2px;
  stroke: black;
}

/* line 57, app/assets/stylesheets/shared/tasks/number_path.scss */
.number-path .np-hop path.filled {
  fill: black;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 11, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 14, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object {
  position: relative;
  margin: 0 auto;
  width: 240px;
}

/* line 19, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-image {
  width: 100%;
  height: 100%;
}

/* line 24, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line {
  position: relative;
  width: 100%;
  height: 4px;
}

/* line 29, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line .measurement-line-line {
  position: absolute;
  background: black;
  width: 100%;
  height: 4px;
  top: 0px;
}

/* line 36, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line .measurement-line-tick {
  position: absolute;
  background: black;
  width: 4px;
  height: 16px;
  top: -6px;
}

/* line 42, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line .measurement-line-tick.begin {
  left: -4px;
}

/* line 45, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line .measurement-line-tick.end {
  right: -4px;
}

/* line 47, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-object .measurement-line .measurement-line-tick.end.faded {
  opacity: 0.3;
}

/* line 55, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-ruler {
  position: relative;
  margin: 0 auto 12px;
}

/* line 59, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-ruler.correct {
  background: #ccffd9;
  outline: #ccffd9 solid 8px;
}

/* line 63, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-ruler.incorrect {
  background: #fea5ba;
  outline: #fea5ba solid 8px;
}

/* line 68, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-ruler > div.block:first-of-type {
  border-left-width: 4px;
}

/* line 71, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-ruler > div.block:last-of-type {
  border-right-width: 4px;
}

/* line 76, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  height: 85px;
  width: 85px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 84, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit img {
  position: absolute;
  top: 0;
  left: 0;
}

/* line 90, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit .unit-add {
  display: none;
  border-radius: 50%;
  font-size: 28px;
  width: 36px;
  height: 36px;
  line-height: 34px;
  background: #0097b6;
  color: white;
  margin: auto;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 103, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.block {
  background: #65c6fd;
  border: 4px solid #d1d2d4;
  border-left-width: 2px;
  border-right-width: 2px;
}

/* line 108, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.block.ghost {
  background: #c7e7f8;
  border-color: #e1e1e1;
  border-right-width: 4px;
}

/* line 112, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.block.ghost:hover {
  -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6));
  -moz-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6));
  -ms-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6));
  -o-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6));
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6));
}

/* line 118, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.jiggle {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 121, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.hidden {
  visibility: hidden;
}

/* line 124, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.ghost {
  font-weight: bold;
  cursor: pointer;
}

/* line 128, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.ghost .unit-add {
  display: block;
}

/* line 132, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.ghost img {
  -webkit-filter: invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -moz-filter: invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -ms-filter: invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -o-filter: invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  filter: invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  opacity: 0.6;
}

/* line 137, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.ghost:hover {
  text-shadow: rgba(4, 93, 112, 0.6) 0 0 4px;
}

/* line 138, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .measurement-unit.ghost:hover img {
  -webkit-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6)) invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -moz-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6)) invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -ms-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6)) invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  -o-filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6)) invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
  filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.6)) invert(40%) brightness(1.2) sepia(100%) hue-rotate(150deg);
}

/* line 146, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .lm-mask {
  position: absolute;
  top: -6px;
  left: -4px;
  height: 100%;
  height: calc(100% + 6px);
  width: 100%;
  width: calc(100% + 8px);
  border-left: 4px solid black;
}

/* line 156, app/assets/stylesheets/shared/tasks/old_linear_measurement.scss */
.old-linear-measurement .lm-mask .lm-shader {
  position: absolute;
  right: 0;
  height: 100%;
  border-left: 4px solid black;
  background: white;
  opacity: 0.7;
}
/* line 5, app/assets/stylesheets/shared/tasks/parallel_line_annotation.scss */
.parallel-line-annotation .geometry-pad .caret {
  pointer-events: none;
}

/* line 9, app/assets/stylesheets/shared/tasks/parallel_line_annotation.scss */
.parallel-line-annotation .geometry-pad .click-zone {
  stroke-width: 40px;
  stroke: rgba(0, 0, 0, 0);
}

/* line 16, app/assets/stylesheets/shared/tasks/parallel_line_annotation.scss */
.parallel-line-annotation.active-task .click-zone:not(.prepop) {
  cursor: pointer;
}

/* line 20, app/assets/stylesheets/shared/tasks/parallel_line_annotation.scss */
.parallel-line-annotation.active-task .maxed .click-zone:not(.prepop):not(.paired-zone) {
  cursor: default;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 33, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .pictograph-container {
  width: 500px;
  margin: auto;
}

/* line 37, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .pictograph-container .pictograph-legend {
  margin-top: 10px;
  font-size: 11px;
  text-align: right;
}

/* line 43, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .pictograph-container .pictograph-legend-image {
  display: inline-block;
  margin: 0 1px -6px 1px;
  height: 20px;
  width: 20px;
  background-size: 20px 20px;
}

/* line 51, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .pictograph-container .pictograph-legend-text {
  display: inline-block;
}

/* line 56, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 59, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-container {
  position: relative;
  width: 500px;
  margin: auto;
}

/* line 65, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-draggable-box {
  position: absolute;
  top: 26px;
  left: -60px;
  height: 53px;
  width: 60px;
  cursor: pointer;
  border-width: 2px 0 2px 2px;
  border-style: solid;
  border-color: #8c8c8c;
  background-color: #d1d2d4;
  border-radius: 13px 0 0 13px;
}

/* line 77, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-draggable-box.disabled {
  cursor: default;
}

/* line 79, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-draggable-box.disabled .area-tiles-draggable-image {
  opacity: 0.5;
}

/* line 85, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-draggable-image {
  height: 44px;
  width: 44px;
  margin: 3px auto;
}

/* line 91, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-draggable-image-helper {
  height: 34px;
  width: 34px;
}

/* line 96, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-header {
  width: 100%;
  background-color: #d1d2d4;
  border: 2px solid #8c8c8c;
  border-radius: 5px 5px 0 0;
  font-size: 20px;
}

/* line 104, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-table {
  width: 100%;
  display: table;
  table-layout: fixed;
}

/* line 110, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-columns {
  display: table-row;
}

/* line 114, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column {
  display: table-cell;
  border-width: 2px;
  border-style: solid;
  border-color: transparent;
  border-left-color: #8c8c8c;
  height: 100%;
}

/* line 122, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column:last-child {
  border-top-width: 0;
  border-right-color: #8c8c8c;
}

/* line 126, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column.column-add-hover, .pictograph .area-tiles-widget .area-tiles-column.column-delete-hover {
  cursor: pointer;
  border-color: #2DC7E4;
  -webkit-box-shadow: inset 1px 0 2px 2px #A1F4FE;
  -moz-box-shadow: inset 1px 0 2px 2px #A1F4FE;
  -ms-box-shadow: inset 1px 0 2px 2px #A1F4FE;
  -o-box-shadow: inset 1px 0 2px 2px #A1F4FE;
  box-shadow: inset 1px 0 2px 2px #A1F4FE;
}

/* line 130, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column.column-add-hover:last-child, .pictograph .area-tiles-widget .area-tiles-column.column-delete-hover:last-child {
  -webkit-box-shadow: inset 0 0 0 3px #A1F4FE;
  -moz-box-shadow: inset 0 0 0 3px #A1F4FE;
  -ms-box-shadow: inset 0 0 0 3px #A1F4FE;
  -o-box-shadow: inset 0 0 0 3px #A1F4FE;
  box-shadow: inset 0 0 0 3px #A1F4FE;
}

/* line 134, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column.column-add-hover + .area-tiles-column, .pictograph .area-tiles-widget .area-tiles-column.column-delete-hover + .area-tiles-column {
  border-left-color: #A1F4FE;
}

/* line 137, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column.highlight {
  background-color: rgba(250, 210, 50, 0.5);
}

/* line 141, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell {
  height: 38px;
}

/* line 143, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell .area-tiles-cell-image {
  height: 34px;
  width: 34px;
  margin: 2px auto;
  padding-top: 5px;
  border: 2px dotted transparent;
  background-position: -2px;
  background-repeat: no-repeat;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  color: transparent;
}

/* line 155, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell .area-tiles-cell-image:after {
  content: '-';
  margin-left: 1px;
}

/* line 161, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell:not(.filled):not(.cell-add-hover) .area-tiles-cell-image {
  opacity: 0.0;
}

/* line 166, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-add-hover .area-tiles-cell-image {
  border-color: #d1d2d4;
  border-radius: 50%;
}

/* line 172, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-delete-hover .area-tiles-cell-image {
  color: black;
}

/* line 179, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell.ghost:not(.filled):not(.cell-add-hover) .area-tiles-cell-image {
  opacity: 1.0;
  background: none;
  border-color: #d1d2d4;
  border-radius: 50%;
}

/* line 187, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell.ghost.cell-add-hover:not(.filled) .area-tiles-cell-image {
  border-color: #2DC7E4;
  border-radius: 50%;
}

/* line 190, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-column .area-tiles-cell.ghost.cell-add-hover:not(.filled) .area-tiles-cell-image:after {
  content: attr(data-scaleval);
  color: black;
  opacity: 1.0;
  font-weight: normal;
  margin-left: 0;
}

/* line 202, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-footer {
  background-color: #d1d2d4;
  font-size: 17px;
  display: table-row;
}

/* line 208, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-name {
  display: table-cell;
  overflow-wrap: break-word;
  vertical-align: middle;
  border-width: 2px 0 2px 2px;
  border-style: solid;
  border-color: #8c8c8c;
}

/* line 215, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-name:first-child {
  border-radius: 0 0 0 5px;
}

/* line 218, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph .area-tiles-widget .area-tiles-name:last-child {
  border-right-width: 2px;
  border-radius: 0 0 5px 0;
}

/* line 227, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .pictograph-container {
  width: 100%;
}

/* line 229, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .pictograph-container .pictograph-legend {
  font-size: 11px;
}

/* line 235, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .area-tiles-widget .area-tiles-container {
  width: 100%;
}

/* line 239, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .area-tiles-widget .area-tiles-draggable-box {
  top: 24px;
}

/* line 243, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .area-tiles-widget .area-tiles-header {
  font-size: 18px;
}

/* line 247, app/assets/stylesheets/shared/tasks/pictograph.scss */
.pictograph.grid-6 .area-tiles-widget .area-tiles-footer {
  font-size: 14px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes columnCorrect {
  0%, 88% {
    background-color: #ccffd9;
    -webkit-box-shadow: inset 0 0 0 2px #00c372;
    -moz-box-shadow: inset 0 0 0 2px #00c372;
    -ms-box-shadow: inset 0 0 0 2px #00c372;
    -o-box-shadow: inset 0 0 0 2px #00c372;
    box-shadow: inset 0 0 0 2px #00c372;
  }
  100% {
    background-color: transparent;
    -webkit-box-shadow: inset 0 0 0 2px transparent;
    -moz-box-shadow: inset 0 0 0 2px transparent;
    -ms-box-shadow: inset 0 0 0 2px transparent;
    -o-box-shadow: inset 0 0 0 2px transparent;
    box-shadow: inset 0 0 0 2px transparent;
  }
}

@-moz-keyframes columnCorrect {
  0%, 88% {
    background-color: #ccffd9;
    -webkit-box-shadow: inset 0 0 0 2px #00c372;
    -moz-box-shadow: inset 0 0 0 2px #00c372;
    -ms-box-shadow: inset 0 0 0 2px #00c372;
    -o-box-shadow: inset 0 0 0 2px #00c372;
    box-shadow: inset 0 0 0 2px #00c372;
  }
  100% {
    background-color: transparent;
    -webkit-box-shadow: inset 0 0 0 2px transparent;
    -moz-box-shadow: inset 0 0 0 2px transparent;
    -ms-box-shadow: inset 0 0 0 2px transparent;
    -o-box-shadow: inset 0 0 0 2px transparent;
    box-shadow: inset 0 0 0 2px transparent;
  }
}

@-o-keyframes columnCorrect {
  0%, 88% {
    background-color: #ccffd9;
    -webkit-box-shadow: inset 0 0 0 2px #00c372;
    -moz-box-shadow: inset 0 0 0 2px #00c372;
    -ms-box-shadow: inset 0 0 0 2px #00c372;
    -o-box-shadow: inset 0 0 0 2px #00c372;
    box-shadow: inset 0 0 0 2px #00c372;
  }
  100% {
    background-color: transparent;
    -webkit-box-shadow: inset 0 0 0 2px transparent;
    -moz-box-shadow: inset 0 0 0 2px transparent;
    -ms-box-shadow: inset 0 0 0 2px transparent;
    -o-box-shadow: inset 0 0 0 2px transparent;
    box-shadow: inset 0 0 0 2px transparent;
  }
}

@keyframes columnCorrect {
  0%, 88% {
    background-color: #ccffd9;
    -webkit-box-shadow: inset 0 0 0 2px #00c372;
    -moz-box-shadow: inset 0 0 0 2px #00c372;
    -ms-box-shadow: inset 0 0 0 2px #00c372;
    -o-box-shadow: inset 0 0 0 2px #00c372;
    box-shadow: inset 0 0 0 2px #00c372;
  }
  100% {
    background-color: transparent;
    -webkit-box-shadow: inset 0 0 0 2px transparent;
    -moz-box-shadow: inset 0 0 0 2px transparent;
    -ms-box-shadow: inset 0 0 0 2px transparent;
    -o-box-shadow: inset 0 0 0 2px transparent;
    box-shadow: inset 0 0 0 2px transparent;
  }
}

@-webkit-keyframes columnIncorrect {
  0%, 88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-moz-keyframes columnIncorrect {
  0%, 88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-o-keyframes columnIncorrect {
  0%, 88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@keyframes columnIncorrect {
  0%, 88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

/* line 46, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container {
  width: 500px;
  margin: auto;
}

/* line 50, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container .pictograph-legend {
  margin-top: 15px;
  color: #303b40;
  font-size: 16px;
  text-align: right;
}

/* line 57, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container .pictograph-legend-image {
  display: inline-block;
  margin: 0 1px -4px 1px;
  height: 20px;
  width: 20px;
  background-size: 20px 20px;
}

/* line 63, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container .pictograph-legend-image.person {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/tasks/pictograph_2017/icons.svg");
  background-size: 71px 43px;
  background-position: -1px -24px;
}

/* line 67, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container .pictograph-legend-image.cone {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/tasks/pictograph_2017/icons.svg");
  background-size: 71px 43px;
  background-position: -1px 1px;
}

/* line 73, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .pictograph-container .pictograph-legend-text {
  display: inline-block;
}

/* line 78, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 82, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-container {
  position: relative;
  width: 500px;
  margin: auto;
}

/* line 88, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-header {
  width: 100%;
  font-size: 20px;
  margin-bottom: 20px;
}

/* line 94, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-table {
  width: 100%;
  display: table;
  table-layout: fixed;
}

/* line 100, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-columns {
  display: table-row;
}

/* line 104, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column {
  display: table-cell;
  border: 1px solid #a1adb3;
  height: 100%;
}

/* line 109, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column:not(.disabled) {
  background-color: #f3fdff;
  cursor: pointer;
}

/* line 113, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column:not(:first-child) {
  border-left-width: 0px;
}

/* line 116, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column.highlight {
  background-color: #ffff73;
}

/* line 119, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column.try-again {
  -webkit-box-shadow: inset 0 0 0 2px #ff4d76;
  -moz-box-shadow: inset 0 0 0 2px #ff4d76;
  -ms-box-shadow: inset 0 0 0 2px #ff4d76;
  -o-box-shadow: inset 0 0 0 2px #ff4d76;
  box-shadow: inset 0 0 0 2px #ff4d76;
  background-color: #ffe3ee;
  cursor: pointer;
}

/* line 124, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column.incorrect {
  -webkit-box-shadow: inset 0 0 0 2px #ff4d76;
  -moz-box-shadow: inset 0 0 0 2px #ff4d76;
  -ms-box-shadow: inset 0 0 0 2px #ff4d76;
  -o-box-shadow: inset 0 0 0 2px #ff4d76;
  box-shadow: inset 0 0 0 2px #ff4d76;
}

/* line 126, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column.incorrect:not(.page-refreshed) {
  -webkit-animation: columnIncorrect 1700ms linear;
  -moz-animation: columnIncorrect 1700ms linear;
  -ms-animation: columnIncorrect 1700ms linear;
  -o-animation: columnIncorrect 1700ms linear;
  animation: columnIncorrect 1700ms linear;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

/* line 131, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column.correct:not(.page-refreshed) {
  -webkit-animation: columnCorrect 1700ms linear;
  -moz-animation: columnCorrect 1700ms linear;
  -ms-animation: columnCorrect 1700ms linear;
  -o-animation: columnCorrect 1700ms linear;
  animation: columnCorrect 1700ms linear;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

/* line 136, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell {
  height: 38px;
}

/* line 139, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell .area-tiles-cell-image {
  height: 34px;
  width: 34px;
  margin: 2px auto;
  padding-top: 5px;
  border: 1px dotted transparent;
  background-position: -2px;
  background-repeat: no-repeat;
}

/* line 148, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell .area-tiles-cell-image.person {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/tasks/pictograph_2017/icons.svg");
  background-size: 122px 77px;
  background-position: -1px -44px;
}

/* line 152, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell .area-tiles-cell-image.cone {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/tasks/pictograph_2017/icons.svg");
  background-size: 122px 77px;
  background-position: -1px -1px;
}

/* line 158, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell:not(.filled):not(.cell-add-hover) .area-tiles-cell-image {
  opacity: 0;
}

/* line 163, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-add-hover:not(.ghost) .area-tiles-cell-image.person {
  background-position: -45px -44px;
}

/* line 166, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-add-hover:not(.ghost) .area-tiles-cell-image.cone {
  background-position: -45px -1px;
}

/* line 171, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-delete-hover:not(.ghost) .area-tiles-cell-image.person {
  background-position: -89px -44px;
}

/* line 174, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell.cell-delete-hover:not(.ghost) .area-tiles-cell-image.cone {
  background-position: -89px -1px;
}

/* line 180, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-column .area-tiles-cell.ghost:not(.filled) .area-tiles-cell-image {
  opacity: 1;
  background: none;
  background-color: rgba(153, 153, 153, 0.4);
  border: 3px dotted #999999;
  border-radius: 50%;
}

/* line 190, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-footer {
  background-color: #f0f5f7;
  color: #303b40;
  font-size: 16px;
  font-weight: bold;
  display: table-row;
}

/* line 198, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-name {
  display: table-cell;
  overflow-wrap: break-word;
  vertical-align: middle;
  border: 1px solid #a1adb3;
  border-top-color: transparent;
}

/* line 204, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017 .area-tiles-widget .area-tiles-name:not(:first-child) {
  border-left-color: transparent;
}

/* line 212, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017.grid-6 .pictograph-container {
  width: 100%;
}

/* line 214, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017.grid-6 .pictograph-container .pictograph-legend {
  font-size: 16px;
}

/* line 220, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017.grid-6 .area-tiles-widget .area-tiles-container {
  width: 100%;
}

/* line 224, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017.grid-6 .area-tiles-widget .area-tiles-header {
  font-size: 18px;
}

/* line 228, app/assets/stylesheets/shared/tasks/pictograph_2017.scss */
.pictograph-2017.grid-6 .area-tiles-widget .area-tiles-footer {
  font-size: 14px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/tasks/place_value_matching.scss */
.place-value-matching .number-iteration {
  display: inline-block;
  width: 90px;
}

/* line 8, app/assets/stylesheets/shared/tasks/place_value_matching.scss */
.place-value-matching .number-sep {
  display: inline-block;
  width: 4px;
  height: 36px;
  border-radius: 10px;
  background-color: #aaa;
  vertical-align: -12px;
}

/* line 17, app/assets/stylesheets/shared/tasks/place_value_matching.scss */
.place-value-matching .horizontal-matching-widget .match-set2-item {
  text-align: left;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/tasks/protractor_angle_2017.scss */
.protractor-angle-measurement-2017 .protractor-2017-button:not(.hide-show-button), .protractor-angle-creation-2017 .protractor-2017-button:not(.hide-show-button) {
  background-color: #007b94;
  color: white;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  z-index: 1;
  margin-left: 10px;
}

/* line 130, app/assets/stylesheets/shared/_student_variables.scss */
.protractor-angle-measurement-2017 .protractor-2017-button.disabled:not(.hide-show-button), .protractor-angle-measurement-2017 .protractor-2017-button:not(.hide-show-button):disabled, .protractor-angle-creation-2017 .protractor-2017-button.disabled:not(.hide-show-button), .protractor-angle-creation-2017 .protractor-2017-button:not(.hide-show-button):disabled {
  pointer-events: none;
  cursor: default;
  background-color: #cfdee6;
}

/* line 136, app/assets/stylesheets/shared/_student_variables.scss */
.protractor-angle-measurement-2017 .protractor-2017-button.hover:not(.hide-show-button):not(.disabled), .protractor-angle-measurement-2017 .protractor-2017-button:not(.hide-show-button):not(.disabled):hover, .protractor-angle-creation-2017 .protractor-2017-button.hover:not(.hide-show-button):not(.disabled), .protractor-angle-creation-2017 .protractor-2017-button:not(.hide-show-button):not(.disabled):hover {
  background-color: #005c73;
}

/* line 137, app/assets/stylesheets/shared/_student_variables.scss */
.protractor-angle-measurement-2017 .protractor-2017-button.active:not(.hide-show-button):not(.disabled), .protractor-angle-measurement-2017 .protractor-2017-button:not(.hide-show-button):not(.disabled):active, .protractor-angle-creation-2017 .protractor-2017-button.active:not(.hide-show-button):not(.disabled), .protractor-angle-creation-2017 .protractor-2017-button:not(.hide-show-button):not(.disabled):active {
  background-color: #003e4d;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 20, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 23, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls {
  position: relative;
  left: 0;
  z-index: 2;
}

/* line 28, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls span {
  display: inline-block;
  height: 42px;
  width: 42px;
  margin-right: 10px;
}

/* line 35, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls .ray-big-right {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/rotatearrow02.png");
}

/* line 39, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls .ray-right {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/rotatearrow04.png");
}

/* line 43, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls .ray-left {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/rotatearrow03.png");
}

/* line 47, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .ray-controls .ray-big-left {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/rotatearrow01.png");
}

/* line 52, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area {
  display: inline-block;
  position: relative;
  vertical-align: top;
  margin: 100px 0 70px 0;
}

/* line 59, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area.correctable .protractor-img {
  z-index: 4;
}

/* line 61, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area.correctable .protractor-img::after {
  content: '?';
  width: 40px;
  height: 40px;
  background: #ff4d76;
  border-radius: 20px;
  position: absolute;
  left: 183px;
  top: 183px;
  font-size: 20px;
  color: white;
  line-height: 40px;
}

/* line 78, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area.correctable {
  cursor: pointer;
}

/* line 81, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area.correctable:not(.autocorrect) .protractor-img::after {
  cursor: pointer;
}

/* line 85, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img {
  position: relative;
  z-index: 1;
  width: 406px;
  height: 406px;
  background-repeat: no-repeat;
  -webkit-transform-origin: 203px 203px;
  -moz-transform-origin: 203px 203px;
  -ms-transform-origin: 203px 203px;
  -o-transform-origin: 203px 203px;
  transform-origin: 203px 203px;
  margin: 0;
}

/* line 2, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p90 {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/90-active.svg");
}

/* line 4, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p90.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/90-inactive.svg");
}

/* line 9, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180 {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-active2.svg");
}

/* line 11, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-inactive2.svg");
}

/* line 14, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180.highlight {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-activehighlight2.svg");
}

/* line 19, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_mirror {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-doubleactive2.svg");
}

/* line 21, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_mirror.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-doubleinactive2.svg");
}

/* line 24, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_mirror.highlight {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-doubleactivehighlight2.svg");
}

/* line 29, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p360 {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/360-active2.svg");
}

/* line 31, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p360.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/360-inactive2.svg");
}

/* line 34, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p360.highlight {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/360-activehighlight2.svg");
}

/* line 39, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p4_quadrants {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/4quadrants-active.svg");
}

/* line 41, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p4_quadrants.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/4quadrants-inactive.svg");
}

/* line 46, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p8_quadrants {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/8quadrants-active.svg");
}

/* line 48, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p8_quadrants.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/8quadrants-inactive.svg");
}

/* line 53, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_outer {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-outer-highlight-active2.svg");
}

/* line 55, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_outer.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-outer-highlight2.svg");
}

/* line 58, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_outer.highlight {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-outer-highlight-highlight2.svg");
}

/* line 63, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_inner {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-inner-highlight-active2.svg");
}

/* line 65, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_inner.inactive {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-inner-highlight2.svg");
}

/* line 68, app/assets/stylesheets/shared/tasks/_protractor.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180_inner.highlight {
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor/180-inner-highlight-highlight2.svg");
}

/* line 94, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p180, .protractor-angle-creation-2017 .protractor-area .protractor-img.p180_mirror {
  height: 216px;
}

/* line 97, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .protractor-img.p90 {
  background-size: 206px;
  width: 203px;
  height: 206px;
  left: 203px;
  -webkit-transform-origin: 0 203px;
  -moz-transform-origin: 0 203px;
  -ms-transform-origin: 0 203px;
  -o-transform-origin: 0 203px;
  transform-origin: 0 203px;
  margin-right: 203px;
}

/* line 107, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray-wrap {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
}

/* line 116, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray {
  width: 284px;
  height: 30px;
  position: absolute;
  top: 188px;
  left: 203px;
  -webkit-transform-origin: 0px 15px;
  -moz-transform-origin: 0px 15px;
  -ms-transform-origin: 0px 15px;
  -o-transform-origin: 0px 15px;
  transform-origin: 0px 15px;
}

/* line 123, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray path {
  fill: #303b40;
}

/* line 126, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.moveable, .protractor-angle-creation-2017 .protractor-area .ray.try-again {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/tasks/protractor_2017/rays3.svg");
  background-size: 284px 120px;
}

/* line 128, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.moveable .inline-ray-svg, .protractor-angle-creation-2017 .protractor-area .ray.try-again .inline-ray-svg {
  display: none;
}

/* line 136, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.moveable {
  background-position: 0px -30px;
}

/* line 139, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.try-again {
  background-position: 0px -60px;
}

/* line 143, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.incorrect:not(.autocorrect-animation):not(.autocorrect) path {
  fill: #ff4d76;
}

/* line 146, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.correctable path {
  cursor: pointer;
}

/* line 149, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.incorrect.autocorrect-animation path {
  opacity: 0;
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
}

/* line 153, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.incorrect.autocorrect path {
  opacity: 1;
  fill: black;
  -webkit-transition: all 1200ms;
  -moz-transition: all 1200ms;
  -ms-transition: all 1200ms;
  -o-transition: all 1200ms;
  transition: all 1200ms;
}

@-webkit-keyframes correctRay {
  0%, 88% {
    fill: #00c372;
  }
  100% {
    fill: #303b40;
  }
}

@-moz-keyframes correctRay {
  0%, 88% {
    fill: #00c372;
  }
  100% {
    fill: #303b40;
  }
}

@-o-keyframes correctRay {
  0%, 88% {
    fill: #00c372;
  }
  100% {
    fill: #303b40;
  }
}

@keyframes correctRay {
  0%, 88% {
    fill: #00c372;
  }
  100% {
    fill: #303b40;
  }
}

/* line 168, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray.correct path {
  -webkit-animation: correctRay 1700ms linear;
  -moz-animation: correctRay 1700ms linear;
  -ms-animation: correctRay 1700ms linear;
  -o-animation: correctRay 1700ms linear;
  animation: correctRay 1700ms linear;
}

/* line 172, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .protractor-area .ray-dot {
  position: absolute;
  width: 10px;
  height: 10px;
  background: #354359;
  top: 198px;
  left: 198px;
  border-radius: 10px;
}

/* line 182, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad {
  position: absolute;
  z-index: 2;
  top: -24px;
  left: -24px;
  padding: 0;
  width: 454px;
  height: 454px;
  -webkit-transform-origin: 227px 227px;
  -moz-transform-origin: 227px 227px;
  -ms-transform-origin: 227px 227px;
  -o-transform-origin: 227px 227px;
  transform-origin: 227px 227px;
}

/* line 196, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.p180, .protractor-angle-creation-2017 .geometry-pad.p180_mirror {
  height: 240px;
}

/* line 199, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.p90 {
  width: 227px;
  height: 227px;
  left: 227px;
  -webkit-transform-origin: 0 227px;
  -moz-transform-origin: 0 227px;
  -ms-transform-origin: 0 227px;
  -o-transform-origin: 0 227px;
  transform-origin: 0 227px;
}

/* line 205, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad .geometry-canvas {
  width: 100%;
  height: 100%;
}

/* line 209, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad .geometry-canvas .geometry-arc {
  stroke: #303b40;
  stroke-width: 3px;
}

/* line 214, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad .geometry-canvas .circular-sector {
  opacity: 0;
}

@-webkit-keyframes circularSectorFadeout {
  0%, 88% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes circularSectorFadeout {
  0%, 88% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes circularSectorFadeout {
  0%, 88% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

@keyframes circularSectorFadeout {
  0%, 88% {
    opacity: 0.3;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes correctStrokeFadeout {
  0%, 88% {
    stroke: #00c372;
  }
  100% {
    stroke: #303b40;
  }
}

@-moz-keyframes correctStrokeFadeout {
  0%, 88% {
    stroke: #00c372;
  }
  100% {
    stroke: #303b40;
  }
}

@-o-keyframes correctStrokeFadeout {
  0%, 88% {
    stroke: #00c372;
  }
  100% {
    stroke: #303b40;
  }
}

@keyframes correctStrokeFadeout {
  0%, 88% {
    stroke: #00c372;
  }
  100% {
    stroke: #303b40;
  }
}

/* line 235, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.correct .geometry-canvas .circular-sector {
  -webkit-animation: circularSectorFadeout 1700ms linear;
  -moz-animation: circularSectorFadeout 1700ms linear;
  -ms-animation: circularSectorFadeout 1700ms linear;
  -o-animation: circularSectorFadeout 1700ms linear;
  animation: circularSectorFadeout 1700ms linear;
  fill: #ccffd9;
}

/* line 239, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.correct .geometry-canvas .geometry-arc {
  stroke: #303b40;
  -webkit-animation: correctStrokeFadeout 1700ms linear;
  -moz-animation: correctStrokeFadeout 1700ms linear;
  -ms-animation: correctStrokeFadeout 1700ms linear;
  -o-animation: correctStrokeFadeout 1700ms linear;
  animation: correctStrokeFadeout 1700ms linear;
}

/* line 246, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect:not(.correctable):not(.autocorrect-animation):not(.autocorrect) .geometry-canvas .circular-sector {
  fill: #fea5ba;
  opacity: 0.3;
}

/* line 250, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect:not(.correctable):not(.autocorrect-animation):not(.autocorrect) .geometry-canvas .geometry-arc {
  opacity: 0;
}

/* line 255, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.correctable .geometry-canvas .circular-sector {
  fill: #fea5ba;
  opacity: 0.3;
}

/* line 259, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.correctable .geometry-canvas .geometry-arc {
  opacity: 0;
}

/* line 264, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.autocorrect-animation .geometry-canvas .circular-sector {
  opacity: 0;
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
}

/* line 268, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.autocorrect-animation .geometry-canvas .geometry-arc {
  opacity: 0;
}

/* line 273, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.autocorrect .geometry-canvas .circular-sector {
  opacity: 0;
}

/* line 276, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect.autocorrect .geometry-canvas .geometry-arc {
  opacity: 1;
  -webkit-transition: all 1200ms;
  -moz-transition: all 1200ms;
  -ms-transition: all 1200ms;
  -o-transition: all 1200ms;
  transition: all 1200ms;
}

/* line 281, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017 .geometry-pad.incorrect:not(.correctable):not(.autocorrect):not(.autocorrect-animation) .geometry-canvas {
  -webkit-animation: circularSectorFadeout 1700ms linear;
  -moz-animation: circularSectorFadeout 1700ms linear;
  -ms-animation: circularSectorFadeout 1700ms linear;
  -o-animation: circularSectorFadeout 1700ms linear;
  animation: circularSectorFadeout 1700ms linear;
}

/* line 287, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017.active-task.moveable .ray-controls span {
  cursor: pointer;
}

/* line 291, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017.active-task.moveable .protractor-area .ray.moveable, .protractor-angle-creation-2017.active-task.moveable .protractor-area .ray.try-again {
  cursor: pointer;
}

/* line 296, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017.active-task.moveable .geometry-pad .geometry-canvas .geometry-arc {
  stroke: #007b94;
}

/* line 301, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017.active-task.moveable .geometry-pad.try-again .geometry-canvas .circular-sector {
  fill: #fea5ba;
  opacity: 0.3;
}

/* line 305, app/assets/stylesheets/shared/tasks/protractor_angle_creation_2017.scss */
.protractor-angle-creation-2017.active-task.moveable .geometry-pad.try-again .geometry-canvas .geometry-arc {
  stroke: #ff4d76;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation .geometry-pad .angle-group .click-zone {
  fill: transparent;
}

/* line 13, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation .geometry-pad .angle-group .right-angle-line, .right-angle-annotation .geometry-pad .angle-group .edge-line {
  display: none;
  stroke: #000;
  stroke-width: 4px;
}

/* line 18, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation .geometry-pad .angle-group .edge-line {
  stroke-width: 4px;
}

/* line 22, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation .geometry-pad .angle-group.selected .right-angle-line, .right-angle-annotation .geometry-pad .angle-group.selected .edge-line, .right-angle-annotation .geometry-pad .angle-group.prepop .right-angle-line, .right-angle-annotation .geometry-pad .angle-group.prepop .edge-line {
  display: block;
}

/* line 27, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation .geometry-pad .angle-group.selected .right-angle-line, .right-angle-annotation .geometry-pad .angle-group.selected .edge-line {
  stroke: #156abb;
}

/* line 36, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation.active-task .geometry-pad .angle-group:not(.prepop) .click-zone {
  cursor: pointer;
}

/* line 40, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation.active-task .geometry-pad .angle-group.hover:not(.prepop):not(.selected):not(.prepop) .right-angle-line, .right-angle-annotation.active-task .geometry-pad .angle-group.hover:not(.prepop):not(.selected):not(.prepop) .edge-line {
  display: block;
  stroke: #0097b6;
}

/* line 46, app/assets/stylesheets/shared/tasks/right_angle_annotation.scss */
.right-angle-annotation.active-task .geometry-pad.max-selected .angle-group:not(.selected) .click-zone {
  cursor: default;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-title {
  font-size: 22px;
  margin-bottom: 10px;
  max-width: 430px;
}

/* line 10, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-block {
  display: inline-block;
  margin-left: 20px;
  margin-right: 20px;
}

/* line 15, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-block .zearn-button {
  width: 200px;
}

/* line 18, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-block .zearn-button.hidden {
  visibility: hidden;
}

/* line 24, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .zearn-button {
  padding: 7px 25px;
}

/* line 28, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-image-box {
  position: relative;
  width: 316px;
  height: 316px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10px;
}

/* line 35, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-image-box.hovered {
  cursor: pointer;
}

/* line 38, app/assets/stylesheets/shared/tasks/spinner.scss */
.spinner .spinner-image-box img {
  position: absolute;
  top: 0px;
  left: 0px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/super_label_a_product.scss */
.super-label-a-product.super-label-a-thing .tiles-repo {
  margin-top: 20px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 11, app/assets/stylesheets/shared/tasks/super_label_a_product.scss */
.super-label-a-product.super-label-a-thing .tile-destination-slot {
  margin-left: 10px;
}

/* line 16, app/assets/stylesheets/shared/tasks/super_label_a_product.scss */
.super-label-a-product.super-label-a-thing .correct-answer {
  text-align: left;
  font-size: 20px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 7px 9px 9px 9px;
  z-index: 3;
  white-space: nowrap;
  border-radius: 4px;
  box-shadow: 0 0 5px 0 #4d4d4d;
  position: relative;
  background-color: white;
  cursor: pointer;
  font-weight: 400;
}

/* line 21, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile .token {
  white-space: nowrap;
}

/* line 25, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.hidden {
  display: none;
}

/* line 30, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.incorrect.correctable, .super-label-a-thing .tile.incorrect-tile.correctable {
  -webkit-animation: multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white 200ms linear;
  -moz-animation: multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white 200ms linear;
  -ms-animation: multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white 200ms linear;
  -o-animation: multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white 200ms linear;
  animation: multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white {
  0% {
    background-color: white;
    box-shadow: inset 0 0 0 4px #0097b6;
    color: black;
  }
  100% {
    background-color: #ff4d76;
    box-shadow: none;
    color: white;
  }
}

@-moz-keyframes multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white {
  0% {
    background-color: white;
    box-shadow: inset 0 0 0 4px #0097b6;
    color: black;
  }
  100% {
    background-color: #ff4d76;
    box-shadow: none;
    color: white;
  }
}

@-o-keyframes multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white {
  0% {
    background-color: white;
    box-shadow: inset 0 0 0 4px #0097b6;
    color: black;
  }
  100% {
    background-color: #ff4d76;
    box-shadow: none;
    color: white;
  }
}

@keyframes multi-animation-animation-background-color-white-ff4d76-animation-box-shadow-inset_0_0_0_4px_0097b6-none-animation-color-black-white {
  0% {
    background-color: white;
    box-shadow: inset 0 0 0 4px #0097b6;
    color: black;
  }
  100% {
    background-color: #ff4d76;
    box-shadow: none;
    color: white;
  }
}

/* line 39, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.ghost {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: .3;
  z-index: 1;
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.underneath {
  position: absolute;
  background-color: white;
  cursor: default;
}

/* line 55, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.correct-answer {
  white-space: nowrap;
  border-radius: 3px;
  box-shadow: none;
  background-color: transparent;
}

/* line 61, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.correct-answer.hidden {
  display: none;
}

/* line 66, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile.impression {
  background-color: #e4e4e4;
  box-shadow: none;
  color: #b3b3b3;
  cursor: default;
}

/* line 79, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .destination-box .tile:not(.hidden) {
  line-height: normal;
  text-align: center;
}

/* line 83, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .destination-box .tile.prepopulated:not(.hidden) {
  background-color: transparent;
  box-shadow: none;
}

/* line 88, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .destination-box .tile:not(.hidden) .token {
  white-space: nowrap;
}

/* line 91, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .destination-box .tile:not(.hidden) .token .token {
  white-space: normal;
}

/* line 94, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .destination-box .tile:not(.hidden) .nowrap-bundle {
  display: inline-block;
}

/* line 101, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot .tile {
  box-shadow: 0 0 5px 0 #4d4d4d, inset 0 0 0 2px #0097b6;
}

/* line 105, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot .tile.autocorrected {
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
}

/* line 114, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot:not(.prepopulated):not(.autocorrected) .tile.try-again {
  background-color: #ffe6ee;
  box-shadow: inset 0 0 0 4px #ff4d76;
  cursor: pointer;
  transition: 1s;
}

/* line 123, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot.incorrect-no-autocorrect:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-thing .tile-destination-slot.incorrect:not(.prepopulated):not(.autocorrected):not(.correctable) .tile {
  cursor: default;
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 {
  0% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  83% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
    color: #ff4d76;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 {
  0% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  83% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
    color: #ff4d76;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 {
  0% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  83% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
    color: #ff4d76;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-transparent-animation-box-shadow-inset_0_0_0_4px_ff4d76-none-animation-color-black-ff4d76 {
  0% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  83% {
    background-color: #ffe6ee;
    box-shadow: inset 0 0 0 4px #ff4d76;
    color: black;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
    color: #ff4d76;
  }
}

/* line 134, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot.correct:not(.prepopulated):not(.autocorrected) .tile, .super-label-a-thing .tile-destination-slot.correct-tile:not(.prepopulated):not(.autocorrected) .tile {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none {
  0% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  83% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none {
  0% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  83% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none {
  0% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  83% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-box-shadow-inset_0_0_0_4px_00c372-none {
  0% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  83% {
    background-color: #ccffd9;
    box-shadow: inset 0 0 0 4px #00c372;
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}

/* line 141, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot.disabled:not(.prepopulated):not(.autocorrected) {
  box-shadow: none;
  cursor: default;
}

/* line 147, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tile-destination-slot .hidden, .super-label-a-thing .tile-destination-slot .tile.hidden {
  display: none;
}

/* line 154, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing:not(.touch) .tile:not(.underneath):not(.impression):not(.incorrect):not(.disabled):not(.prepopulated):not(.correctable):not(.try-again):not(.correct-tile):not(.correct):not(.ghost):not(.underneath):hover {
  box-shadow: 0 0 5px 0 #4d4d4d, inset 0 0 0 4px #0097b6;
}

/* line 160, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing:not(.touch) .smooth-dnd-ghost .tile {
  box-shadow: 0 0 5px 0 #4d4d4d, inset 0 0 0 4px #0097b6;
}

/* line 164, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing:not(.touch) .tile:not(.underneath):not(.impression):not(.inncorrect):not(.disabled):not(.prepopulated):not(.correct-tile):not(.correct):not(.ghost):not(.underneath) {
  cursor: pointer;
}

/* line 168, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing:not(.touch) .tiles-repo.disable-hover, .super-label-a-thing:not(.touch) .tile:hover {
  cursor: default;
}

/* line 173, app/assets/stylesheets/shared/tasks/_tile_mixin.scss */
.super-label-a-thing .tiles-repo .tile-origin-slot {
  display: inline-block;
  vertical-align: middle;
  margin: 3px;
  position: relative;
  box-sizing: border-box;
}

/* line 4, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .sortable-ghost {
  display: none;
}

/* line 8, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot {
  border-radius: 4px;
}

/* line 11, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot.active {
  box-shadow: inset 0 0 0 4px #0097b6;
  background-color: #f3fdff;
}

/* line 16, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot.active .tile {
  box-shadow: 0 0 5px 0 #4d4d4d, inset 0 0 0 4px #0097b6;
}

/* line 24, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing:not(.touch) .tile-destination-slot:not(.prepopulated):not(.autocorrected):not(.disabled):not(.active):not(.incorrect-tile):not(.incorrect):not(.correct-tile):not(.correct) {
  cursor: pointer;
}

/* line 31, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot:not(.correct-tile):not(.ui-droppable-disabled):not(.prepopulated):not(.autocorrected):not(.correct):not(.active):not(.disabled) {
  box-shadow: inset 0 0 0 2px #808080;
  background-color: #f3fdff;
}

/* line 35, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot:not(.correct-tile):not(.ui-droppable-disabled):not(.prepopulated):not(.autocorrected):not(.correct):not(.active):not(.disabled):not(.filled):hover {
  box-shadow: inset 0 0 0 4px #808080;
  background-color: #ccffff;
}

/* line 40, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot.jiggle:not(.correct-tile):not(.ui-droppable-disabled):not(.prepopulated):not(.autocorrected):not(.correct) {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 45, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tile-destination-slot.autocorrected {
  background-color: transparent;
  border-color: transparent;
}

/* line 51, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing.super-label-a-sentence .tile-destination-slot, .super-label-a-thing.super-label-an-expression .tile-destination-slot {
  display: inline-block;
  margin-bottom: 1px;
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/_tile_slot_mixin.scss */
.super-label-a-thing .tiles-repo .tile-origin-slot {
  display: inline-block;
  vertical-align: middle;
  margin: 3px;
  position: relative;
  box-sizing: border-box;
}

/* line 20, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .tiles-repo {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  min-height: 80px;
  padding: 10px 0;
  margin: 0 auto;
}

/* line 26, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .tiles-repo.hidden-repo {
  opacity: 0;
  transition: 1s;
}

/* line 33, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .image-place .tile:not(.hidden), .super-label-a-thing .destination-box .tile:not(.hidden) {
  line-height: normal;
}

/* line 36, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .image-place .tile.prepopulated:not(.hidden), .super-label-a-thing .destination-box .tile.prepopulated:not(.hidden) {
  box-shadow: none;
}

/* line 44, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .correct-answer {
  display: flex;
  justify-content: center;
  align-items: center;
  white-space: nowrap;
  border-radius: 3px;
  vertical-align: middle;
  border-color: transparent;
  background-color: transparent;
}

/* line 54, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .correct-answer.hidden {
  display: none;
}

/* line 64, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .inline-number-bond .part1-node .token.token-text, .super-label-a-thing .inline-number-bond .part2-node .token.token-text {
  line-height: 7px;
}

/* line 67, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .inline-number-bond .part1-node .token.fraction, .super-label-a-thing .inline-number-bond .part2-node .token.fraction {
  margin-bottom: 3px;
}

/* line 69, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .inline-number-bond .part1-node .token.fraction .token-text, .super-label-a-thing .inline-number-bond .part2-node .token.fraction .token-text {
  line-height: normal;
}

/* line 82, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing.active.task:not(.touch) .tiles-repo.disable-hover, .super-label-a-thing.active-task:not(.touch) .tiles-repo.disable-hover {
  cursor: default;
}

/* line 90, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .arrow-way-jump .token-text {
  line-height: 75px;
}

/* line 93, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-thing .arrow-way-jump .token .token-text {
  line-height: normal;
}

/* line 99, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image {
  font-size: 16px;
}

/* line 102, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image .tile-destination-slot, .super-label-an-image .prepop-label {
  position: absolute;
}

/* line 105, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image .prepop-label {
  transform: translate(-50%, 50%);
}

/* line 108, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image .has-image .tile {
  padding: 5px;
  line-height: 0;
}

/* line 113, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image .image-place .image-background {
  position: relative;
  display: inline-block;
}

/* line 118, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-an-image .destination-box {
  height: 0;
}

/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .super-label-a-sentence, body:not(.g6plus) .super-label-an-expression {
  font-size: 25px;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .super-label-a-sentence, body.g6plus .super-label-an-expression {
  font-size: 24px;
}

/* line 126, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box, .super-label-an-expression .destination-box {
  margin: 8px 0;
}

/* line 129, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box .vert-number-line-token-nowrap, .super-label-an-expression .destination-box .vert-number-line-token-nowrap {
  display: inline-block;
}

/* line 132, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box .nowrap-bundle, .super-label-an-expression .destination-box .nowrap-bundle {
  display: inline;
}

/* line 134, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box .nowrap-bundle .trailer:empty, .super-label-an-expression .destination-box .nowrap-bundle .trailer:empty {
  display: none;
}

/* line 138, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box .fraction.token, .super-label-an-expression .destination-box .fraction.token {
  line-height: initial;
}

/* line 145, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box {
  display: inline-block;
}

/* line 148, app/assets/stylesheets/shared/tasks/super_label_a_thing.scss */
.super-label-a-sentence .destination-box-inner {
  display: inline;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot {
  position: relative;
  min-height: 60px;
  min-width: 150px;
  box-shadow: inset 0 0 0 3px;
}

/* line 13, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.top {
  border-radius: 10px 10px 0 0;
}

/* line 15, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.top .item {
  border-radius: 10px 10px 0 0;
}

/* line 18, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.right {
  border-radius: 0 10px 10px 0;
}

/* line 20, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.right .match, .super-matching-slot.right .slot-button {
  border-radius: 0 10px 10px 0;
}

/* line 23, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.bottom {
  border-radius: 0 0 10px 10px;
}

/* line 25, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.bottom .match, .super-matching-slot.bottom .slot-button {
  border-radius: 0 0 10px 10px;
}

/* line 28, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.left {
  border-radius: 10px 0 0 10px;
}

/* line 30, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.left .item {
  border-radius: 10px 0 0 10px;
}

/* line 33, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match-pair-item-slot, .super-matching-slot.match-pair-match-slot {
  background-color: white;
  color: #808080;
}

/* line 38, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match-pair-match-slot.active {
  background-color: #f0f5f7;
  color: #0097b6;
}

/* line 42, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match-pair-match-slot.active:hover {
  color: #007b94;
}

/* line 46, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match-pair-match-slot.active.selected {
  background-color: #ccffff;
  box-shadow: none;
  border: 3px dotted #0097b6;
}

/* line 53, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match, .super-matching-slot.match-slot {
  background-color: #e4e4e4;
  color: #e4e4e4;
}

/* line 57, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match .item.active, .super-matching-slot.match .match.active, .super-matching-slot.match-slot .item.active, .super-matching-slot.match-slot .match.active {
  box-shadow: 4px 4px 0px #6dddf2;
}

/* line 60, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot.match .item.active:hover, .super-matching-slot.match .match.active:hover, .super-matching-slot.match-slot .item.active:hover, .super-matching-slot.match-slot .match.active:hover {
  box-shadow: 4px 4px 0px #007b94;
}

/* line 66, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper {
  height: 100%;
  width: 100%;
}

/* line 70, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper button.slot-button.manipulatives-button {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  cursor: pointer;
}

/* line 78, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.select-slot-button, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.try-again-button {
  background-color: transparent;
}

/* line 80, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.select-slot-button:hover, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.select-slot-button:focus, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.select-slot-button:active, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.try-again-button:hover, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.try-again-button:focus, .super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.try-again-button:active {
  background-color: transparent;
}

/* line 83, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.mouse-disabled {
  pointer-events: none;
}

/* line 87, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper button.slot-button.manipulatives-button.autocorrect-button {
  font-size: 15px;
  z-index: 2;
}

/* line 93, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper, .super-matching-slot .slot-wrapper .match-wrapper, .super-matching-slot .slot-wrapper .item, .super-matching-slot .slot-wrapper .match {
  height: 100%;
  width: 100%;
}

/* line 98, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper, .super-matching-slot .slot-wrapper .match-wrapper {
  display: flex;
  overflow: visible;
}

/* line 105, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item, .super-matching-slot .slot-wrapper .item-wrapper .match, .super-matching-slot .slot-wrapper .match-wrapper .item, .super-matching-slot .slot-wrapper .match-wrapper .match {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: white;
  border: 3px solid;
  padding: 10px;
  color: #808080;
}

/* line 115, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item.active, .super-matching-slot .slot-wrapper .item-wrapper .match.active, .super-matching-slot .slot-wrapper .match-wrapper .item.active, .super-matching-slot .slot-wrapper .match-wrapper .match.active {
  cursor: pointer;
  color: #0097b6;
}

/* line 119, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item.active:hover, .super-matching-slot .slot-wrapper .item-wrapper .match.active:hover, .super-matching-slot .slot-wrapper .match-wrapper .item.active:hover, .super-matching-slot .slot-wrapper .match-wrapper .match.active:hover {
  color: #007b94;
}

/* line 124, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item.correct, .super-matching-slot .slot-wrapper .item-wrapper .match.correct, .super-matching-slot .slot-wrapper .match-wrapper .item.correct, .super-matching-slot .slot-wrapper .match-wrapper .match.correct {
  -webkit-animation: animation-color-00c372-808080 1200ms linear;
  -moz-animation: animation-color-00c372-808080 1200ms linear;
  -ms-animation: animation-color-00c372-808080 1200ms linear;
  -o-animation: animation-color-00c372-808080 1200ms linear;
  animation: animation-color-00c372-808080 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-00c372-808080 {
  0% {
    color: #00c372;
  }
  83% {
    color: #00c372;
  }
  100% {
    color: #808080;
  }
}

@-moz-keyframes animation-color-00c372-808080 {
  0% {
    color: #00c372;
  }
  83% {
    color: #00c372;
  }
  100% {
    color: #808080;
  }
}

@-o-keyframes animation-color-00c372-808080 {
  0% {
    color: #00c372;
  }
  83% {
    color: #00c372;
  }
  100% {
    color: #808080;
  }
}

@keyframes animation-color-00c372-808080 {
  0% {
    color: #00c372;
  }
  83% {
    color: #00c372;
  }
  100% {
    color: #808080;
  }
}

/* line 128, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item.try-again, .super-matching-slot .slot-wrapper .item-wrapper .item.incorrect, .super-matching-slot .slot-wrapper .item-wrapper .item.correctable, .super-matching-slot .slot-wrapper .item-wrapper .match.try-again, .super-matching-slot .slot-wrapper .item-wrapper .match.incorrect, .super-matching-slot .slot-wrapper .item-wrapper .match.correctable, .super-matching-slot .slot-wrapper .match-wrapper .item.try-again, .super-matching-slot .slot-wrapper .match-wrapper .item.incorrect, .super-matching-slot .slot-wrapper .match-wrapper .item.correctable, .super-matching-slot .slot-wrapper .match-wrapper .match.try-again, .super-matching-slot .slot-wrapper .match-wrapper .match.incorrect, .super-matching-slot .slot-wrapper .match-wrapper .match.correctable {
  color: #ff0d5e;
}

/* line 132, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item .item-image, .super-matching-slot .slot-wrapper .item-wrapper .item .match-image, .super-matching-slot .slot-wrapper .item-wrapper .match .item-image, .super-matching-slot .slot-wrapper .item-wrapper .match .match-image, .super-matching-slot .slot-wrapper .match-wrapper .item .item-image, .super-matching-slot .slot-wrapper .match-wrapper .item .match-image, .super-matching-slot .slot-wrapper .match-wrapper .match .item-image, .super-matching-slot .slot-wrapper .match-wrapper .match .match-image {
  pointer-events: none;
  max-width: 100%;
}

/* line 137, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item .item-label, .super-matching-slot .slot-wrapper .item-wrapper .item .match-label, .super-matching-slot .slot-wrapper .item-wrapper .match .item-label, .super-matching-slot .slot-wrapper .item-wrapper .match .match-label, .super-matching-slot .slot-wrapper .match-wrapper .item .item-label, .super-matching-slot .slot-wrapper .match-wrapper .item .match-label, .super-matching-slot .slot-wrapper .match-wrapper .match .item-label, .super-matching-slot .slot-wrapper .match-wrapper .match .match-label {
  color: black;
}

/* line 142, app/assets/stylesheets/shared/tasks/super_matching_slot.scss */
.super-matching-slot .slot-wrapper .item-wrapper .item .item-label img, .super-matching-slot .slot-wrapper .item-wrapper .item .match-label img, .super-matching-slot .slot-wrapper .item-wrapper .match .item-label img, .super-matching-slot .slot-wrapper .item-wrapper .match .match-label img, .super-matching-slot .slot-wrapper .match-wrapper .item .item-label img, .super-matching-slot .slot-wrapper .match-wrapper .item .match-label img, .super-matching-slot .slot-wrapper .match-wrapper .match .item-label img, .super-matching-slot .slot-wrapper .match-wrapper .match .match-label img {
  max-width: 100%;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .tile, .super-number-bond-tiles .tile.ui-draggable-dragging, .super-number-bond-tiles .correct-answer {
  font-size: 18px;
}

/* line 7, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .enter-button {
  margin-top: 10px;
}

/* line 11, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .whole-node.correct, .super-number-bond-tiles .whole-node.incorrect, .super-number-bond-tiles .part-node.correct, .super-number-bond-tiles .part-node.incorrect {
  background-color: white;
  border: 2px solid #4d4d4d;
}

/* line 14, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .whole-node.correct .tile-destination-slot, .super-number-bond-tiles .whole-node.correct .tile, .super-number-bond-tiles .whole-node.incorrect .tile-destination-slot, .super-number-bond-tiles .whole-node.incorrect .tile, .super-number-bond-tiles .part-node.correct .tile-destination-slot, .super-number-bond-tiles .part-node.correct .tile, .super-number-bond-tiles .part-node.incorrect .tile-destination-slot, .super-number-bond-tiles .part-node.incorrect .tile {
  border-color: transparent;
  background-color: transparent;
  box-shadow: none;
}

/* line 21, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .tiles-repo {
  margin-top: 10px;
}

/* line 24, app/assets/stylesheets/shared/tasks/super_number_bond_tiles.scss */
.super-number-bond-tiles .tile-destination-slot.autocorrected {
  border: 3px solid transparent;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget {
  display: inline-block;
}

/* line 12, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons {
  background-color: #f0f5f7;
}

/* line 14, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons button {
  display: inline-block;
  position: relative;
  margin: 10px 0;
}

/* line 19, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons button:not(:first-child) {
  margin-left: 10px;
}

/* line 22, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons button:disabled {
  background-color: #cccccc;
}

/* line 26, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons button svg {
  width: 16px;
  height: 16px;
  position: absolute;
  top: 7px;
  left: 7px;
}

/* line 32, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-row-buttons button svg line {
  stroke: white;
  stroke-width: 3;
  stroke-linecap: round;
  fill: none;
}

/* line 41, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap {
  position: relative;
}

/* line 43, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap .spvc-grading {
  display: none;
  position: absolute;
  border: 3px solid transparent;
  z-index: 15;
}

/* line 49, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap.incorrect, .super-place-value-chart-algorithm .spvc-algo-wrap.correct {
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 51, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap.incorrect .spvc-grading, .super-place-value-chart-algorithm .spvc-algo-wrap.correct .spvc-grading {
  display: block;
}

/* line 54, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap.incorrect .super-place-value-chart-widget .super-pvc .super-pvc-header .decimal, .super-place-value-chart-algorithm .spvc-algo-wrap.correct .super-place-value-chart-widget .super-pvc .super-pvc-header .decimal {
  z-index: 16;
}

/* line 58, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap.incorrect .spvc-grading {
  border-color: #ff4d76;
}

/* line 61, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .spvc-algo-wrap.correct:not(.done) .spvc-grading {
  border-color: #00c372;
}

/* line 67, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .super-place-value-chart-widget .super-pvc-cells.ghost .super-pvc-cell {
  border-style: dashed;
  border-width: 1px;
  border-top-color: transparent;
}

/* line 71, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .super-place-value-chart-widget .super-pvc-cells.ghost .super-pvc-cell:not(:first-child) {
  border-left-color: transparent;
}

/* line 74, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .super-place-value-chart-widget .super-pvc-cells.ghost .super-pvc-cell:not(:last-child) {
  border-right-color: transparent;
}

/* line 78, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm .super-place-value-chart-widget .super-pvc-cells.ghost .super-pvc-slot-group {
  visibility: hidden;
}

/* line 85, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.active-task .spvc-algo-wrap.try-again.incorrect .spvc-grading:hover {
  cursor: pointer;
}

/* line 96, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget.has-graveyard .super-pvc {
  margin-bottom: 20px;
}

/* line 99, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget.display-only .super-pvc-graveyard .slot-item:not(.ghost) {
  opacity: 1;
}

/* line 102, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget.discs.discs-are-coins .slot-item:not(.ghost) {
  background-repeat: no-repeat;
}

/* line 104, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget.discs.discs-are-coins .slot-item.ones:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/super_pvc/penny.svg");
  background-color: #996e17;
}

/* line 108, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget.discs.discs-are-coins .slot-item.tens:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/super_pvc/dime.svg");
  background-color: #829199;
}

/* line 115, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-cell.blue-highlight:not(.correct):not(.incorrect) {
  background: #f3fdff;
}

/* line 118, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-cell:not(.correct):not(.incorrect):not(.blue-highlight) {
  background: white;
}

/* line 124, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-cell.faded .slot-item:not(.ghost) {
  opacity: .2;
}

/* line 128, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard {
  position: relative;
}

/* line 133, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells.highlight {
  outline: 6px solid #fad232;
  margin-bottom: 6px;
}

/* line 139, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells.faded .super-pvc-cell .slot-item:not(.ghost) {
  opacity: .2;
}

/* line 144, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells .super-pvc-cell.highlight .super-pvc-cell-focus, .super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells .super-pvc-cell.highlight-multiple-rows .super-pvc-cell-focus {
  display: block;
}

/* line 148, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells .super-pvc-cell .super-pvc-cell-focus {
  display: none;
  position: absolute;
  top: -5px;
  left: -5px;
  border: 6px solid #fad232;
  width: calc(100% + 2 * 5px);
  height: calc(100% + 2 * 5px);
  z-index: 2;
}

/* line 161, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells:not(.first) .highlight-multiple-rows.super-pvc-cell .super-pvc-cell-focus {
  border-top-width: 0;
}

/* line 164, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells:not(:last-child) .highlight-multiple-rows.super-pvc-cell .super-pvc-cell-focus {
  border-bottom-width: 0;
}

/* line 168, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.super-place-value-chart-division .super-place-value-chart-widget .super-pvc-graveyard .spvc-grading {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* line 178, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.active-task .super-place-value-chart-widget.input-enabled .super-pvc-graveyard .super-pvc-cell:not(.clickable) {
  cursor: default;
}

/* line 181, app/assets/stylesheets/shared/tasks/super_place_value_chart_algorithms.scss */
.super-place-value-chart-algorithm.active-task .super-place-value-chart-widget.input-enabled .super-pvc .super-pvc-cell.correct {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .multiple-choice-task, .super-place-value-chart-comparison .super-multiple-choice-widget {
  width: 100px;
  display: inline-block;
  margin-top: 60px;
}

/* line 10, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .multiple-choice-task .multiple-choice, .super-place-value-chart-comparison .multiple-choice-task .smc-choice, .super-place-value-chart-comparison .super-multiple-choice-widget .multiple-choice, .super-place-value-chart-comparison .super-multiple-choice-widget .smc-choice {
  height: 46px;
}

/* line 13, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .multiple-choice-task .multiple-choice .multiple-choice-inner, .super-place-value-chart-comparison .multiple-choice-task .multiple-choice .smc-choice-inner, .super-place-value-chart-comparison .multiple-choice-task .smc-choice .multiple-choice-inner, .super-place-value-chart-comparison .multiple-choice-task .smc-choice .smc-choice-inner, .super-place-value-chart-comparison .super-multiple-choice-widget .multiple-choice .multiple-choice-inner, .super-place-value-chart-comparison .super-multiple-choice-widget .multiple-choice .smc-choice-inner, .super-place-value-chart-comparison .super-multiple-choice-widget .smc-choice .multiple-choice-inner, .super-place-value-chart-comparison .super-multiple-choice-widget .smc-choice .smc-choice-inner {
  font-weight: bold;
  height: 43px;
}

/* line 16, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .multiple-choice-task .multiple-choice .multiple-choice-inner .token-text, .super-place-value-chart-comparison .multiple-choice-task .multiple-choice .smc-choice-inner .token-text, .super-place-value-chart-comparison .multiple-choice-task .smc-choice .multiple-choice-inner .token-text, .super-place-value-chart-comparison .multiple-choice-task .smc-choice .smc-choice-inner .token-text, .super-place-value-chart-comparison .super-multiple-choice-widget .multiple-choice .multiple-choice-inner .token-text, .super-place-value-chart-comparison .super-multiple-choice-widget .multiple-choice .smc-choice-inner .token-text, .super-place-value-chart-comparison .super-multiple-choice-widget .smc-choice .multiple-choice-inner .token-text, .super-place-value-chart-comparison .super-multiple-choice-widget .smc-choice .smc-choice-inner .token-text {
  padding-bottom: 0;
}

/* line 23, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison.has-labels .multiple-choice-task, .super-place-value-chart-comparison.has-labels .super-multiple-choice-widget {
  margin-top: 100px;
}

/* line 28, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison.is-display-only .multiple-choice-task, .super-place-value-chart-comparison.is-display-only .super-multiple-choice-widget {
  visibility: hidden;
}

/* line 34, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.left, .super-place-value-chart-comparison .super-place-value-chart-widget.right {
  float: none;
  display: inline-block;
  vertical-align: top;
}

/* line 40, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.discs .super-pvc-slot {
  width: 40px;
}

/* line 45, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.discs:not(.has-fast-bundle) .super-pvc-bundle-funnel-cell:nth-child(2) .super-pvc-bundle-funnel {
  left: -90px;
}

/* line 48, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.discs:not(.has-fast-bundle) .super-pvc-bundle-funnel-cell:nth-child(3) .super-pvc-bundle-funnel {
  left: -50px;
}

/* line 55, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.right.discs .super-pvc-bundle-error-wrap {
  min-width: 530px;
  left: -150px;
}

/* line 59, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.right.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-0 .caret {
  left: 190px;
}

/* line 62, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.right.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-1 .caret {
  left: 315px;
}

/* line 65, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.right.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-2 .caret {
  left: 440px;
}

/* line 72, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.left.discs .super-pvc-bundle-error-wrap {
  min-width: 530px;
  left: 0;
}

/* line 76, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.left.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-0 .caret {
  left: 40px;
}

/* line 79, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.left.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-1 .caret {
  left: 165px;
}

/* line 82, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-place-value-chart-widget.left.discs .super-pvc-bundle-error-wrap .super-pvc-bundle-error.col-2 .caret {
  left: 290px;
}

/* line 89, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .enter-button {
  position: relative;
  display: inline-block;
  background-color: #0097b6;
  padding: 4px 10px;
  color: #fff;
  font-weight: 600;
  font-size: 20px;
  border-radius: 20px;
  margin: 8px 0;
  cursor: pointer;
}

/* line 100, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .enter-button .enter-button-inner {
  padding: 5px 10px;
}

/* line 103, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .enter-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 109, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison .super-pvc-reset {
  display: inline-block;
  vertical-align: bottom;
  bottom: 4px;
  right: 3px;
}

/* line 117, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison.active-task .enter-button:not(:disabled) {
  cursor: pointer;
}

/* line 119, app/assets/stylesheets/shared/tasks/super_place_value_chart_comparison.scss */
.super-place-value-chart-comparison.active-task .enter-button:not(:disabled):hover {
  background-color: #007b94;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/tasks/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/tasks/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/tasks/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/tasks/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/tasks/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/tasks/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/tasks/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/tasks/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/tasks/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/tasks/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button, .tape-diagram-difference .td-enter, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .td-enter, .super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .td-enter:hover, .super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .td-enter:active, .super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .hidden.td-enter, .hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .td-enter:disabled, .super-enter-button:disabled, .tape-diagram-difference .disabled.td-enter, .disabled.super-enter-button, .tape-diagram-difference .correct.td-enter, .correct.super-enter-button, .tape-diagram-difference .incorrect.td-enter, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .td-enter:disabled, .super-enter-button:disabled, .tape-diagram-difference .disabled.td-enter, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/tasks/../general/button.scss */
.tape-diagram-difference .inline.td-enter, .inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/tasks/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/tasks/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/tasks/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/tasks/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 7, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 10, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-container {
  position: relative;
  margin: 60px 0 60px 0px;
}

/* line 14, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-label {
  position: absolute;
  left: 0;
  top: 0;
  font-size: 24px;
  height: 60px;
  line-height: 60px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 23, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  height: 60px;
  width: 90%;
  text-align: left;
}

/* line 31, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-shader {
  position: relative;
  display: inline-block;
  white-space: nowrap;
  overflow: visible;
  height: 100%;
  border: 4px solid #8c8c8c;
}

/* line 39, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment .bracket, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference .bracket, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-shader .bracket {
  position: absolute;
  width: 100%;
  top: -30px;
}

/* line 44, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment .combo-label, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference .combo-label, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-shader .combo-label {
  position: absolute;
  top: -70px;
  left: 10px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 51, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment {
  cursor: pointer;
  min-width: 36px;
  z-index: 3;
}

/* line 56, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment:hover:not(.active):not(.prepopulated):not(.correct):not(.incorrect):not(.ui-resizable-disabled) {
  border-color: #007b94;
}

/* line 58, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment:hover:not(.active):not(.prepopulated):not(.correct):not(.incorrect):not(.ui-resizable-disabled) .tape-difference-handle {
  background-color: #007b94;
}

/* line 63, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.active {
  cursor: default;
  border-color: #0097b6;
}

/* line 67, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.active .tape-difference-handle {
  background: #0097b6;
  border-color: #0097b6;
}

/* line 71, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.active .resize-tool {
  display: block;
}

/* line 76, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.not-ready .bracket, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.not-ready .combo-label {
  display: none;
}

/* line 80, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.correct {
  border-color: #00c372;
}

/* line 82, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.correct .combo-label {
  color: #00c372;
}

/* line 86, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.incorrect, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.try-again {
  border-color: #ff4d76;
}

/* line 88, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.incorrect .combo-label, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.try-again .combo-label {
  color: #ff4d76;
}

/* line 92, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.correct, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.incorrect, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.prepopulated, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.ui-resizable-disabled {
  cursor: default;
}

/* line 96, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.has-image.active, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.has-image.correct, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.has-image.incorrect, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-segment.has-image.try-again {
  background: none;
}

/* line 101, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-shader {
  border-color: transparent;
  background: white;
  opacity: 0.8;
}

/* line 106, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference {
  background: #ffffff;
  display: none;
  min-width: 20px;
  z-index: 2;
  cursor: default;
}

/* line 112, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference .tape-difference-handle {
  display: none;
}

/* line 116, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference.correct .combo-label {
  color: #00c372;
}

/* line 121, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference.incorrect .combo-label, .tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-difference.try-again .combo-label {
  color: #ff4d76;
}

/* line 126, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-shader {
  z-index: 1;
}

/* line 129, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-image {
  position: absolute;
  left: 0;
  top: 0;
  height: 60px;
  z-index: 0;
}

/* line 135, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-image.default-box {
  background-color: #f3fdff;
}

/* line 139, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-diagram-inner-text {
  position: absolute;
  top: 0;
  left: 0;
  line-height: 52px;
  width: 100%;
  text-align: center;
}

/* line 148, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-difference-handle {
  position: absolute;
  top: -14px;
  right: -10px;
  width: 20px;
  height: 80px;
  background: #bdbec0;
  border: 4px solid transparent;
  z-index: 1;
  border-radius: 10px;
  cursor: ew-resize;
}

/* line 159, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-segment-wrapper .tape-difference-handle.jiggle {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 165, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .resize-tool {
  display: none;
  position: absolute;
  left: 0;
  bottom: -60px;
}

/* line 172, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference .tape-difference-spacer {
  width: 100%;
  height: 1px;
}

/* line 184, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.tape-diagram-difference:not(.active-task) .tape-difference-segment-wrapper .tape-diagram-segment, .tape-diagram-difference:not(.active-task) .tape-difference-segment-wrapper .tape-difference-handle {
  cursor: default;
}

/* line 192, app/assets/stylesheets/shared/tasks/tape_diagram_difference.scss */
.towers .tape-difference-segment-wrapper .tape-diagram-difference, .towers .tape-difference-segment-wrapper .tape-diagram-shader {
  background: #ffffff;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 28, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin: 0;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/tasks/../general/discs.scss */
.tape-diagram-discs.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 10, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.display-only .super-operational-buttons {
  display: none;
}

/* line 14, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs:not(.display-only) .td-table {
  background-color: #f3fdff;
}

/* line 17, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs:not(.display-only) .td-table .td-cell:not(.selected):not(.correct):not(.incorrect) {
  cursor: pointer;
}

/* line 23, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-wrap {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 28, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .super-operational-buttons.align-bottom {
  -webkit-box-align: end;
  -webkit-align-self: flex-end;
  -ms-flex-align: end;
  align-self: flex-end;
}

/* line 31, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .super-operational-buttons.align-top {
  -webkit-box-align: start;
  -webkit-align-self: flex-start;
  -ms-flex-align: start;
  align-self: flex-start;
}

/* line 36, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-control {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 10px 0;
}

/* line 40, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-control .tdd-control-icon, .tape-diagram-discs .tdd-control .qty-button {
  display: inline-block;
}

/* line 43, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-control .tdd-control-icon {
  margin: 3px 10px;
}

/* line 48, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token {
  width: 610px;
}

/* line 51, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-table {
  height: 100px;
}

/* line 54, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell {
  border-color: #4d4d4d;
  border-right-width: 4px;
}

/* line 57, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell:not(:first-child) {
  border-left-width: 0;
}

/* line 61, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell.selected .td-cell-inner {
  outline: 5px solid #0097b6;
}

/* line 65, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell.try-again, .tape-diagram-discs .tape-diagram-token .td-cell.incorrect {
  background-color: #ffe3ee;
}

/* line 68, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell.correct:not(.final) {
  -webkit-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -moz-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -ms-animation: whiteMatBackgroundFlashCorrect 1.5s;
  -o-animation: whiteMatBackgroundFlashCorrect 1.5s;
  animation: whiteMatBackgroundFlashCorrect 1.5s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}

/* line 72, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell.correct.final {
  background-color: white;
}

/* line 76, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell-inner {
  height: 92px;
}

/* line 79, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .td-cell-content {
  width: 100%;
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* line 85, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .exterior-label-inner {
  font-size: 25px;
}

/* line 88, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tape-diagram-token .bracket * {
  border-color: #4d4d4d;
}

/* line 92, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-slot {
  display: inline-block;
}

/* line 94, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .tdd-slot:empty {
  display: none;
}

/* line 98, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .slot-item {
  background-color: #7029a5;
}

/* line 100, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .slot-item.image:not(.ghost) {
  background-color: transparent;
  background-repeat: no-repeat;
  box-shadow: none;
}

/* line 105, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs .slot-item.image.ghost {
  background-size: 0px 0px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-1 .tdd-slot {
  margin: 2px 15px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-2 .tdd-slot {
  margin: 2px 14px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-3 .tdd-slot {
  margin: 2px 15px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-4 .tdd-slot {
  margin: 2px 8px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-5 .tdd-slot {
  margin: 2px 11px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-6 .tdd-slot {
  margin: 2px 6px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-7 .tdd-slot {
  margin: 6px 4px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-8 .tdd-slot {
  margin: 6px 3px;
}

/* line 113, app/assets/stylesheets/shared/tasks/tape_diagram_discs.scss */
.tape-diagram-discs.num-segments-9 .tdd-slot {
  margin: 2px 5px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .task {
  position: relative;
}

/* line 14, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap {
  padding: 20px 0 50px 0;
  margin: 0 auto;
}

/* line 18, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table {
  position: relative;
  min-width: 20px;
  display: block;
}

/* line 23, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-row {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 28, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-cell {
  display: block;
  height: 70px;
  border-color: #0097b6;
}

/* line 33, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-cell:first-child:not(:last-child) {
  border-right-width: 2px;
}

/* line 37, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-cell:last-child {
  flex-grow: 1;
  -webkit-flex-grow: 1;
  flex-grow: 1;
}

/* line 41, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-cell:nth-child(2) {
  border-left-width: 2px;
}

/* line 45, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .td-cell:not(:last-child) {
  border-color: #8c8c8c;
  border-right-color: #0097b6;
}

/* line 51, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .td-table .tdpw-handle {
  position: absolute;
  width: 20px;
  height: 90px;
  right: -16px;
  top: calc(50% - 45px);
  background: #0097b6;
  z-index: 1;
  border-radius: 10px;
  cursor: ew-resize;
}

/* line 64, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .labels {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 52px;
}

/* line 67, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .labels .hide {
  visibility: hidden;
}

/* line 72, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label {
  position: relative;
}

/* line 75, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label .exterior-label-inner {
  font-size: 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 80, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label .exterior-label-inner .token-text {
  vertical-align: baseline;
}

/* line 86, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.bottom .exterior-label-inner {
  position: absolute;
  width: 100%;
}

/* line 91, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.bottom:last-child, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.top {
  -webkit-flex-grow: 1;
  flex-grow: 1;
}

/* line 93, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.bottom:last-child .bracket-container, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.top .bracket-container {
  width: calc(100% - 2px);
}

/* line 97, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.bottom:last-child .exterior-label-inner, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap .exterior-label.top .exterior-label-inner {
  margin: 0 0 0 -1px;
}

/* line 106, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct .td-table .td-cell:last-child {
  border-color: #00c372;
}

/* line 109, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct .td-table .td-cell:not(:last-child) {
  border-right-color: #00c372;
}

/* line 114, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.grade-bottom .labels.bottom .exterior-label:last-child, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.grade-top .labels.top .exterior-label {
  color: #00c372;
}

/* line 120, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.done .td-table .td-cell {
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 122, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.done .td-table .td-cell:last-child {
  border-color: #8c8c8c;
}

/* line 125, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.done .td-table .td-cell:not(:last-child) {
  border-right-color: #8c8c8c;
}

/* line 130, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.done.grade-bottom .labels.bottom .exterior-label:last-child, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct.done.grade-top .labels.top .exterior-label {
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
  color: black;
}

/* line 140, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect:not(.done) .td-table, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect:not(.done) .labels {
  cursor: pointer;
}

/* line 146, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect .td-table .td-cell:last-child {
  border-color: #ff4d76;
}

/* line 149, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect .td-table .td-cell:not(:last-child) {
  border-right-color: #ff4d76;
}

/* line 154, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect.grade-top .labels.top .exterior-label, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect.grade-bottom .labels.bottom .exterior-label:last-child {
  color: #ff4d76;
}

/* line 163, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correctable .td-table .td-cell:last-child {
  background-color: #ff4d76;
  background-size: 0 0;
  color: white;
  font-size: 32px;
  line-height: 62px;
}

/* line 175, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .tape-diagram-token .td-wrap.correct .tdpw-handle, .tape-diagram-part-part-whole .tape-diagram-token .td-wrap.incorrect .tdpw-handle {
  display: none;
}

/* line 182, app/assets/stylesheets/shared/tasks/tape_diagram_part_part_whole.scss */
.tape-diagram-part-part-whole .resize-tool {
  position: absolute;
  bottom: 0px;
  left: 30px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .task {
  position: relative;
  padding-top: 10px;
}

/* line 10, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .hidden {
  display: none;
}

/* line 13, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .combo-label-static-units, .tape-diagram-parts.super-label-a-thing .tile, .tape-diagram-parts.super-label-a-thing .correct-answer {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  text-align: center;
}

/* line 17, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .total-token {
  position: absolute;
}

/* line 19, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .total-token.slotted {
  top: 0;
}

/* line 23, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tiles-repo {
  clear: both;
}

/* line 26, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .bracket-top {
  position: absolute;
  width: 500px;
}

/* line 32, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget.sectioned {
  float: left;
}

/* line 34, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget.sectioned:not(.hidden) {
  display: inline-block;
}

/* line 37, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget.sectioned.hidden {
  display: none;
}

/* line 42, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget .tape-difference-container {
  margin-top: 90px;
}

/* line 45, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget .bracket.bracket-bottom {
  top: 57px;
}

/* line 48, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget .combo-label.sltd-token {
  top: 72px;
}

/* line 51, app/assets/stylesheets/shared/tasks/tape_diagram_parts.scss */
.tape-diagram-parts.super-label-a-thing .tape-diagram-parts-widget.tape-diagram-difference-widget .tape-diagram-shader {
  display: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .tile {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 25px;
}

/* line 15, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task {
  position: relative;
}

/* line 18, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .bracket-container {
  position: relative;
}

/* line 24, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task > .bracket-container {
  position: static;
}

/* line 28, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .bracket.bracket-right {
  position: absolute;
  top: 25px;
}

/* line 33, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .combo-label {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 35, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .combo-label .combo-label-static-num {
  font-size: 25px;
}

/* line 38, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .combo-label .combo-label-static-units {
  font-size: 21px;
}

/* line 43, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .total-token {
  position: absolute;
}

/* line 47, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-difference-container {
  margin: 0 0 25px 0;
}

/* line 52, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-difference-label {
  top: auto;
  bottom: 0;
}

/* line 58, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-difference-segment-wrapper {
  height: 100%;
}

/* line 61, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-difference-segment-wrapper .tape-diagram-segment .bracket, .tape-diagram-difference.tape-diagram-tiles .task .tape-difference-segment-wrapper .tape-diagram-difference .bracket {
  position: relative;
  top: auto;
  margin-bottom: 2px;
}

/* line 66, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-difference-segment-wrapper .tape-diagram-segment .combo-label, .tape-diagram-difference.tape-diagram-tiles .task .tape-difference-segment-wrapper .tape-diagram-difference .combo-label {
  position: relative;
  top: auto;
}

/* line 73, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-segment, .tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-difference {
  border: none;
}

/* line 75, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-segment .tape-diagram-segment-mat, .tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-difference .tape-diagram-segment-mat {
  border: 4px solid #8c8c8c;
  height: 60px;
}

/* line 79, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-segment .combo-label, .tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-difference .combo-label {
  position: relative;
  border: none;
}

/* line 82, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-segment .combo-label .tile-slot.tile-destination-slot.ui-droppable, .tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-difference .combo-label .tile-slot.tile-destination-slot.ui-droppable {
  text-align: center;
  margin-right: -4px;
}

/* line 86, app/assets/stylesheets/shared/tasks/tape_diagram_tiles.scss */
.tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-segment .combo-label.static, .tape-diagram-difference.tape-diagram-tiles .task .tape-diagram-difference .combo-label.static {
  margin-top: 3px;
}
/* line 3, app/assets/stylesheets/shared/tasks/tiles_organized_bank.scss */
.organized-bank {
  display: inline-block;
  margin-bottom: 10px;
  position: relative;
}

/* line 29, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.organized-bank .tile-draggable {
  background: #277fba;
  border: 2px solid #B3B3B3;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* line 10, app/assets/stylesheets/shared/tasks/tiles_organized_bank.scss */
.organized-bank .slot {
  display: inline-block;
  position: relative;
  width: 34px;
  height: 34px;
  float: left;
  margin-right: -2px;
  margin-bottom: -2px;
}

/* line 19, app/assets/stylesheets/shared/tasks/tiles_organized_bank.scss */
.organized-bank .slot .tile-ghost {
  position: absolute;
  width: 100%;
  height: 100%;
  border-color: #B3B3B3;
  border-style: dashed;
  border-width: 3px;
}

/* line 40, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable {
  cursor: pointer;
}

/* line 42, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable:hover {
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset;
}

/* line 45, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable.ui-draggable-dragging {
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset, 3px 3px 13px 0px rgba(0, 0, 0, 0.5);
}
/* line 3, app/assets/stylesheets/shared/tasks/video_task.scss */
.video-task button.continue {
  margin-top: 30px;
  width: 200px;
}
/* line 3, app/assets/stylesheets/shared/try_again.scss */
.try-again-overlay {
  display: none;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-color: white;
  opacity: 0.93;
  z-index: 10;
}

/* line 15, app/assets/stylesheets/shared/try_again.scss */
.try-again-container {
  display: none;
  z-index: 11;
  position: absolute;
  width: 700px;
  left: 50%;
  margin-left: -350px;
  top: 50%;
  margin-top: -35px;
  font-size: 22px;
  font-weight: bold;
  color: #004080;
  cursor: pointer;
}

/* line 30, app/assets/stylesheets/shared/try_again.scss */
.try-again-message {
  vertical-align: middle;
  display: inline-block;
}

/* line 34, app/assets/stylesheets/shared/try_again.scss */
.try-again-icon {
  width: 70px;
  height: 70px;
  display: inline-block;
  vertical-align: middle;
  background: url("//webassets.zearn.org/assets/try_again.png");
}

/* line 42, app/assets/stylesheets/shared/try_again.scss */
.empty .try-again-icon {
  background: url("//webassets.zearn.org/assets/feedback_incorrect.png");
  width: 45px;
  height: 45px;
}
/* line 6, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-popover .trigger {
  outline: none;
}

/* line 11, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip {
  display: block !important;
  z-index: 10000;
}

/* line 15, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip .tooltip-inner {
  background: white;
}

/* line 19, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip .tooltip-arrow {
  width: 10px;
  height: 10px;
  transform: rotate(45deg);
  box-shadow: 0px 0px 6px 4px rgba(0, 0, 0, 0.2);
  background-color: white;
  border-style: solid;
  position: absolute;
  margin: 5px;
  border-color: white;
  z-index: -1;
}

/* line 32, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="top"] {
  margin-bottom: 5px;
}

/* line 35, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="top"] .tooltip-arrow {
  bottom: -5px;
  left: calc(50% - 5px);
  margin-top: 0;
  margin-bottom: 0;
}

/* line 43, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="bottom"] {
  margin-top: 5px;
}

/* line 46, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="bottom"] .tooltip-arrow {
  top: -5px;
  left: calc(50% - 5px);
  margin-top: 0;
  margin-bottom: 0;
}

/* line 54, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="right"] {
  margin-left: 5px;
}

/* line 57, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="right"] .tooltip-arrow {
  left: -5px;
  top: calc(50% - 5px);
  margin-left: 0;
  margin-right: 0;
}

/* line 65, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="left"] {
  margin-right: 5px;
}

/* line 68, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[x-placement^="left"] .tooltip-arrow {
  right: -5px;
  top: calc(50% - 5px);
  margin-left: 0;
  margin-right: 0;
}

/* line 79, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip.popover .popover-inner {
  background: #f9f9f9;
  color: black;
  padding: 24px;
  border-radius: 5px;
}

/* line 86, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip.popover .popover-arrow {
  border-color: #f9f9f9;
}

/* line 91, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[aria-hidden='true'] {
  visibility: hidden;
  opacity: 0;
  transition: opacity .15s, visibility .15s;
}

/* line 97, app/assets/stylesheets/shared/v_tooltip_base.scss */
.v-tooltip[aria-hidden='false'] {
  visibility: visible;
  opacity: 1;
  transition: opacity .15s;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area {
  margin-left: auto;
  margin-right: auto;
  margin-top: 200px;
}

/* line 11, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button {
  border-radius: 30px;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 18px;
}

/* line 17, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn {
  vertical-align: top;
  width: 185px;
  padding: 10px 25px 10px 65px;
  color: #757575;
  background-color: #e1e1e1;
  position: relative;
}

/* line 24, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img {
  position: absolute;
  top: 10px;
  left: 25px;
  width: 28px;
  height: 27px;
  background-image: url("//webassets.zearn.org/app_assets/general/activity/heart-gray.png");
  background-repeat: no-repeat;
}

/* line 32, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img.selected {
  background-image: url("//webassets.zearn.org/app_assets/general/activity/heart-red.png");
}

/* line 38, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn {
  display: inline-block;
  width: 148px;
  padding: 10px 45px;
  color: #fff;
}

/* line 44, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn.disabled {
  background-color: #b3b3b3;
  border-color: #b3b3b3;
  color: #4d4d4d;
  pointer-events: none;
}

/* line 51, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:hover {
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 57, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .done-area {
  vertical-align: top;
  margin-left: 70px;
  text-align: center;
  display: inline-block;
}

/* line 62, app/assets/stylesheets/shared/widgets/activity_complete_buttons.scss */
.activity-complete-buttons .activity-complete-buttons-area .done-area .saving-message {
  width: 148px;
  font-size: 13px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .array-widget .array-vertical-bar.ui-draggable .array-vertical-bar-handle, .array-widget .array-bar.ui-draggable .array-bar-handle, .array-widget .array-grid-cell.no-image .array-cell-image, .array-widget .array-num-cols .array-arrow, .array-widget .array-num-rows .array-arrow {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 3, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget {
  background: #f2f3f3;
  border-radius: 16px;
  position: relative;
  padding-bottom: 25px;
}

/* line 9, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-active-area {
  display: inline-block;
  margin-left: -50px;
}

/* line 14, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-col-button-wrapper {
  margin-left: 50px;
  position: relative;
  height: 50px;
}

/* line 20, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .no-button-wrapper {
  margin-top: 50px;
}

/* line 24, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-under-col-button {
  text-align: left;
}

/* line 28, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-row-button-wrapper {
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 50px;
}

/* line 35, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-button {
  width: 24px;
  height: 24px;
  position: absolute;
}

/* line 39, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-button:active:enabled {
  position: absolute;
}

/* line 42, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-button.transparent {
  opacity: 0;
}

/* line 49, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-col-subtract .math-sign, .array-widget .array-row-subtract .math-sign {
  position: relative;
  top: -1px;
}

/* line 55, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-col-add, .array-widget .array-col-subtract {
  bottom: 2px;
}

/* line 57, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-col-add:active:enabled, .array-widget .array-col-subtract:active:enabled {
  position: absolute;
  top: auto;
}

/* line 63, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-row-add, .array-widget .array-row-subtract {
  right: 2px;
}

/* line 67, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-wrapper {
  position: relative;
  display: inline-block;
  vertical-align: top;
}

/* line 73, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-rows, .array-widget .array-num-cols {
  font-size: 18px;
  font-weight: 700;
  color: #4e2b5b;
  position: absolute;
}

/* line 80, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-rows {
  left: -47px;
  width: 45px;
  text-align: right;
  top: -5px;
}

/* line 86, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-rows .array-arrow {
  display: inline-block;
  margin-left: 2px;
  background-position: -25px 0;
  width: 9px;
  height: 13px;
}

/* line 95, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-rows .array-num-rows-num {
  display: inline-block;
}

/* line 100, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-cols {
  top: -33px;
}

/* line 102, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-cols .array-arrow {
  width: 13px;
  height: 9px;
  background-position: -34px 0;
}

/* line 109, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-num-cols .array-num-cols-num {
  position: relative;
  left: -1px;
}

/* line 115, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid {
  display: table;
  border-collapse: collapse;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 118, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid.rotate {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* line 124, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-row {
  display: table-row;
}

/* line 127, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-row.with-lines:not(:last-of-type) {
  border-bottom: 5px solid #0c91cc;
}

/* line 132, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell {
  display: table-cell;
  width: 34px;
  height: 34px;
}

/* line 137, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.with-lines:not(:last-child) {
  border-right: 5px solid #0c91cc;
}

/* line 141, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell .array-grid-cell-inner {
  position: relative;
  width: 34px;
  height: 34px;
}

/* line 148, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell .array-cell-plus, .array-widget .array-grid-cell .array-cell-minus {
  display: none;
  position: absolute;
  color: #42bfa8;
  background: white;
  font-size: 14px;
  border-radius: 20px;
  line-height: 14px;
  font-weight: 700;
  height: 14px;
  width: 14px;
  top: 10px;
  left: 10px;
  text-align: center;
}

/* line 164, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.drop-hover {
  background-color: #8f90a6;
}

/* line 168, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.sectioned, .array-widget .array-grid-cell.filled.sectioned {
  background-color: #c1d8ed;
}

/* line 172, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell .array-cell-dot {
  position: absolute;
  background: #b3b3b3;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  top: 14px;
  left: 14px;
}

/* line 182, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.no-dot .array-cell-dot {
  display: none;
}

/* line 187, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell .array-cell-image {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 32px;
  height: 32px;
  display: none;
}

/* line 196, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.no-image .array-cell-image {
  background-position: -138px 0;
}

/* line 202, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.filled .array-cell-image {
  display: block;
}

/* line 206, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.filled.highlight-subtract .array-cell-minus, .array-widget .array-grid-cell.filled.clickable:not(.just-added):hover .array-cell-minus {
  display: block;
}

/* line 213, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-widget .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  display: block;
  opacity: 0.5;
}

/* line 217, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-grid-cell.highlight-add:not(.filled) .array-cell-plus, .array-widget .array-grid-cell.clickable:not(.filled):hover .array-cell-plus {
  display: block;
}

/* line 225, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar-container {
  position: absolute;
  top: -3px;
  width: 100%;
}

/* line 231, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar, .array-widget .array-ghost-bar {
  position: absolute;
  width: 100%;
}

/* line 234, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar .array-bar-handle, .array-widget .array-bar .array-bar-left-extend, .array-widget .array-bar .array-bar-right-extend, .array-widget .array-ghost-bar .array-bar-handle, .array-widget .array-ghost-bar .array-bar-left-extend, .array-widget .array-ghost-bar .array-bar-right-extend {
  z-index: 4;
  height: 6px;
  background-color: #0c91cc;
  position: absolute;
}

/* line 240, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar .array-bar-right-extend, .array-widget .array-ghost-bar .array-bar-right-extend {
  border-radius: 0px 5px 5px 0px;
  right: -3px;
  width: 3px;
}

/* line 247, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-ghost-bar {
  display: none;
  z-index: 2;
  opacity: 0.6;
  border-top: 5px dotted #0c91cc;
}

/* line 254, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar {
  z-index: 3;
  height: 6px;
  background: #0c91cc;
}

/* line 259, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar .array-bar-left-extend {
  border-radius: 4px 0px 0px 4px;
  width: 4px;
  left: -4px;
}

/* line 264, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar.ui-draggable {
  cursor: pointer;
}

/* line 266, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar.ui-draggable .array-bar-left-extend {
  border-radius: 0px;
}

/* line 269, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar.ui-draggable.ui-draggable-disabled {
  cursor: auto;
}

/* line 272, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-bar.ui-draggable .array-bar-handle {
  background-color: transparent;
  background-position: -121px -35px;
  height: 28px;
  width: 28px;
  left: -30px;
  top: -11px;
}

/* line 284, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar-container {
  position: absolute;
  left: -3px;
  height: 100%;
}

/* line 290, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar {
  position: absolute;
  height: 100%;
  z-index: 3;
  width: 4px;
  background: #0c91cc;
}

/* line 297, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-handle, .array-widget .array-vertical-bar .array-vertical-bar-top-extend, .array-widget .array-vertical-bar .array-vertical-bar-bottom-extend {
  z-index: 4;
  width: 4px;
  background-color: #0c91cc;
  position: absolute;
}

/* line 303, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-bottom-extend {
  border-radius: 0px 0px 5px 5px;
  bottom: -3px;
  height: 3px;
}

/* line 308, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-top-extend {
  border-radius: 4px 4px 0px 0px;
  height: 3px;
  top: -3px;
}

/* line 314, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-left-fillin, .array-widget .array-vertical-bar .array-vertical-bar-right-fillin {
  z-index: 5;
  position: absolute;
  top: -50px;
  font-size: 24px;
  white-space: nowrap;
}

/* line 321, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-left-fillin {
  text-align: right;
  right: 5px;
}

/* line 325, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar .array-vertical-bar-right-fillin {
  text-align: left;
  left: 5px;
}

/* line 329, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable {
  cursor: pointer;
}

/* line 331, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable .array-vertical-bar-top-extend {
  border-radius: 0px;
}

/* line 334, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable .array-vertical-bar-left-fillin {
  right: 23px;
}

/* line 337, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable .array-vertical-bar-right-fillin {
  left: 23px;
}

/* line 340, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable.ui-draggable-disabled {
  cursor: auto;
}

/* line 343, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget .array-vertical-bar.ui-draggable .array-vertical-bar-handle {
  z-index: 6;
  background-color: transparent;
  background-position: -121px -35px;
  height: 28px;
  width: 28px;
  top: -29px;
  left: -13px;
  -webkit-transform-origin: 14px 14px;
  -moz-transform-origin: 14px 14px;
  -ms-transform-origin: 14px 14px;
  -o-transform-origin: 14px 14px;
  transform-origin: 14px 14px;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* line 359, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget.touch-enabled .array-button.transparent {
  opacity: 1;
}

/* line 365, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget.touch-enabled .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-widget.touch-enabled .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  display: none;
}

/* line 368, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget.touch-enabled .array-grid-cell.highlight-add:not(.filled) .array-cell-plus, .array-widget.touch-enabled .array-grid-cell.clickable:not(.filled):hover .array-cell-plus {
  display: none;
}

/* line 375, app/assets/stylesheets/shared/widgets/array.scss */
.array-widget.touch-enabled .array-grid-cell.filled.highlight-subtract .array-cell-minus, .array-widget.touch-enabled .array-grid-cell.filled.clickable:not(.just-added):hover .array-cell-minus {
  display: none;
}

/* line 388, app/assets/stylesheets/shared/widgets/array.scss */
.task-container:not(.grid-12) .array-widget {
  margin-left: 30px;
  background: white;
}

/* line 391, app/assets/stylesheets/shared/widgets/array.scss */
.task-container:not(.grid-12) .array-widget .gia-total-label {
  right: 0;
  left: 0;
}

/* line 400, app/assets/stylesheets/shared/widgets/array.scss */
.active-task .array-widget .array-grid-cell.clickable {
  cursor: pointer;
}

/* line 407, app/assets/stylesheets/shared/widgets/array.scss */
html.ie8 .array-grid {
  z-index: 1;
  position: relative;
}

/* line 410, app/assets/stylesheets/shared/widgets/array.scss */
html.ie8 .array-grid.rotate {
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0, M12=-1, M21=1, M22=0, SizingMethod='auto expand')";
}

/* line 415, app/assets/stylesheets/shared/widgets/array.scss */
html.ie8 .array-button.transparent {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}

/* line 420, app/assets/stylesheets/shared/widgets/array.scss */
html.ie8 .array-button.transparent .math-sign {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-token.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/array_discs.scss */
.array-token.discs .slot-item:not(.ghost) {
  background-color: #7029a5;
  width: 26px;
  height: 26px;
  margin: 0;
  border: 0;
  background-size: 26px 26px;
}

/* line 17, app/assets/stylesheets/shared/widgets/../general/array_discs.scss */
.array-token.discs .slot-item.with-image:not(.ghost) {
  background-color: transparent;
  box-shadow: none;
  border-radius: 0;
}

/* line 8, app/assets/stylesheets/shared/widgets/array_2017.scss */
.rotate-manipulative-button {
  background-color: #007b94;
  color: white;
  cursor: pointer;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: scaleX(1);
  transition: transform 300ms;
}

/* line 130, app/assets/stylesheets/shared/_student_variables.scss */
.rotate-manipulative-button.disabled, .rotate-manipulative-button:disabled {
  pointer-events: none;
  cursor: default;
  background-color: #cfdee6;
}

/* line 136, app/assets/stylesheets/shared/_student_variables.scss */
.rotate-manipulative-button.hover:not(.disabled), .rotate-manipulative-button:not(.disabled):hover {
  background-color: #005c73;
}

/* line 137, app/assets/stylesheets/shared/_student_variables.scss */
.rotate-manipulative-button.active:not(.disabled), .rotate-manipulative-button:not(.disabled):active {
  background-color: #003e4d;
}

/* line 15, app/assets/stylesheets/shared/widgets/array_2017.scss */
.rotate-manipulative-button.reverse {
  transform: scaleX(-1);
}

/* line 21, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017 .graded-mat {
  padding: 30px;
}

/* line 26, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget {
  display: block;
  position: relative;
}

/* line 30, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-col-button-wrapper {
  position: absolute;
  height: 30px;
  top: -30px;
}

/* line 36, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-row-button-wrapper {
  position: absolute;
  width: 30px;
  left: -30px;
}

/* line 42, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-button {
  position: absolute;
}

/* line 44, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-button:active:enabled {
  position: absolute;
}

/* line 47, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-button.transparent {
  opacity: 0;
}

/* line 52, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-col-add, .array-2017-widget .array-col-subtract {
  bottom: 2px;
}

/* line 54, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-col-add:active:enabled, .array-2017-widget .array-col-subtract:active:enabled {
  position: absolute;
  top: auto;
}

/* line 60, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-row-add, .array-2017-widget .array-row-subtract {
  right: 2px;
}

/* line 64, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-wrapper {
  position: relative;
  display: inline-block;
  vertical-align: top;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.array-2017-widget .array-grid-wrapper.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/array_discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item:not(.ghost) {
  background-color: #7029a5;
  width: 26px;
  height: 26px;
  margin: 0;
  border: 0;
  background-size: 26px 26px;
}

/* line 17, app/assets/stylesheets/shared/widgets/../general/array_discs.scss */
.array-2017-widget .array-grid-wrapper.discs .slot-item.with-image:not(.ghost) {
  background-color: transparent;
  box-shadow: none;
  border-radius: 0;
}

/* line 71, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid {
  display: table;
  border-collapse: collapse;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 74, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid.rotate {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* line 80, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-row {
  display: table-row;
}

/* line 83, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-row.with-lines:not(:last-of-type) {
  border-bottom: 5px solid #0c91cc;
}

/* line 88, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell {
  display: table-cell;
  width: 34px;
  height: 34px;
}

/* line 93, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.with-lines:not(:last-child) {
  border-right: 5px solid #0c91cc;
}

/* line 97, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell .array-grid-cell-inner {
  position: relative;
  width: 34px;
  height: 34px;
}

/* line 104, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell .array-cell-plus, .array-2017-widget .array-grid-cell .array-cell-minus {
  display: none;
  position: absolute;
  color: #42bfa8;
  background: white;
  font-size: 14px;
  border-radius: 20px;
  line-height: 14px;
  font-weight: 700;
  height: 14px;
  width: 14px;
  top: 10px;
  left: 10px;
  text-align: center;
}

/* line 120, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.drop-hover {
  background-color: #8f90a6;
}

/* line 124, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.sectioned, .array-2017-widget .array-grid-cell.filled.sectioned {
  background-color: #c1d8ed;
}

/* line 128, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell .array-cell-dot {
  position: absolute;
  background: #b3b3b3;
  width: 6px;
  height: 6px;
  border-radius: 3px;
  top: 14px;
  left: 14px;
}

/* line 138, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.no-dot .array-cell-dot {
  display: none;
}

/* line 143, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell .array-cell-image.slot-item {
  position: absolute;
  top: 4px;
  left: 4px;
  display: none;
}

/* line 150, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.filled .array-cell-image {
  display: block;
}

/* line 154, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.filled.highlight-subtract .array-cell-minus, .array-2017-widget .array-grid-cell.filled.clickable:not(.just-added):hover .array-cell-minus {
  display: block;
}

/* line 161, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-2017-widget .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  display: block;
  opacity: 0.5;
}

/* line 165, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget .array-grid-cell.highlight-add:not(.filled) .array-cell-plus, .array-2017-widget .array-grid-cell.clickable:not(.filled):hover .array-cell-plus {
  display: block;
}

/* line 174, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget.touch-enabled .array-button.transparent {
  opacity: 1;
}

/* line 180, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget.touch-enabled .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-2017-widget.touch-enabled .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  display: none;
}

/* line 183, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget.touch-enabled .array-grid-cell.highlight-add:not(.filled) .array-cell-plus, .array-2017-widget.touch-enabled .array-grid-cell.clickable:not(.filled):hover .array-cell-plus {
  display: none;
}

/* line 190, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-2017-widget.touch-enabled .array-grid-cell.filled.highlight-subtract .array-cell-minus, .array-2017-widget.touch-enabled .array-grid-cell.filled.clickable:not(.just-added):hover .array-cell-minus {
  display: none;
}

/* line 201, app/assets/stylesheets/shared/widgets/array_2017.scss */
.active-task .array-2017-widget .array-grid-cell.clickable {
  cursor: pointer;
}

/* line 208, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-rotate-2017 .array-2017-widget {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 213, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-rotate-2017 .array-2017-widget .array-active-area {
  margin-left: 0;
}

/* line 217, app/assets/stylesheets/shared/widgets/array_2017.scss */
.array-rotate-2017 .array-2017-widget .no-button-wrapper {
  margin-top: 0;
}
/* line 1, app/assets/stylesheets/shared/widgets/audio.scss */
.audio-widget {
  display: inline-block;
  cursor: pointer;
  margin: 0 4px;
  padding: 0;
  font-size: inherit;
  color: inherit;
  vertical-align: middle;
  user-select: none;
  width: 1em;
  text-align: left;
}

/* line 13, app/assets/stylesheets/shared/widgets/audio.scss */
.audio-widget .fa-volume-mute {
  display: none;
}

/* line 18, app/assets/stylesheets/shared/widgets/audio.scss */
.audio-widget.playing .fa-volume {
  display: none;
}

/* line 21, app/assets/stylesheets/shared/widgets/audio.scss */
.audio-widget.playing .fa-volume-mute {
  display: inline;
}

/* line 26, app/assets/stylesheets/shared/widgets/audio.scss */
.audio-widget:hover {
  transform: scale(1.3);
}

/* line 33, app/assets/stylesheets/shared/widgets/audio.scss */
.token-container .audio-widget {
  margin-left: 10px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 11, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 5px;
  position: relative;
  display: none;
  width: 300px;
  height: 68px;
  border-radius: 14px 14px 0 0;
  background-color: #f2f3f3;
}

/* line 22, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle div {
  cursor: pointer;
}

/* line 27, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-mine, .ac-toggle-answer {
  width: 144px;
  height: 60px;
  display: inline-block;
  font-size: 18px;
  font-weight: bold;
  vertical-align: bottom;
  line-height: 22px;
  padding: 6px 12px 12px 12px;
  color: #8c8c8c;
  text-align: center;
  position: absolute;
  bottom: 0;
  margin: 0 0 4px 0;
  border-radius: 12px 12px 0 0;
}

/* line 45, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-answer {
  right: 2px;
  margin: 0 4px 0 0;
}

/* line 49, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-answer.active {
  background-color: white;
  color: #0fa566;
}

/* line 55, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-mine {
  left: 2px;
  margin: 0 0 0 4px;
}

/* line 59, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-mine.active {
  background-color: white;
  color: #0c91cc;
}

/* line 67, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.task-container.highlighted .ac-toggle-answer.active, .task-container.highlighted .ac-toggle-mine.active {
  background-color: rgba(250, 210, 50, 0.5);
}

/* line 73, app/assets/stylesheets/shared/widgets/autocorrect_toggle.scss */
.ac-toggle-selection-box {
  position: absolute;
  width: 144px;
  height: 56px;
  background-color: transparent;
  margin: 0 4px;
  border-radius: 12px 12px 0 0;
  bottom: 0px;
  left: 144px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.super-mat, .super-mat-bank {
  height: 190px;
  width: 100%;
  position: relative;
}

/* line 11, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.super-mat {
  background-color: #f3fdff;
  font-size: 18px;
  border: 3px solid #cdd6d6;
  margin: 0 auto;
  border-radius: 10px;
}

/* line 18, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.super-mat.droppable-hover {
  border-color: #0097b6;
}

/* line 22, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.super-mat .super-counter {
  background-color: #787778;
  color: #fff;
  position: absolute;
  right: 0;
  margin: 10px;
  padding: 5px 20px;
  border-radius: 4px;
  min-width: 80px;
  top: 0;
}

/* line 36, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-slot {
  width: 50px;
  height: 50px;
  display: inline-block;
  margin: 8px;
}

/* line 43, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin {
  background-repeat: no-repeat;
}

/* line 45, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.quarter {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/quarter_front.png");
  width: 49px;
  height: 49px;
  border-radius: 30px;
  background-size: 49px 49px;
}

/* line 52, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.dime {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/dime_front.png");
  width: 37px;
  height: 37px;
  border-radius: 30px;
  background-size: 37px 37px;
  margin: 9px;
}

/* line 60, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.dime.back {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/dime_back.png");
}

/* line 64, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.nickel {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/nickel_front.png");
  width: 43px;
  height: 43px;
  border-radius: 30px;
  background-size: 43px 43px;
  margin: 5px;
}

/* line 72, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.nickel.back {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/nickel_back.png");
}

/* line 76, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.penny {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/penny_front.png");
  width: 39px;
  height: 39px;
  border-radius: 30px;
  background-size: 39px 39px;
  margin: 8px;
}

/* line 84, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-coin.penny.back {
  background-image: url("//webassets.zearn.org/app_assets/tasks/coins/penny_back.png");
}

/* line 90, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-bank, .coin-mat-widget .coin-mat {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 92, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-bank .coin-mat-inner-vert, .coin-mat-widget .coin-mat .coin-mat-inner-vert {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 94, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-bank .coin-mat-inner-vert .coin-mat-inner-horiz, .coin-mat-widget .coin-mat .coin-mat-inner-vert .coin-mat-inner-horiz {
  text-align: left;
  display: inline-block;
}

/* line 98, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-bank .coin-mat-inner-vert .coin-mat-inner-horiz.has-counter, .coin-mat-widget .coin-mat .coin-mat-inner-vert .coin-mat-inner-horiz.has-counter {
  margin-right: 100px;
}

/* line 103, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-bank .coin-mat-cover, .coin-mat-widget .coin-mat .coin-mat-cover {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

/* line 113, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat.correct {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 118, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat.incorrect {
  border-color: #ff4d76;
  background-color: #ffe3ee;
}

/* line 123, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat .coin-mat-cover {
  cursor: pointer;
}

/* line 128, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.coin-mat-widget .coin-mat-buttons {
  text-align: right;
  margin: 10px 10px 0 10px;
}

/* line 136, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.active-task .coin-mat-widget .coin-mat-coin.ui-draggable {
  cursor: pointer;
}

/* line 139, app/assets/stylesheets/shared/widgets/coin_mat.scss */
.active-task .coin-mat-widget .coin-mat-coin.ui-draggable:hover {
  border: 3px solid #0097b6;
  background-position: -3px -3px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .count-box .count-box-icon {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg, .count-box .count-box-items .count-box-slot .count-box-slot-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 3, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box {
  background: #f2f3f3;
  border-radius: 16px;
  position: relative;
  padding: 25px 0px 0px 0px;
}

/* line 9, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .gia-buttons, .count-box .count-box-items {
  display: inline-block;
  vertical-align: middle;
}

/* line 14, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .count-box-icon {
  width: 25px;
  height: 25px;
  background-position: -89px -22px;
  margin: 15px auto;
}

/* line 23, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .count-box-items {
  height: 200px;
  position: relative;
}

/* line 27, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .count-box-items .count-box-slot {
  width: 44px;
  height: 44px;
  position: absolute;
}

/* line 32, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .count-box-items .count-box-slot .z-item {
  top: 6px;
  left: 6px;
}

/* line 37, app/assets/stylesheets/shared/widgets/count_box.scss */
.count-box .count-box-items .count-box-slot .count-box-slot-peg {
  top: 19px;
  left: 19px;
}

/* line 47, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items {
  width: 780px;
}

/* line 49, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-0 {
  top: 80px;
  left: 370px;
}

/* line 53, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-1 {
  top: 50px;
  left: 320px;
}

/* line 57, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-2 {
  top: 110px;
  left: 430px;
}

/* line 61, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-3 {
  top: 110px;
  left: 310px;
}

/* line 65, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-4 {
  top: 40px;
  left: 410px;
}

/* line 69, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-5 {
  top: 10px;
  left: 365px;
}

/* line 73, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-6 {
  top: 140px;
  left: 370px;
}

/* line 77, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-7 {
  top: 60px;
  left: 260px;
}

/* line 81, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-8 {
  top: 65px;
  left: 460px;
}

/* line 85, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-9 {
  top: 150px;
  left: 260px;
}

/* line 90, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-10 {
  top: 145px;
  left: 480px;
}

/* line 94, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-11 {
  top: 5px;
  left: 220px;
}

/* line 98, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-12 {
  top: 8px;
  left: 499px;
}

/* line 102, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-13 {
  top: 86px;
  left: 194px;
}

/* line 106, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-14 {
  top: 94px;
  left: 520px;
}

/* line 110, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-15 {
  top: 142px;
  left: 198px;
}

/* line 114, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-16 {
  top: 46px;
  left: 551px;
}

/* line 118, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-17 {
  top: 11px;
  left: 596px;
}

/* line 122, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-18 {
  top: 137px;
  left: 543px;
}

/* line 126, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-19 {
  top: 44px;
  left: 147px;
}

/* line 131, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-20 {
  top: 85px;
  left: 599px;
}

/* line 135, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-21 {
  top: 144px;
  left: 608px;
}

/* line 139, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-22 {
  top: 117px;
  left: 133px;
}

/* line 143, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-23 {
  top: 5px;
  left: 108px;
}

/* line 147, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-24 {
  top: 32px;
  left: 663px;
}

/* line 151, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-25 {
  top: 153px;
  left: 73px;
}

/* line 155, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-26 {
  top: 63px;
  left: 78px;
}

/* line 159, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-27 {
  top: 112px;
  left: 653px;
}

/* line 163, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-28 {
  top: 103px;
  left: 34px;
}

/* line 167, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-12 .count-box-items .slot-29 {
  top: 74px;
  left: 703px;
}

/* line 173, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items {
  width: 390px;
}

/* line 175, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-0 {
  top: 80px;
  left: 185px;
}

/* line 179, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-1 {
  top: 50px;
  left: 160px;
}

/* line 183, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-2 {
  top: 110px;
  left: 215px;
}

/* line 187, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-3 {
  top: 110px;
  left: 155px;
}

/* line 191, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-4 {
  top: 40px;
  left: 205px;
}

/* line 195, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-5 {
  top: 10px;
  left: 182px;
}

/* line 199, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-6 {
  top: 140px;
  left: 185px;
}

/* line 203, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-7 {
  top: 40px;
  left: 126px;
}

/* line 207, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-8 {
  top: 65px;
  left: 230px;
}

/* line 211, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-9 {
  top: 150px;
  left: 130px;
}

/* line 216, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-10 {
  top: 145px;
  left: 240px;
}

/* line 220, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-11 {
  top: 5px;
  left: 110px;
}

/* line 224, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-12 {
  top: 8px;
  left: 250px;
}

/* line 228, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-13 {
  top: 86px;
  left: 97px;
}

/* line 232, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-14 {
  top: 94px;
  left: 260px;
}

/* line 236, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-15 {
  top: 142px;
  left: 100px;
}

/* line 240, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-16 {
  top: 46px;
  left: 275px;
}

/* line 244, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-17 {
  top: 11px;
  left: 298px;
}

/* line 248, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-18 {
  top: 137px;
  left: 271px;
}

/* line 252, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-19 {
  top: 44px;
  left: 73px;
}

/* line 257, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-20 {
  top: 85px;
  left: 300px;
}

/* line 261, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-21 {
  top: 144px;
  left: 304px;
}

/* line 265, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-22 {
  top: 117px;
  left: 67px;
}

/* line 269, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-23 {
  top: 5px;
  left: 54px;
}

/* line 273, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-24 {
  top: 32px;
  left: 331px;
}

/* line 277, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-25 {
  top: 153px;
  left: 36px;
}

/* line 281, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-26 {
  top: 63px;
  left: 39px;
}

/* line 285, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-27 {
  top: 112px;
  left: 326px;
}

/* line 289, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-28 {
  top: 103px;
  left: 17px;
}

/* line 293, app/assets/stylesheets/shared/widgets/count_box.scss */
.grid-6 .count-box-items .slot-29 {
  top: 74px;
  left: 351px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg, .count-box-2017 .count-box-items .count-box-slot .count-box-slot-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 10, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}

/* line 16, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-control {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  margin: 0px 10px;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  margin: 15px 0;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-control.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 24, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-control .count-box-icon:not(.ghost):not(.custom-images) {
  background-color: #7029a5;
  background-size: 20px;
}

/* line 28, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-control .count-box-icon.custom-images:not(.ghost) {
  background-size: 20px;
  box-shadow: none;
  background-color: transparent;
  border: none;
  border-radius: 0;
}

/* line 37, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  height: 200px;
  position: relative;
}

/* line 42, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items .count-box-slot {
  width: 44px;
  height: 44px;
  position: absolute;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.count-box-2017 .count-box-items .count-box-slot.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 48, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items .count-box-slot .slot-item:not(.ghost) {
  top: calc(19px / 2);
  left: calc(19px / 2);
}

/* line 51, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items .count-box-slot .slot-item:not(.ghost):not(.custom-images) {
  background-image: none;
  background-color: #7029a5;
}

/* line 55, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items .count-box-slot .slot-item.custom-images:not(.ghost) {
  background-size: 25px;
  box-shadow: none;
  background-color: transparent;
  border: none;
  border-radius: 0;
}

/* line 64, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.count-box-2017 .count-box-items .count-box-slot .count-box-slot-peg {
  top: calc(38px / 2);
  left: calc(38px / 2);
  background-color: #a1adb3;
  border-radius: 100%;
}

/* line 76, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items {
  width: 780px;
}

/* line 78, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-0 {
  top: 80px;
  left: 370px;
}

/* line 82, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-1 {
  top: 50px;
  left: 320px;
}

/* line 86, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-2 {
  top: 110px;
  left: 430px;
}

/* line 90, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-3 {
  top: 110px;
  left: 310px;
}

/* line 94, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-4 {
  top: 40px;
  left: 410px;
}

/* line 98, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-5 {
  top: 10px;
  left: 365px;
}

/* line 102, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-6 {
  top: 140px;
  left: 370px;
}

/* line 106, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-7 {
  top: 60px;
  left: 260px;
}

/* line 110, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-8 {
  top: 65px;
  left: 460px;
}

/* line 114, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-9 {
  top: 150px;
  left: 260px;
}

/* line 119, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-10 {
  top: 145px;
  left: 480px;
}

/* line 123, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-11 {
  top: 5px;
  left: 220px;
}

/* line 127, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-12 {
  top: 8px;
  left: 499px;
}

/* line 131, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-13 {
  top: 86px;
  left: 194px;
}

/* line 135, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-14 {
  top: 94px;
  left: 520px;
}

/* line 139, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-15 {
  top: 142px;
  left: 198px;
}

/* line 143, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-16 {
  top: 46px;
  left: 551px;
}

/* line 147, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-17 {
  top: 11px;
  left: 596px;
}

/* line 151, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-18 {
  top: 137px;
  left: 543px;
}

/* line 155, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-19 {
  top: 44px;
  left: 147px;
}

/* line 160, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-20 {
  top: 85px;
  left: 599px;
}

/* line 164, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-21 {
  top: 144px;
  left: 608px;
}

/* line 168, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-22 {
  top: 117px;
  left: 133px;
}

/* line 172, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-23 {
  top: 5px;
  left: 108px;
}

/* line 176, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-24 {
  top: 32px;
  left: 663px;
}

/* line 180, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-25 {
  top: 153px;
  left: 73px;
}

/* line 184, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-26 {
  top: 63px;
  left: 78px;
}

/* line 188, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-27 {
  top: 112px;
  left: 653px;
}

/* line 192, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-28 {
  top: 103px;
  left: 34px;
}

/* line 196, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-12 .count-box-items .slot-29 {
  top: 74px;
  left: 703px;
}

/* line 202, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items {
  width: 390px;
}

/* line 204, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-0 {
  top: 80px;
  left: 185px;
}

/* line 208, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-1 {
  top: 50px;
  left: 160px;
}

/* line 212, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-2 {
  top: 110px;
  left: 215px;
}

/* line 216, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-3 {
  top: 110px;
  left: 155px;
}

/* line 220, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-4 {
  top: 40px;
  left: 205px;
}

/* line 224, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-5 {
  top: 10px;
  left: 182px;
}

/* line 228, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-6 {
  top: 140px;
  left: 185px;
}

/* line 232, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-7 {
  top: 40px;
  left: 126px;
}

/* line 236, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-8 {
  top: 65px;
  left: 230px;
}

/* line 240, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-9 {
  top: 150px;
  left: 130px;
}

/* line 245, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-10 {
  top: 145px;
  left: 240px;
}

/* line 249, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-11 {
  top: 5px;
  left: 110px;
}

/* line 253, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-12 {
  top: 8px;
  left: 250px;
}

/* line 257, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-13 {
  top: 86px;
  left: 97px;
}

/* line 261, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-14 {
  top: 94px;
  left: 260px;
}

/* line 265, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-15 {
  top: 142px;
  left: 100px;
}

/* line 269, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-16 {
  top: 46px;
  left: 275px;
}

/* line 273, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-17 {
  top: 11px;
  left: 298px;
}

/* line 277, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-18 {
  top: 137px;
  left: 271px;
}

/* line 281, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-19 {
  top: 44px;
  left: 73px;
}

/* line 286, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-20 {
  top: 85px;
  left: 300px;
}

/* line 290, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-21 {
  top: 144px;
  left: 304px;
}

/* line 294, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-22 {
  top: 117px;
  left: 67px;
}

/* line 298, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-23 {
  top: 5px;
  left: 54px;
}

/* line 302, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-24 {
  top: 32px;
  left: 331px;
}

/* line 306, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-25 {
  top: 153px;
  left: 36px;
}

/* line 310, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-26 {
  top: 63px;
  left: 39px;
}

/* line 314, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-27 {
  top: 112px;
  left: 326px;
}

/* line 318, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-28 {
  top: 103px;
  left: 17px;
}

/* line 322, app/assets/stylesheets/shared/widgets/count_box_2017.scss */
.grid-6 .count-box-items .slot-29 {
  top: 74px;
  left: 351px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 2, app/assets/stylesheets/shared/widgets/countdown_bar.scss */
.countdown-bar {
  width: 100%;
  height: 100%;
  position: relative;
  background-color: #44BE4F;
  overflow: hidden;
}

/* line 9, app/assets/stylesheets/shared/widgets/countdown_bar.scss */
.countdown-bar .progress-bar {
  z-index: 2;
  background-color: grey;
  position: absolute;
  height: 100%;
  top: 0;
  right: 0;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 11, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock {
  position: relative;
  width: 50px;
}

/* line 18, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper {
  position: relative;
  height: 50px;
  width: 50px;
  background: white;
}

/* line 24, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper .pie {
  /* Don't change anything */
  width: 50%;
  height: 100%;
  -webkit-transform-origin: 100% 50%;
  -moz-transform-origin: 100% 50%;
  -ms-transform-origin: 100% 50%;
  -o-transform-origin: 100% 50%;
  position: absolute;
  /* Change what you want there */
  background: #b3b3b3;
}

/* line 38, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper .spinner {
  /* Thanks @Joshua Hibbert for the border-radius trick */
  background: #b3b3b3;
  border-radius: 100% 0 0 100% / 50% 0 0 50%;
  z-index: 200;
  /* Change the border if you want */
  border-right: none;
}

/* line 48, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper .filler {
  border-radius: 0 100% 100% 0 / 0 50% 50% 0;
  left: 50%;
  opacity: 0;
  z-index: 100;
  border-left: none;
}

/* line 56, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper .mask {
  /* Don't change anything */
  width: 50%;
  height: 100%;
  border-top-left-radius: 100% 50%;
  border-bottom-left-radius: 100% 50%;
  position: absolute;
  background: #4d4d4d;
  opacity: 1;
  z-index: 300;
}

/* line 68, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock .clock-wrapper .back-pie {
  border-radius: 50%;
  height: 50px;
  width: 50px;
  background: #4d4d4d;
}

/* line 77, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.warning .clock-wrapper .pie {
  background: #fb9eaa;
}

/* line 80, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.warning .clock-wrapper .back-pie {
  background: #ff0026;
}

/* line 85, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania {
  width: 100px;
}

/* line 87, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania .clock-wrapper {
  height: 100px;
  width: 100px;
}

/* line 90, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania .clock-wrapper .pie {
  background: #f9d7af;
}

/* line 93, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania .clock-wrapper .spinner {
  background: #f9d7af;
}

/* line 96, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania .clock-wrapper .mask {
  background: #ff8b00;
}

/* line 99, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.countdown-clock.multiply-mania .clock-wrapper .back-pie {
  height: 100px;
  width: 100px;
  background: #ff8b00;
}

/* line 112, app/assets/stylesheets/shared/widgets/countdown_clock.scss */
.ie8 .countdown-clock .clock-wrapper .pie, .ie8 .countdown-clock .clock-wrapper .spinner {
  background: white;
  border-color: white;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/widgets/counter.scss */
.counter {
  width: 60px;
  height: 140px;
  font-size: 0px;
  text-align: center;
}

/* line 10, app/assets/stylesheets/shared/widgets/counter.scss */
.counter button {
  height: 45px;
  width: 45px;
  cursor: pointer;
  font-size: 0;
}

/* line 15, app/assets/stylesheets/shared/widgets/counter.scss */
.counter button span {
  font-size: 20px;
}

/* line 20, app/assets/stylesheets/shared/widgets/counter.scss */
.counter .counter-count {
  width: 40px;
  height: 40px;
  margin: 5px;
  line-height: 40px;
  font-size: 30px;
  font-family: "Lucida Sans Typewriter", "Monaco", "Bitstream Vera Sans Mono", monospace;
  margin-left: auto;
  margin-right: auto;
}

/* line 31, app/assets/stylesheets/shared/widgets/counter.scss */
.counter.horizontal {
  height: 50px;
  margin-top: 5px;
  margin-bottom: 5px;
  width: 140px;
}

/* line 36, app/assets/stylesheets/shared/widgets/counter.scss */
.counter.horizontal button, .counter.horizontal div {
  float: right;
}

/* line 39, app/assets/stylesheets/shared/widgets/counter.scss */
.counter.horizontal .counter-count {
  margin-left: 5px;
  margin-right: 5px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 10, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget {
  position: relative;
  display: inline-block;
}

/* line 13, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .mat-task-area {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 18, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank {
  display: inline-block;
}

/* line 21, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .plus-button, .counting-mat-widget .bank .minus-button {
  vertical-align: middle;
}

/* line 25, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-clm {
  display: inline-block;
  vertical-align: middle;
  margin: 0 5px;
}

/* line 30, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-cell {
  width: 11px;
  height: 11px;
  margin: 2px;
  outline: 2px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-cell.addend-0 {
  background-color: #7a00c9;
}

/* line 40, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-cell.addend-0.tens {
  outline-color: #bc7fe3;
}

/* line 44, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-cell.addend-1 {
  background-color: #eb731c;
}

/* line 46, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap .counting-mat-cell.addend-1.tens {
  outline-color: #cd1f2e;
}

/* line 51, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .bank .qty-wrap.tens {
  margin-bottom: 15px;
}

/* line 56, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .mat {
  display: inline-block;
  margin-left: 25px;
}

/* line 61, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .counting-mat-token .counting-mat-mat {
  background-color: #f3fdff;
}

/* line 64, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .counting-mat-token .counting-mat-clm.decorate, .counting-mat-widget .counting-mat-token .counting-mat-cell.decorate {
  border: 2px dotted #999999;
  outline-color: transparent;
  background-color: #cdd6d6;
}

/* line 69, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .counting-mat-token .counting-mat-clm.decorate {
  width: 20px;
  height: 173px;
  background-color: #cdd6d6;
}

/* line 74, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget .counting-mat-token .counting-mat-clm.decorate .counting-mat-cell {
  display: none;
}

/* line 80, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.try-again.incorrect .counting-mat-mat {
  border-color: #ff4d76;
  background-color: #ffe3ee;
}

/* line 88, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.correct:not(.try-again) .counting-mat-mat {
  border-color: #00c372;
}

/* line 91, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.incorrect:not(.try-again) .counting-mat-mat {
  border-color: #ff4d76;
}

/* line 95, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.correct:not(.try-again):not(.final) .counting-mat-mat {
  -webkit-animation: matBackgroundFlashCorrect 1s;
  -moz-animation: matBackgroundFlashCorrect 1s;
  -ms-animation: matBackgroundFlashCorrect 1s;
  -o-animation: matBackgroundFlashCorrect 1s;
  animation: matBackgroundFlashCorrect 1s;
}

/* line 98, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.incorrect:not(.try-again):not(.final) .counting-mat-mat {
  -webkit-animation: matBackgroundFlashIncorrect 1s;
  -moz-animation: matBackgroundFlashIncorrect 1s;
  -ms-animation: matBackgroundFlashIncorrect 1s;
  -o-animation: matBackgroundFlashIncorrect 1s;
  animation: matBackgroundFlashIncorrect 1s;
}

/* line 104, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.counting-mat-widget.has-two-rows .bank {
  padding-top: 183px;
}

/* line 109, app/assets/stylesheets/shared/widgets/counting_mat.scss */
.active-task .counting-mat-widget.input-enabled.try-again {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot1 {
  0% {
    opacity: 0;
  }
  24% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot2 {
  0% {
    opacity: 0;
  }
  49% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot3 {
  0% {
    opacity: 0;
  }
  74% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* line 23, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .one, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn.animate .one {
  animation: dot1 2s infinite;
}

/* line 26, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .two, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn.animate .two {
  animation: dot2 2s infinite;
}

/* line 29, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .three, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn.animate .three {
  animation: dot3 2s infinite;
}

/* line 7, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area {
  margin-top: 0;
}

/* line 10, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  box-sizing: border-box;
  font-size: 50px;
  font-weight: bold;
}

/* line 16, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .done-area {
  margin: 0 20px;
  line-height: 55px;
}

/* line 19, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .done-area .saving-message {
  display: none;
}

/* line 25, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn {
  vertical-align: top;
  border-width: 0 0 2px 0;
  border-style: solid;
}

/* line 30, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn:active:not(:disabled), .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:active:not(:disabled), .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:active:not(:disabled) {
  border-width: 2px 0 0 0;
}

/* line 34, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn:active:enabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn:hover:enabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:active:enabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:hover:enabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:active:enabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:hover:enabled {
  -webkit-box-shadow: 0 0 0 0 #b3b3b3;
  -moz-box-shadow: 0 0 0 0 #b3b3b3;
  -ms-box-shadow: 0 0 0 0 #b3b3b3;
  -o-box-shadow: 0 0 0 0 #b3b3b3;
  box-shadow: 0 0 0 0 #b3b3b3;
  cursor: pointer;
}

/* line 39, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn:disabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:disabled, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:disabled {
  opacity: 1;
}

/* line 44, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:active {
  border-color: #757575;
}

/* line 48, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn, .fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn {
  width: 185px;
  text-transform: none;
  font-size: 36px;
  padding: 0 0 2px 0;
  border-radius: 40px;
  color: white;
  background: #0294f8;
}

/* line 58, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn {
  display: none;
  align-items: center;
  justify-content: center;
  line-height: 1.3em;
  -webkit-animation: pulse 500ms;
  -moz-animation: pulse 500ms;
  -ms-animation: pulse 500ms;
  -o-animation: pulse 500ms;
  animation: pulse 500ms;
  border-color: #0673bf;
}

/* line 65, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:active {
  border-color: #0673bf;
}

/* line 70, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons .activity-complete-buttons-area .zearn-button.saving-btn {
  color: #757575;
  background-color: #e1e1e1;
}

/* line 81, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons.horiz {
  color: #ff5400;
  margin-top: 15%;
}

/* line 85, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons.horiz .activity-complete-buttons-area {
  width: 420px;
  padding: 0 8px;
}

/* line 89, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons.horiz .activity-complete-buttons-area .acb-zearned-it {
  padding-bottom: 20px;
}

/* line 93, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons.horiz .activity-complete-buttons-area .done-area {
  float: right;
  margin: 0 10px 0 0;
}

/* line 98, app/assets/stylesheets/shared/widgets/fluency_complete_buttons.scss */
.fluency-complete-buttons.activity-complete-buttons.horiz .activity-complete-buttons-area .love-it-btn {
  margin: 3px 10px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
}

/* line 8, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line {
  width: 648px;
  margin: 0;
}

/* line 11, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .number-line-containment {
  width: 600px;
  height: 100%;
}

/* line 15, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .number-line-left-arrow {
  float: left;
}

/* line 18, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .number-line-right-arrow {
  float: right;
}

/* line 22, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-start-seg {
  height: 100%;
  position: relative;
  display: inline-block;
}

/* line 28, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-tick {
  position: absolute;
}

/* line 30, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-tick .fnl-tick-click-zone {
  position: absolute;
  width: 16px;
  height: 100%;
  left: 50%;
  left: calc(50% - 8px);
  z-index: 1;
}

/* line 40, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick {
  width: 5px;
  height: 100%;
  border-radius: 4px;
  background: black;
  top: 0;
  margin-left: -3px;
}

/* line 48, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-whole-label {
  font-size: 16px;
  width: 20px;
  position: absolute;
  left: -7px;
  height: 20px;
  bottom: -22px;
}

/* line 57, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-label {
  left: -36px;
}

/* line 59, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-label:not(.bottom) {
  bottom: 44px;
}

/* line 62, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-label.bottom {
  top: 44px;
}

/* line 64, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-label.bottom.extra-bottom {
  top: 64px;
}

/* line 71, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-major-tick {
  width: 2px;
  height: 80%;
  border-radius: 4px;
  background: black;
  top: 10%;
  margin-left: -1px;
}

/* line 78, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-major-tick .fnl-label {
  left: 50%;
  left: calc(50% - 40px);
}

/* line 84, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-minor-tick {
  border-left: 2px dotted #4d4d4d;
  height: 80%;
  border-radius: 2px;
  top: 10%;
  margin-left: -1px;
}

/* line 90, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-minor-tick .fnl-label {
  left: 50%;
  left: calc(50% - 41px);
}

/* line 94, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-minor-tick .fnl-point, .fraction-number-line-widget .number-line .fnl-minor-tick .fnl-point-hover {
  left: 50%;
  left: calc(50% - 9px);
}

/* line 100, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-point, .fraction-number-line-widget .number-line .fnl-point-hover {
  position: absolute;
  top: 50%;
  top: calc(50% - 8px);
  left: 50%;
  left: calc(50% - 8px);
  z-index: 2;
}

/* line 108, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-point .fnl-point-glow, .fraction-number-line-widget .number-line .fnl-point-hover .fnl-point-glow {
  display: none;
  position: absolute;
  width: 24px;
  height: 24px;
  top: 50%;
  top: calc(50% - 12px);
  left: 50%;
  left: calc(50% - 12px);
  border-radius: 12px;
  background: rgba(12, 145, 204, 0.5);
}

/* line 120, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-point.active .fnl-point-glow, .fraction-number-line-widget .number-line .fnl-point-hover.active .fnl-point-glow {
  display: block;
}

/* line 123, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-point .fnl-label, .fraction-number-line-widget .number-line .fnl-point-hover .fnl-label {
  left: -36px;
}

/* line 130, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-whole-tick .fnl-point .fnl-label:not(.bottom), .fraction-number-line-widget .number-line .fnl-whole-tick .fnl-point-hover .fnl-label:not(.bottom), .fraction-number-line-widget .number-line .fnl-major-tick .fnl-point .fnl-label:not(.bottom), .fraction-number-line-widget .number-line .fnl-major-tick .fnl-point-hover .fnl-label:not(.bottom), .fraction-number-line-widget .number-line .fnl-minor-tick .fnl-point .fnl-label:not(.bottom), .fraction-number-line-widget .number-line .fnl-minor-tick .fnl-point-hover .fnl-label:not(.bottom) {
  bottom: 36px;
  left: -34px;
}

/* line 137, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label {
  width: 80px;
  position: absolute;
  font-size: 20px;
}

/* line 142, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label:not(.bottom) {
  bottom: 40px;
}

/* line 145, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label.bottom {
  top: 40px;
}

/* line 147, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label.bottom.extra-bottom {
  top: 60px;
}

/* line 152, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label .fraction {
  font-size: 16px;
  display: inline-block;
}

/* line 155, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label .fraction .number-input {
  font-size: 16px;
  width: 30px;
}

/* line 160, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label .fnl-whole {
  display: inline-block;
  line-height: 40px;
}

/* line 163, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-widget .number-line .fnl-label .fnl-whole .number-input {
  font-size: 20px;
  width: 20px;
}

/* line 172, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fnl-point, .fnl-point-hover {
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #0c91cc;
  border: 2px solid black;
}

/* line 179, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fnl-point-hover {
  display: none;
  opacity: 0.5;
}

/* line 187, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.task.with-top-spacer .fraction-number-line-widget .number-line, .task.with-top-spacer .operational-buttons {
  margin-top: 70px;
}

/* line 191, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.task.with-top-spacer.small-top .fraction-number-line-widget .number-line, .task.with-top-spacer.small-top .operational-buttons {
  margin-top: 24px;
}

/* line 197, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.task.with-bottom-spacer .fraction-number-line-widget .number-line, .task.with-bottom-spacer .operational-buttons {
  margin-bottom: 70px;
}

/* line 201, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.task.with-bottom-spacer.small-bottom .fraction-number-line-widget .number-line, .task.with-bottom-spacer.small-bottom .operational-buttons {
  margin-bottom: 24px;
}

/* line 206, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.task.with-top-spacer.with-bottom-spacer .operational-buttons {
  margin-top: 0;
  margin-bottom: 0;
}

/* line 215, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .task {
  text-align: left;
}

/* line 218, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .partition-buttons, .fraction-number-line-equals .split-buttons, .fraction-number-line-equals .move-buttons, .fraction-number-line-equals .point-buttons {
  margin: 10px;
  padding: 2px 4px;
  border: 3px solid #b3b3b3;
  border-radius: 12px;
}

/* line 223, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .partition-buttons .fnl-partition-icon, .fraction-number-line-equals .split-buttons .fnl-partition-icon, .fraction-number-line-equals .move-buttons .fnl-partition-icon, .fraction-number-line-equals .point-buttons .fnl-partition-icon {
  display: inline-block;
  margin: 0 4px;
  background: url("//webassets.zearn.org/app_assets/tasks/number_line/partition.png");
  width: 30px;
  height: 35px;
}

/* line 229, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .partition-buttons .fnl-partition-icon.full, .fraction-number-line-equals .split-buttons .fnl-partition-icon.full, .fraction-number-line-equals .move-buttons .fnl-partition-icon.full, .fraction-number-line-equals .point-buttons .fnl-partition-icon.full {
  background: url("//webassets.zearn.org/app_assets/tasks/number_line/partitionfull.png");
}

/* line 233, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .partition-buttons .plus-button, .fraction-number-line-equals .partition-buttons .minus-button, .fraction-number-line-equals .partition-buttons .fnl-partition-icon, .fraction-number-line-equals .split-buttons .plus-button, .fraction-number-line-equals .split-buttons .minus-button, .fraction-number-line-equals .split-buttons .fnl-partition-icon, .fraction-number-line-equals .move-buttons .plus-button, .fraction-number-line-equals .move-buttons .minus-button, .fraction-number-line-equals .move-buttons .fnl-partition-icon, .fraction-number-line-equals .point-buttons .plus-button, .fraction-number-line-equals .point-buttons .minus-button, .fraction-number-line-equals .point-buttons .fnl-partition-icon {
  vertical-align: middle;
}

/* line 238, app/assets/stylesheets/shared/widgets/fraction_number_line.scss */
.fraction-number-line-equals .point-buttons .fnl-point, .fraction-number-line-equals .move-buttons .fnl-point, .fraction-number-line-equals .split-buttons .fnl-point {
  display: inline-block;
  vertical-align: middle;
  margin: 10px 10px;
}
/* line 3, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad {
  padding: 4px;
}

/* line 5, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas {
  margin: 0 auto;
  background-repeat: no-repeat;
  background-position: 60px 60px;
  position: relative;
}

/* line 11, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas line {
  stroke-linecap: round;
  stroke-width: 2px;
  stroke: #354359;
}

/* line 16, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas line.highlight {
  stroke: #fbc920;
  stroke-width: 6px;
}

/* line 21, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas line.highlighted, .geometry-pad .geometry-canvas line.hover {
  stroke: #1cc7e6;
}

/* line 25, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas line.paired:not(.force-hover), .geometry-pad .geometry-canvas line.dark-blue {
  stroke: #1f68c1;
}

/* line 31, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas ellipse.point-circle, .geometry-pad .geometry-canvas circle.point-circle {
  fill: #1cc7e6;
  stroke-width: 2px;
  stroke: #354359;
}

/* line 36, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas ellipse.point-click-circle, .geometry-pad .geometry-canvas circle.point-click-circle {
  fill: rgba(0, 0, 0, 0);
}

/* line 41, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas text {
  font-family: Verdana, Geneva, sans-serif;
  text-anchor: middle;
  fill: #354359;
}

/* line 45, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas text.angle-label {
  font-weight: normal;
}

/* line 48, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas text.point-label {
  font-weight: bold;
}

/* line 50, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas text.point-label.clickable {
  fill: #1cc7e6;
}

/* line 54, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas text.highlight {
  fill: #fbb03b;
  font-weight: bold;
}

/* line 60, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas .geometry-arc {
  fill: none;
  stroke-width: 2px;
  stroke: #354359;
}

/* line 64, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.geometry-pad .geometry-canvas .geometry-arc.highlight {
  stroke-width: 6px;
  stroke: #fbc920;
}

/* line 74, app/assets/stylesheets/shared/widgets/geometry_pad.scss */
.active-task .geometry-pad:not(.disabled) .point-click-circle {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .z-item {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 5, app/assets/stylesheets/shared/widgets/gia.scss */
.gia-buttons {
  background-color: white;
  padding: 10px;
  border-radius: 20px;
  width: 60px;
  height: 135px;
}

/* line 15, app/assets/stylesheets/shared/widgets/gia.scss */
.gia-total-label {
  position: absolute;
  right: 10px;
  top: 10px;
  background-color: white;
  font-size: 16px;
  width: 100px;
  border-radius: 20px;
  color: #0c91cc;
  padding: 2px 0px;
  font-weight: 100;
}

/* line 27, app/assets/stylesheets/shared/widgets/gia.scss */
.gia-total-label .gia-total-num {
  color: #42bfa8;
  font-weight: 700;
}

/* line 33, app/assets/stylesheets/shared/widgets/gia.scss */
.z-item {
  height: 32px;
  width: 32px;
  background-position: -137px 0;
  position: absolute;
  z-index: 1;
}

/* line 40, app/assets/stylesheets/shared/widgets/gia.scss */
.z-item.ui-draggable {
  cursor: pointer;
}

/* line 43, app/assets/stylesheets/shared/widgets/gia.scss */
.z-item.ui-draggable-disabled {
  cursor: auto;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat-partial-correctness {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again, .graded-mat-partial-correctness.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 197, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active {
  background-color: #f3fdff;
  border-color: #0097b6;
}

/* line 201, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active .mat-item:not(.locked), .graded-mat-partial-correctness.active .dark-mat-item:not(.locked) {
  cursor: pointer;
}

/* line 205, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active .mat-item.locked {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 206, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active .mat-item:not(.locked):not(.ghost) {
  background-color: #1cc7e6;
  border-color: #005c73;
}

/* line 210, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active .dark-mat-item.locked {
  background-color: #435259;
  border-color: #435259;
}

/* line 211, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.active .dark-mat-item:not(.locked):not(.ghost) {
  background-color: #0097b6;
  border-color: #0097b6;
}

/* line 125, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) {
  background-color: #ffe6ee;
  border-color: #ff4d76;
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.try-again:not(.partial-correct) .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.try-again:not(.partial-correct) .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again:not(.partial-correct) .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 129, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) {
  background-color: white;
  border-color: #ff4d76;
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.incorrect:not(.partial-correct) .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.incorrect:not(.partial-correct) .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect:not(.partial-correct) .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-white-ffe6ee-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.try-again.partial-correct .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.try-again.partial-correct .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.try-again.partial-correct .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.try-again.partial-correct .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 137, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct {
  background-color: white;
  border-color: #ff4d76;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.incorrect.partial-correct .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.incorrect.partial-correct .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.incorrect.partial-correct .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.incorrect.partial-correct .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 142, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct {
  background-color: white;
  border-color: #b3b3b3;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.correct .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.correct .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.correct .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correct .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-white-white-animation-border-color-b3b3b3-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  83% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.pre-ghost-autocorrect .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.pre-ghost-autocorrect .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.pre-ghost-autocorrect .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.correctable .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.correctable .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.correctable .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.correctable .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 154, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected {
  background-color: white;
  border-color: #b3b3b3;
}

/* line 241, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .mat-item.try-again:not(.locked), .graded-mat-partial-correctness.autocorrected .mat-item.incorrect:not(.locked), .graded-mat-partial-correctness.autocorrected .dark-mat-item.try-again:not(.locked), .graded-mat-partial-correctness.autocorrected .dark-mat-item.incorrect:not(.locked) {
  background-color: #ff4d76;
  border-color: #ff4d76;
}

/* line 247, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .mat-item.ghost:not(.locked) {
  cursor: pointer;
  background-color: #e4e4e4;
  border-color: #4d4d4d;
  border-style: dotted;
  -webkit-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -moz-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -ms-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  -o-animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  animation: pulseGhost 1600ms ease-in-out 1.5s infinite;
  box-shadow: none;
}

@-webkit-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-moz-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@-o-keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

@keyframes pulseGhost {
  0% {
    transform: scale(1);
    box-shadow: none;
  }
  25% {
    transform: scale(1.2);
    box-shadow: 0px 0px 0px 5px #ff0d5e;
  }
  50% {
    transform: scale(1);
    box-shadow: none;
  }
}

/* line 251, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .mat-item.ghost:not(.locked):hover {
  background-color: #1cc7e6;
  border-color: #005c73;
  border-style: solid;
  opacity: 0.5;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-a1adb3-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #a1adb3;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 256, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .mat-item.done {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .dark-mat-item.locked:not(.done):not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-00c372-435259-animation-border-color-00c372-435259-animation-border-width-3px-3px {
  0% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #00c372;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: #435259;
    border-color: #435259;
    border-width: 3px;
  }
}

/* line 261, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-partial-correctness.autocorrected .dark-mat-item.done {
  background-color: #435259;
  border-color: #435259;
}

/* line 11, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat-active-binary-correctness {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.try-again, .graded-mat-active-binary-correctness.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 197, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active {
  background-color: #f3fdff;
  border-color: #0097b6;
}

/* line 201, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active .mat-item:not(.locked), .graded-mat-active-binary-correctness.active .dark-mat-item:not(.locked) {
  cursor: pointer;
}

/* line 205, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active .mat-item.locked {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 206, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active .mat-item:not(.locked):not(.ghost) {
  background-color: #1cc7e6;
  border-color: #005c73;
}

/* line 210, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active .dark-mat-item.locked {
  background-color: #435259;
  border-color: #435259;
}

/* line 211, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.active .dark-mat-item:not(.locked):not(.ghost) {
  background-color: #0097b6;
  border-color: #0097b6;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.try-again, .graded-mat-active-binary-correctness.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 219, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.try-again {
  background-color: #ffe6ee;
  border-color: #ff4d76;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.pre-ghost-autocorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

/* line 15, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat-active-binary-correctness-blended-inputs {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.try-again, .graded-mat-active-binary-correctness-blended-inputs.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 197, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active {
  background-color: #f3fdff;
  border-color: #0097b6;
}

/* line 201, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active .mat-item:not(.locked), .graded-mat-active-binary-correctness-blended-inputs.active .dark-mat-item:not(.locked) {
  cursor: pointer;
}

/* line 205, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active .mat-item.locked {
  background-color: #a1adb3;
  border-color: #435259;
}

/* line 206, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active .mat-item:not(.locked):not(.ghost) {
  background-color: #1cc7e6;
  border-color: #005c73;
}

/* line 210, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active .dark-mat-item.locked {
  background-color: #435259;
  border-color: #435259;
}

/* line 211, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.active .dark-mat-item:not(.locked):not(.ghost) {
  background-color: #0097b6;
  border-color: #0097b6;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.try-again, .graded-mat-active-binary-correctness-blended-inputs.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 219, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.try-again {
  background-color: #ffe6ee;
  border-color: #ff4d76;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.pre-ghost-autocorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-white-animation-border-color-00c372-b3b3b3-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #b3b3b3;
    border-width: 3px;
  }
}

/* line 228, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-active-binary-correctness-blended-inputs.correct .zearn-input.done, .graded-mat-active-binary-correctness-blended-inputs.correct .zearn-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.correct .super-input.done, .graded-mat-active-binary-correctness-blended-inputs.correct .super-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.try-again .zearn-input.done, .graded-mat-active-binary-correctness-blended-inputs.try-again .zearn-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.try-again .super-input.done, .graded-mat-active-binary-correctness-blended-inputs.try-again .super-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.incorrect:not(.correctable) .zearn-input.done, .graded-mat-active-binary-correctness-blended-inputs.incorrect:not(.correctable) .zearn-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.incorrect:not(.correctable) .super-input.done, .graded-mat-active-binary-correctness-blended-inputs.incorrect:not(.correctable) .super-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.correctable .zearn-input.done, .graded-mat-active-binary-correctness-blended-inputs.correctable .zearn-input:not(.done), .graded-mat-active-binary-correctness-blended-inputs.correctable .super-input.done, .graded-mat-active-binary-correctness-blended-inputs.correctable .super-input:not(.done) {
  background-color: transparent;
  border-color: transparent;
  color: black;
}

/* line 19, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat-spontaneous-binary-correctness {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness.try-again, .graded-mat-spontaneous-binary-correctness.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 219, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness.try-again {
  background-color: #ffe6ee;
  border-color: #ff4d76;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness.pre-ghost-autocorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

/* line 23, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
}

/* line 177, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.try-again, .graded-mat-spontaneous-binary-correctness-blended-inputs.pre-ghost-autocorrect {
  cursor: pointer;
}

/* line 180, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show {
  -webkit-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -moz-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -ms-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  -o-animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  animation: transparentToRed 1200ms linear, pulseAutocorrect 4600ms ease-in-out infinite;
  background-color: #ff4d76;
  border-color: #ff4d76;
  display: inline-block;
  opacity: 1;
  transform-origin: right;
}

@-webkit-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-moz-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-o-keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@keyframes transparentToRed {
  0% {
    background-color: transparent;
    border-color: transparent;
  }
  83% {
    background-color: transparent;
    border-color: transparent;
  }
  100% {
    background-color: #ff4d76;
    border-color: #ff4d76;
  }
}

@-webkit-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-moz-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@-o-keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

@keyframes pulseAutocorrect {
  4% {
    transform: scale(1);
  }
  10.5% {
    transform: scale(1.4);
  }
  17% {
    transform: scale(1);
  }
}

/* line 185, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs .question-mark-tab.manipulatives-button.show.top {
  transform-origin: bottom;
}

/* line 189, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) {
  -webkit-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -moz-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -ms-animation: animation-background-color-transparent-ff4d76 200ms linear;
  -o-animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation: animation-background-color-transparent-ff4d76 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-moz-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@-o-keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

@keyframes animation-background-color-transparent-ff4d76 {
  0% {
    background-color: transparent;
  }
  100% {
    background-color: #ff4d76;
  }
}

/* line 370, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs .autocorrect-button:not(.question-mark-tab) i {
  -webkit-animation: animation-color-transparent-white 200ms linear;
  -moz-animation: animation-color-transparent-white 200ms linear;
  -ms-animation: animation-color-transparent-white 200ms linear;
  -o-animation: animation-color-transparent-white 200ms linear;
  animation: animation-color-transparent-white 200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-moz-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@-o-keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

@keyframes animation-color-transparent-white {
  0% {
    color: transparent;
  }
  100% {
    color: white;
  }
}

/* line 219, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.try-again {
  background-color: #ffe6ee;
  border-color: #ff4d76;
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.pre-ghost-autocorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ffe6ee-white-animation-border-color-ff4d76-ff4d76-animation-border-width-3px-3px {
  0% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  83% {
    background-color: #ffe6ee;
    border-color: #ff4d76;
    border-width: 3px;
  }
  100% {
    background-color: white;
    border-color: #ff4d76;
    border-width: 3px;
  }
}

/* line 322, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -moz-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -ms-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  -o-animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  animation: multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px 1200ms linear;
  animation-fill-mode: forwards;
}

@-webkit-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@-moz-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@-o-keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

@keyframes multi-animation-animation-background-color-ccffd9-transparent-animation-border-color-00c372-transparent-animation-border-width-3px-3px {
  0% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  83% {
    background-color: #ccffd9;
    border-color: #00c372;
    border-width: 3px;
  }
  100% {
    background-color: transparent;
    border-color: transparent;
    border-width: 3px;
  }
}

/* line 228, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat-spontaneous-binary-correctness-blended-inputs.correct .zearn-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.correct .zearn-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.correct .super-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.correct .super-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.try-again .zearn-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.try-again .zearn-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.try-again .super-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.try-again .super-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.incorrect:not(.correctable) .zearn-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.incorrect:not(.correctable) .zearn-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.incorrect:not(.correctable) .super-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.incorrect:not(.correctable) .super-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.correctable .zearn-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.correctable .zearn-input:not(.done), .graded-mat-spontaneous-binary-correctness-blended-inputs.correctable .super-input.done, .graded-mat-spontaneous-binary-correctness-blended-inputs.correctable .super-input:not(.done) {
  background-color: transparent;
  border-color: transparent;
  color: black;
}

/* line 30, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat {
  display: inline-block;
  padding: 16px;
  border: 3px solid transparent;
  border-radius: 10px;
  border-width: 2px;
  padding: 10px;
}

/* line 34, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.try-again, .graded-mat.graded-mat-always-visible.try-again {
  border-color: #ff4d76;
  background-color: #ffe3ee;
  cursor: pointer;
}

@-webkit-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe6ee;
  }
  83% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-moz-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe6ee;
  }
  83% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-o-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe6ee;
  }
  83% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe6ee;
  }
  83% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

/* line 44, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.incorrect, .graded-mat.graded-mat-always-visible.incorrect {
  border-color: #ff4d76;
  background-color: transparent;
}

/* line 45, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.incorrect:not(.page-refreshed):not(.done-animating), .graded-mat.graded-mat-always-visible.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: gradedMatIncorrect 1200ms linear;
  -moz-animation: gradedMatIncorrect 1200ms linear;
  -ms-animation: gradedMatIncorrect 1200ms linear;
  -o-animation: gradedMatIncorrect 1200ms linear;
  animation: gradedMatIncorrect 1200ms linear;
}

/* line 55, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.active:not(.correct):not(.try-again):not(.incorrect):not(.done-animating):not(.page-refreshed) {
  border-color: transparent;
  background-color: transparent;
}

@-webkit-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: transparent;
  }
  100% {
    border-color: transparent;
  }
}

@-moz-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: transparent;
  }
  100% {
    border-color: transparent;
  }
}

@-o-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: transparent;
  }
  100% {
    border-color: transparent;
  }
}

@keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: transparent;
  }
  100% {
    border-color: transparent;
  }
}

/* line 68, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.correct {
  border-color: transparent;
  background-color: transparent;
}

/* line 69, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-only-with-grading.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: gradedMat01Correct 1200ms linear;
  -moz-animation: gradedMat01Correct 1200ms linear;
  -ms-animation: gradedMat01Correct 1200ms linear;
  -o-animation: gradedMat01Correct 1200ms linear;
  animation: gradedMat01Correct 1200ms linear;
}

/* line 77, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-always-visible {
  border-color: #bdbec0;
  background-color: white;
}

/* line 81, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-always-visible.active {
  background-color: #f3fdff;
}

@-webkit-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: #bdbec0;
  }
  100% {
    border-color: #bdbec0;
  }
}

@-moz-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: #bdbec0;
  }
  100% {
    border-color: #bdbec0;
  }
}

@-o-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: #bdbec0;
  }
  100% {
    border-color: #bdbec0;
  }
}

@keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  83% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  92% {
    -webkit-transition: border 100ms ease;
    -moz-transition: border 100ms ease;
    -o-transition: border 100ms ease;
    transition: border 100ms ease;
  }
  100% {
    background-color: transparent;
  }
  92% {
    border-color: #bdbec0;
  }
  100% {
    border-color: #bdbec0;
  }
}

/* line 94, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-always-visible.correct {
  border-color: #bdbec0;
  background-color: transparent;
}

/* line 95, app/assets/stylesheets/shared/widgets/../../shared_vue_component_mixins/graded_mat_mixin.scss */
.graded-mat.graded-mat-always-visible.correct:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: gradedMat02Correct 1200ms linear;
  -moz-animation: gradedMat02Correct 1200ms linear;
  -ms-animation: gradedMat02Correct 1200ms linear;
  -o-animation: gradedMat02Correct 1200ms linear;
  animation: gradedMat02Correct 1200ms linear;
}

@-webkit-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe3ee;
  }
  88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-moz-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe3ee;
  }
  88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@-o-keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe3ee;
  }
  88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

@keyframes gradedMatIncorrect {
  0% {
    background-color: #ffe3ee;
  }
  88% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: transparent;
  }
}

/* line 45, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat.graded-mat-only-with-grading.incorrect:not(.page-refreshed):not(.done-animating), .graded-mat.graded-mat-always-visible.incorrect:not(.page-refreshed):not(.done-animating) {
  -webkit-animation: gradedMatIncorrect 1700ms linear;
  -moz-animation: gradedMatIncorrect 1700ms linear;
  -ms-animation: gradedMatIncorrect 1700ms linear;
  -o-animation: gradedMatIncorrect 1700ms linear;
  animation: gradedMatIncorrect 1700ms linear;
}

@-webkit-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@-moz-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@-o-keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@keyframes gradedMat01Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

/* line 66, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat.graded-mat-only-with-grading.correct {
  border-color: transparent;
  background-color: transparent;
}

/* line 67, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat.graded-mat-only-with-grading.correct:not(.done-animating):not(.page-refreshed) {
  -webkit-animation: gradedMat01Correct 1700ms linear;
  -moz-animation: gradedMat01Correct 1700ms linear;
  -ms-animation: gradedMat01Correct 1700ms linear;
  -o-animation: gradedMat01Correct 1700ms linear;
  animation: gradedMat01Correct 1700ms linear;
}

@-webkit-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@-moz-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@-o-keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

@keyframes gradedMat02Correct {
  0% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  88% {
    border-color: #00c372;
    background-color: #ccffd9;
  }
  100% {
    border-color: #bdbec0;
    background-color: transparent;
  }
}

/* line 90, app/assets/stylesheets/shared/widgets/graded_mat.scss */
.graded-mat.graded-mat-always-visible.correct:not(.done-animating):not(.page-refreshed) {
  -webkit-animation: gradedMat02Correct 1700ms linear;
  -moz-animation: gradedMat02Correct 1700ms linear;
  -ms-animation: gradedMat02Correct 1700ms linear;
  -o-animation: gradedMat02Correct 1700ms linear;
  animation: gradedMat02Correct 1700ms linear;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .groups-box .group .gia-buttons .group-item-icon, .groups-box .group .group-top-controls .group-duplicate {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg, .groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 3, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box {
  background: #f2f3f3;
  border-radius: 16px;
  position: relative;
  padding: 35px 0px 25px 0px;
}

/* line 9, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .gia-buttons, .groups-box .groups-box-groups {
  display: inline-block;
  vertical-align: middle;
}

/* line 14, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .groups-box-icon {
  width: 40px;
  height: 35px;
  border: 2px solid #8f90a6;
  background: white;
  border-radius: 30px;
  margin: 10px auto;
}

/* line 23, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .groups-box-groups {
  text-align: left;
  min-height: 171px;
}

/* line 28, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group {
  display: inline-block;
  width: 139px;
  min-height: 150px;
  margin: 2px 6px;
  position: relative;
}

/* line 35, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-top-controls {
  background: #f3f3f3;
  width: 120px;
  height: 127px;
  margin: 0px auto;
  border-radius: 20px 20px 0px 0px;
  text-align: center;
}

/* line 43, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-top-controls .group-duplicate {
  width: 34px;
  height: 22px;
  background-position: -89px 0;
  margin: 0px auto;
  cursor: pointer;
}

/* line 50, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-top-controls .group-duplicate.disabled {
  cursor: auto;
  opacity: 0.6;
}

/* line 58, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .gia-buttons {
  display: block;
  background: #f3f3f3;
  width: 120px;
  height: 40px;
  margin: 0px auto;
  border-radius: 0px 0px 20px 20px;
  text-align: center;
}

/* line 67, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .gia-buttons .group-old-subtract, .groups-box .group .gia-buttons .group-old-add {
  background: #0c91cc;
  padding: 0px;
  border-radius: 15px;
  font-family: Verdana, Geneva, sans-serif;
  width: 22px;
  height: 22px;
  line-height: 22px;
  font-size: 16px;
  vertical-align: middle;
}

/* line 78, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .gia-buttons .group-old-subtract:disabled, .groups-box .group .gia-buttons .group-old-add:disabled {
  background: #bdbec0;
  color: white;
}

/* line 83, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .gia-buttons .group-item-icon {
  position: relative;
  top: 10px;
  display: inline-block;
  vertical-align: top;
  width: 15px;
  height: 15px;
  background-position: -123px 0;
  margin: 0px 4px;
}

/* line 93, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .gia-buttons .group-item-icon.disabled {
  opacity: 0.6;
  filter: alpha(opacity=0.6);
}

/* line 100, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items {
  border: 3px solid #8f90a6;
  background: white;
  width: 144px;
  height: 108px;
  border-radius: 50px;
  position: absolute;
  top: 25px;
  cursor: pointer;
}

/* line 109, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items.disabled {
  cursor: auto;
}

/* line 113, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot {
  width: 32px;
  height: 32px;
  position: absolute;
}

/* line 118, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-0 {
  top: 35px;
  left: 35px;
}

/* line 122, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-1 {
  top: 33px;
  left: 70px;
}

/* line 126, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-2 {
  top: 1px;
  left: 45px;
}

/* line 130, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-3 {
  top: 67px;
  left: 61px;
}

/* line 134, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-4 {
  top: 0px;
  left: 80px;
}

/* line 138, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-5 {
  top: 68px;
  left: 26px;
}

/* line 142, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-6 {
  top: 8px;
  left: 10px;
}

/* line 146, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-7 {
  top: 59px;
  left: 95px;
}

/* line 150, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-8 {
  top: 42px;
  left: 1px;
}

/* line 154, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot.slot-9 {
  top: 25px;
  left: 104px;
}

/* line 159, app/assets/stylesheets/shared/widgets/groups_box.scss */
.groups-box .group .group-items .group-item-slot .group-item-slot-peg {
  display: none;
  top: 17px;
  left: 17px;
}

/* line 172, app/assets/stylesheets/shared/widgets/groups_box.scss */
.grid-12 .groups-box-groups {
  width: 758px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg, .groups-box-2017 .group-2017 .group-items .group-item-slot .group-item-slot-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 21, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
}

/* line 27, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-control {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-height: 191px;
  margin: 0px 10px;
}

/* line 35, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-control .groups-box-icon {
  width: 40px;
  height: 35px;
  border: 2px solid #829199;
  border-radius: 20px;
  background: white;
  margin: 10px 0px;
}

/* line 45, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-mat {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 800px;
  border: 3px solid transparent;
  border-radius: 12px;
  background-color: white;
  padding: 0px 15px 0px 5px;
}

/* line 55, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-mat.highlight-groups:not(.active) .group-highlight {
  position: absolute;
  top: -5px;
  left: -5px;
  width: 154px;
  height: 118px;
  border-radius: 55px;
  background-color: #ffe919;
}

/* line 64, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-mat.highlight-groups:not(.active) .group-items .z-item {
  opacity: 0.5;
}

/* line 69, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-mat.highlight-items:not(.active) .group-item-highlight {
  width: 31px;
  height: 31px;
  border-radius: 100%;
  background-color: #ffe919;
}

/* line 75, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .groups-box-mat.highlight-items:not(.active) .group-items:not(.highlight-items-on) {
  opacity: 0.5;
}

/* line 82, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 10px 5px;
  position: relative;
}

/* line 88, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-duplicate:not(.disabled) {
  background-color: #0097b6;
  background-image: url("//webassets.zearn.org/app_assets/tasks/groups_2017/icon-clone.svg");
  background-repeat: no-repeat;
  background-position: 4px 6px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  position: absolute;
  top: 38px;
  left: 126px;
  z-index: 1;
  cursor: pointer;
}

/* line 101, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-duplicate:not(.disabled):hover, .groups-box-2017 .group-2017 .group-duplicate:not(.disabled):focus {
  background-color: #007b94;
}

/* line 104, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-duplicate:not(.disabled):active {
  background-color: #005c73;
}

/* line 107, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-duplicate:not(.disabled):disabled {
  background-color: #cccccc;
}

/* line 112, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items {
  position: relative;
  border-width: 3px;
  border-radius: 50px;
  width: 144px;
  height: 108px;
  cursor: pointer;
}

/* line 119, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items.disabled {
  cursor: auto;
}

/* line 122, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items:not(.active):not(.try-again) {
  pointer-events: none;
}

/* line 126, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot {
  width: 32px;
  height: 32px;
  position: absolute;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-0 {
  top: 35px;
  left: 35px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-1 {
  top: 33px;
  left: 70px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-2 {
  top: 1px;
  left: 45px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-3 {
  top: 67px;
  left: 61px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-4 {
  top: 0px;
  left: 80px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-5 {
  top: 68px;
  left: 26px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-6 {
  top: 8px;
  left: 10px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-7 {
  top: 59px;
  left: 95px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-8 {
  top: 42px;
  left: 1px;
}

/* line 132, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.slot-9 {
  top: 25px;
  left: 104px;
}

/* line 139, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot .group-item-slot-peg {
  display: none;
  top: 17px;
  left: 17px;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 149, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot .slot-item:not(.ghost):not(.custom-images) {
  background-image: none;
  background-color: #7029a5;
}

/* line 153, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot .slot-item.custom-images:not(.ghost) {
  background-size: 25px;
  box-shadow: none;
  background-color: transparent;
  border: none;
  border-radius: 0;
}

/* line 161, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items .group-item-slot .slot-item.ghost {
  background-image: none;
}

/* line 166, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items-control {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 40px;
  margin-top: 10px;
  background: none;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  margin: 0 5px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.groups-box-2017 .group-2017 .group-items-control.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 176, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items-control .group-item-icon:not(.ghost):not(.custom-images) {
  background-color: #7029a5;
}

/* line 179, app/assets/stylesheets/shared/widgets/groups_box_2017.scss */
.groups-box-2017 .group-2017 .group-items-control .group-item-icon.custom-images:not(.ghost) {
  background-size: 20px;
  box-shadow: none;
  background-color: transparent;
  border: none;
  border-radius: 0;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes hintMatchPulseBackground1 {
  0% {
    background-color: #ccc;
  }
  50% {
    background-color: #bec7cc;
  }
  100% {
    background-color: #ccc;
  }
}

@-moz-keyframes hintMatchPulseBackground1 {
  0% {
    background-color: #ccc;
  }
  50% {
    background-color: #bec7cc;
  }
  100% {
    background-color: #ccc;
  }
}

@-o-keyframes hintMatchPulseBackground1 {
  0% {
    background-color: #ccc;
  }
  50% {
    background-color: #bec7cc;
  }
  100% {
    background-color: #ccc;
  }
}

@keyframes hintMatchPulseBackground1 {
  0% {
    background-color: #ccc;
  }
  50% {
    background-color: #bec7cc;
  }
  100% {
    background-color: #ccc;
  }
}

@-webkit-keyframes hintMatchPulseBackground2 {
  0% {
    background-color: #999;
  }
  50% {
    background-color: #5b84a3;
  }
  100% {
    background-color: #999;
  }
}

@-moz-keyframes hintMatchPulseBackground2 {
  0% {
    background-color: #999;
  }
  50% {
    background-color: #5b84a3;
  }
  100% {
    background-color: #999;
  }
}

@-o-keyframes hintMatchPulseBackground2 {
  0% {
    background-color: #999;
  }
  50% {
    background-color: #5b84a3;
  }
  100% {
    background-color: #999;
  }
}

@keyframes hintMatchPulseBackground2 {
  0% {
    background-color: #999;
  }
  50% {
    background-color: #5b84a3;
  }
  100% {
    background-color: #999;
  }
}

@-webkit-keyframes hintMatchPulseBorder {
  0% {
    border-color: #888;
    box-shadow: none;
  }
  50% {
    border-color: #557c9e;
    box-shadow: 0 0 2px 2px #557c9e;
  }
  100% {
    border-color: #888;
    box-shadow: none;
  }
}

@-moz-keyframes hintMatchPulseBorder {
  0% {
    border-color: #888;
    box-shadow: none;
  }
  50% {
    border-color: #557c9e;
    box-shadow: 0 0 2px 2px #557c9e;
  }
  100% {
    border-color: #888;
    box-shadow: none;
  }
}

@-o-keyframes hintMatchPulseBorder {
  0% {
    border-color: #888;
    box-shadow: none;
  }
  50% {
    border-color: #557c9e;
    box-shadow: 0 0 2px 2px #557c9e;
  }
  100% {
    border-color: #888;
    box-shadow: none;
  }
}

@keyframes hintMatchPulseBorder {
  0% {
    border-color: #888;
    box-shadow: none;
  }
  50% {
    border-color: #557c9e;
    box-shadow: 0 0 2px 2px #557c9e;
  }
  100% {
    border-color: #888;
    box-shadow: none;
  }
}

@-webkit-keyframes hintMatchPulseBorder1 {
  0% {
    border-color: #888;
  }
  50% {
    border-color: #557c9e;
  }
  100% {
    border-color: #888;
  }
}

@-moz-keyframes hintMatchPulseBorder1 {
  0% {
    border-color: #888;
  }
  50% {
    border-color: #557c9e;
  }
  100% {
    border-color: #888;
  }
}

@-o-keyframes hintMatchPulseBorder1 {
  0% {
    border-color: #888;
  }
  50% {
    border-color: #557c9e;
  }
  100% {
    border-color: #888;
  }
}

@keyframes hintMatchPulseBorder1 {
  0% {
    border-color: #888;
  }
  50% {
    border-color: #557c9e;
  }
  100% {
    border-color: #888;
  }
}

/* line 46, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.active-task .horizontal-matching-widget .match-set-item-container:not(.matched):hover .match-set-item {
  background-color: #fff;
}

/* line 50, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.active-task .horizontal-matching-widget .match-set-item {
  border-color: #888;
}

/* line 53, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.active-task .horizontal-matching-widget .matching-set1 .match-set1-handle {
  border-color: #888;
}

/* line 56, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.active-task .horizontal-matching-widget .matching-set2 .match-set2-handle {
  background-color: #999;
}

/* line 59, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.active-task .horizontal-matching-widget .match-set-item-container {
  cursor: pointer;
}

/* line 65, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  font-size: 18px;
  padding: 4px;
  position: relative;
}

/* line 151, app/assets/stylesheets/shared/_student_variables.scss */
.horizontal-matching-widget::after {
  visibility: hidden;
  display: block;
  content: "";
  clear: both;
  height: 0;
}

/* line 72, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container {
  position: relative;
  z-index: 5;
}

/* line 76, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.ui-draggable-dragging, .horizontal-matching-widget .match-set-item-container.correct {
  z-index: 10;
}

/* line 80, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.hinted .match-set-item {
  -webkit-animation: hintMatchPulseBorder 2000ms ease-in-out infinite;
  -moz-animation: hintMatchPulseBorder 2000ms ease-in-out infinite;
  -ms-animation: hintMatchPulseBorder 2000ms ease-in-out infinite;
  -o-animation: hintMatchPulseBorder 2000ms ease-in-out infinite;
  animation: hintMatchPulseBorder 2000ms ease-in-out infinite;
}

/* line 83, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.hinted .match-set1-handle {
  -webkit-animation: hintMatchPulseBorder1 2000ms ease-in-out infinite, hintMatchPulseBackground1 2000ms ease-in-out infinite;
  -moz-animation: hintMatchPulseBorder1 2000ms ease-in-out infinite, hintMatchPulseBackground1 2000ms ease-in-out infinite;
  -ms-animation: hintMatchPulseBorder1 2000ms ease-in-out infinite, hintMatchPulseBackground1 2000ms ease-in-out infinite;
  -o-animation: hintMatchPulseBorder1 2000ms ease-in-out infinite, hintMatchPulseBackground1 2000ms ease-in-out infinite;
  animation: hintMatchPulseBorder1 2000ms ease-in-out infinite, hintMatchPulseBackground1 2000ms ease-in-out infinite;
}

/* line 86, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.hinted .match-set2-handle {
  -webkit-animation: hintMatchPulseBackground2 2000ms ease-in-out infinite;
  -moz-animation: hintMatchPulseBackground2 2000ms ease-in-out infinite;
  -ms-animation: hintMatchPulseBackground2 2000ms ease-in-out infinite;
  -o-animation: hintMatchPulseBackground2 2000ms ease-in-out infinite;
  animation: hintMatchPulseBackground2 2000ms ease-in-out infinite;
}

/* line 91, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.match-preview .match-set-item, .horizontal-matching-widget .match-set-item-container.to-match .match-set-item, .horizontal-matching-widget .match-set-item-container.match-option:hover .match-set-item {
  border-color: #557c9e;
}

/* line 94, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.match-preview .match-set1-handle, .horizontal-matching-widget .match-set-item-container.to-match .match-set1-handle, .horizontal-matching-widget .match-set-item-container.match-option:hover .match-set1-handle {
  border-color: #557c9e;
  background-color: #bec7cc;
}

/* line 98, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.match-preview .match-set2-handle, .horizontal-matching-widget .match-set-item-container.to-match .match-set2-handle, .horizontal-matching-widget .match-set-item-container.match-option:hover .match-set2-handle {
  background-color: #5b84a3;
}

/* line 103, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.to-match .match-set-item {
  background-color: #fff;
}

/* line 107, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.correct {
  cursor: default;
}

/* line 109, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.correct .match-set-item {
  border-color: #5f9676;
}

/* line 112, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.correct .match-set1-handle {
  border-color: #5f9676;
  background-color: #3aad48;
}

/* line 116, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.correct .match-set2-handle {
  background-color: #3aad48;
}

/* line 121, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.incorrect .match-set-item {
  border-color: #e84327;
}

/* line 124, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.incorrect .match-set1-handle {
  border-color: #e84327;
  background-color: #f0852e;
}

/* line 128, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item-container.incorrect .match-set2-handle {
  background-color: #f0852e;
}

/* line 134, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
  padding: 6px;
  background-color: #eee;
  border: 4px solid #bbb;
  border-radius: 20px;
  line-height: 32px;
}

/* line 143, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item.match-set1-item {
  padding-right: 24px;
}

/* line 147, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item.match-set2-item {
  padding-left: 24px;
}

/* line 151, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-item .match-set-item-inner {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 156, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-handle {
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
  position: absolute;
  top: 50%;
  margin-top: -25px;
  width: 50px;
  height: 50px;
  border-radius: 25px;
}

/* line 166, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set-slot {
  position: absolute;
  height: 100%;
  top: 0;
}

/* line 173, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .matching-num-input {
  width: 80px;
  height: 32px;
  font-size: 18px;
}

/* line 177, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .matching-num-input.incorrect {
  border: 3px solid #f0852e;
  color: #e84327;
}

/* line 181, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .matching-num-input.autocorrect {
  border: 2px solid #75adda;
}

/* line 184, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .matching-num-input.correct {
  border: 3px solid #3aad48;
  color: #5f9676;
}

/* line 189, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .invisible-sign {
  visibility: hidden;
}

/* line 193, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-area {
  display: table;
  position: relative;
}

/* line 197, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-wrapper {
  display: table-row;
}

/* line 200, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-1, .horizontal-matching-widget .match-row-set-2 {
  display: table-cell;
  padding: 5px 0px;
  position: relative;
  margin-bottom: 16px;
}

/* line 207, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-1 .match-row-set1-wrapper {
  position: relative;
}

/* line 211, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-1 .match-set1-handle {
  right: -25px;
  background-color: #ccc;
  border: 4px solid #bbb;
}

/* line 220, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set1-item-container.matched .match-set1-handle, .horizontal-matching-widget .match-set1-item-container.match-preview .match-set1-handle {
  border: 8px solid #ccc;
  background-color: #bbb;
}

/* line 224, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set1-item-container.matched.correct .match-set1-handle, .horizontal-matching-widget .match-set1-item-container.match-preview.correct .match-set1-handle {
  background-color: #3aad48;
}

/* line 227, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-set1-item-container.matched.incorrect .match-set1-handle, .horizontal-matching-widget .match-set1-item-container.match-preview.incorrect .match-set1-handle {
  background-color: #f0852e;
}

/* line 232, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .place-value-matching .match-row-set-2 {
  width: 340px;
}

/* line 234, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .place-value-matching .match-row-set-2 .match-set2-item-container {
  float: right;
}

/* line 238, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-2 {
  padding-left: 70px;
  vertical-align: middle;
}

/* line 242, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-2 .match-set2-handle {
  left: -25px;
  background-color: #bbb;
  border: 8px solid #ccc;
  z-index: 10;
}

/* line 249, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-2 .match-set2-placeholder {
  display: none;
  z-index: 4;
  position: absolute;
  height: 100%;
  top: 0;
  border: 4px dashed #a3bdd0;
  border-radius: 20px;
}

/* line 259, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .match-row-set-2 .match-set2-slot {
  position: relative;
}

/* line 264, app/assets/stylesheets/shared/widgets/horizontal_matching.scss */
.horizontal-matching-widget .matching-backdrop {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.1;
  z-index: 10;
}
/* line 7, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-line {
  stroke: #1f68c1;
  stroke-width: 3;
  stroke-dasharray: 10, 7;
}

/* line 12, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-line.prepop {
  stroke: #354359;
}

/* line 17, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point {
  position: absolute;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  border: #1f68c1 solid 3px;
}

/* line 24, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point .point-fill-in {
  height: 16px;
  width: 16px;
  margin-top: -1px;
  margin-left: -1px;
  border-radius: 50%;
  opacity: 0.5;
  background-color: #fff;
  border: #1f68c1 solid 1px;
}

/* line 36, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.connected .point-fill-in {
  background-color: #1f68c1;
  opacity: 1;
}

/* line 43, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.selected .point-fill-in {
  background-color: #1cc7e6;
  opacity: 1;
}

/* line 49, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.inactive {
  border-color: #1f68c1;
}

/* line 52, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.inactive .point-fill-in {
  background-color: #1f68c1;
  opacity: 1;
}

/* line 58, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.disabled {
  border-color: rgba(31, 104, 193, 0.5);
}

/* line 62, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.prepop {
  border-color: #354359;
}

/* line 65, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry .geometry-pad .symmetry-point.prepop .point-fill-in {
  background-color: #354359;
  border-color: #354359;
}

/* line 74, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-line {
  cursor: pointer;
}

/* line 76, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-line:not(.prepop):hover {
  stroke: #1cc7e6;
}

/* line 79, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-line.prepop {
  cursor: default;
}

/* line 83, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-point {
  cursor: pointer;
}

/* line 85, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-point.prepop, .lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-point.disabled {
  cursor: default;
}

/* line 88, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-point:hover:not(.just-added):not(.disabled):not(.prepop) {
  border-color: #1cc7e6;
}

/* line 90, app/assets/stylesheets/shared/widgets/lines_of_symmetry.scss */
.lines-of-symmetry.active-task .geometry-pad:not(.disabled) .symmetry-point:hover:not(.just-added):not(.disabled):not(.prepop) .point-fill-in {
  background-color: #1cc7e6;
  border-color: #1cc7e6;
  opacity: 1;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/number_sense_fill_in.scss */
.ns-fill-in.super-fill-in-widget .number-input.active:disabled {
  border-color: #0097b6;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/widgets/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/widgets/../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/widgets/../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/widgets/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 52, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  position: relative;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.place-value-mat-widget.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 68px;
  height: 32px;
  border: 3px solid transparent;
  background-repeat: no-repeat;
}

/* line 25, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.hidden {
  display: none;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.selected {
  border-color: #007f99;
  position: absolute;
  top: 0;
  left: 0;
}

/* line 34, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.ghost {
  height: 26px;
  width: 62px;
  margin: 3px 0 0 3px;
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 42, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.ones:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/1dollar.svg");
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.tens:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/10dollar.svg");
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/money.scss */
.place-value-mat-widget.money .slot-item.hundreds:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/100dollar.svg");
}

/* line 62, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-bank {
  z-index: 2;
}

/* line 65, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-mat {
  z-index: 1;
}

/* line 67, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-mat.has-dragging-tile {
  z-index: 2;
}

/* line 70, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-mat.has-units {
  background-color: transparent;
  display: table;
  border: 0;
}

/* line 77, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-counter {
  z-index: 3;
}

/* line 80, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat-title-row, .place-value-mat-widget .pvm-unit-mat-row, .place-value-mat-widget .pvm-unit-counter-row {
  display: table-row;
  position: relative;
}

/* line 84, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-title, .place-value-mat-widget .pvm-unit-mat, .place-value-mat-widget .pvm-unit-counter-wrap {
  display: table-cell;
  position: relative;
  width: 33.33%;
  border: 0 solid #cdd6d6;
}

/* line 90, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-title {
  color: #333;
  font-weight: bold;
  border-width: 3px 2px 0 0;
  padding: 5px 0;
}

/* line 95, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-title:first-child {
  border-left-width: 3px;
}

/* line 98, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-title:last-child {
  border-right-width: 3px;
}

/* line 102, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat {
  height: 210px;
  background-color: #f3fdff;
  border-width: 2px 2px 3px 0;
}

/* line 106, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat:first-child {
  border-left-width: 3px;
}

/* line 109, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat:last-child {
  border-right-width: 3px;
}

/* line 112, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat.droppable-hover .pvm-mat-highlight {
  visibility: visible;
}

/* line 115, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-mat.droppable-hover.incorrect .pvm-mat-highlight {
  border-color: #ff4d76;
}

/* line 119, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-mat-highlight {
  visibility: hidden;
  border: 3px solid #0097b6;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 6;
}

/* line 129, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter-wrap {
  z-index: 7;
}

/* line 132, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter {
  color: #fff;
  display: inline-block;
  position: relative;
  top: -10px;
  padding: 5px 20px;
  border: 0;
  background-color: #787778;
  border-radius: 4px;
}

/* line 141, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter .pvm-num {
  font-weight: bold;
}

/* line 144, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter.ones, .place-value-mat-widget .pvm-unit-counter.tens {
  min-width: 110px;
}

/* line 147, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter.hundreds {
  min-width: 150px;
}

/* line 150, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-unit-counter.hidden {
  visibility: hidden;
}

/* line 155, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.display-only .pvm-mat, .place-value-mat-widget.display-only .pvm-unit-mat {
  background-color: #fff;
}

/* line 164, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile {
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
  position: absolute;
  z-index: 5;
  visibility: visible;
  opacity: 1;
  font-size: 0;
  line-height: 0;
}

/* line 174, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.no-transition {
  transition-property: none;
}

/* line 177, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile > .tile-inner {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid #666;
}

/* line 187, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.ghost:not(.money), .place-value-mat-widget .pvm-tile.ghost.money {
  z-index: 4;
  transition-property: none;
}

/* line 191, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.ghost.ones:not(.money) > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.tens:not(.money) > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.hundreds:not(.money) > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.money.ones > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.money.tens > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.money.hundreds > .tile-inner {
  background-color: rgba(153, 153, 153, 0.4);
  background-image: none;
  border-style: dotted;
  border-color: #999999;
}

/* line 198, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.ghost.hidden:not(.money), .place-value-mat-widget .pvm-tile.ghost.money.hidden {
  visibility: hidden;
  opacity: 0;
  transition-property: all;
  transition-delay: 0.2s;
}

/* line 204, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.ghost.bundle-highlight:not(.money), .place-value-mat-widget .pvm-tile.ghost.money.bundle-highlight {
  z-index: 9;
}

/* line 206, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.ghost.bundle-highlight:not(.money) > .tile-inner, .place-value-mat-widget .pvm-tile.ghost.money.bundle-highlight > .tile-inner {
  border-color: #808080;
  background-color: rgba(0, 151, 182, 0.5);
}

/* line 213, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile > .click-zone {
  display: none;
}

/* line 216, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active, .place-value-mat-widget .pvm-tile.stacked:not(.locked) {
  position: absolute;
}

/* line 218, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active.ones > .tile-inner, .place-value-mat-widget .pvm-tile.stacked.ones:not(.locked) > .tile-inner {
  border-left-color: #ffdcb0;
  border-top-color: #ffdcb0;
}

/* line 222, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active.tens > .tile-inner, .place-value-mat-widget .pvm-tile.stacked.tens:not(.locked) > .tile-inner {
  border-left-color: #ffb3b2;
  border-top-color: #ffb3b2;
}

/* line 226, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active.hundreds > .tile-inner, .place-value-mat-widget .pvm-tile.stacked.hundreds:not(.locked) > .tile-inner {
  border-left-color: #FDEADC;
  border-top-color: #FDEADC;
}

/* line 231, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active > .click-zone, .place-value-mat-widget .pvm-tile.stacked:not(.locked) > .click-zone {
  display: block;
  position: absolute;
  z-index: 2;
}

/* line 236, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.active.ui-draggable-dragging, .place-value-mat-widget .pvm-tile.stacked.ui-draggable-dragging:not(.locked) {
  transition-property: none;
}

/* line 240, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.glow > .tile-inner {
  -webkit-box-shadow: 0 0 0 2px #007f99;
  -moz-box-shadow: 0 0 0 2px #007f99;
  -ms-box-shadow: 0 0 0 2px #007f99;
  -o-box-shadow: 0 0 0 2px #007f99;
  box-shadow: 0 0 0 2px #007f99;
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease-in-out;
}

/* line 244, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.bundling {
  z-index: 10;
}

/* line 247, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.bundleable {
  cursor: pointer;
}

/* line 249, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-tile.bundleable > .click-zone {
  display: block;
}

/* line 257, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.ones {
  width: 16px;
  height: 16px;
}

/* line 260, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.ones > .tile-inner {
  background: #b7a993;
  border-color: #804800;
  border-radius: 2px;
}

/* line 265, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.ones.active > .tile-inner, .place-value-mat-widget.tiles .pvm-tile.ones.stacked:not(.locked) > .tile-inner {
  border-left-color: #ffdcb0;
  border-top-color: #ffdcb0;
}

/* line 269, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.ones .click-zone {
  width: 32px;
  height: 32px;
  margin-left: -8px;
  margin-top: -8px;
}

/* line 275, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.ones.bundling > .tile-inner {
  background-color: #cd1f2e;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

/* line 280, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.tens {
  width: 16px;
  height: 142px;
}

/* line 283, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.tens .click-zone {
  width: 32px;
  height: 100%;
  margin-left: -8px;
}

/* line 288, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.tens > .tile-inner {
  background-color: #cd1f2e;
  border-color: #810000;
  border-radius: 2px;
  background-image: url(data:image/gif;base64,R0lGODlhDACKAIABAP+zsv///yH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4zLWMwMTEgNjYuMTQ1NjYxLCAyMDEyLzAyLzA2LTE0OjU2OjI3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNzZDMTdFMEJEQjExRTU5QTQxREI3RUU2N0E0NTU4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNzZDMTdGMEJEQjExRTU5QTQxREI3RUU2N0E0NTU4Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MEI5OEFGN0YwQkRBMTFFNTlBNDFEQjdFRTY3QTQ1NTgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MEI5OEFGODAwQkRBMTFFNTlBNDFEQjdFRTY3QTQ1NTgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAABACwAAAAADACKAAACPIyPqcvtD6OctB6As8a2+w+GYrOVwIim6vqZGwvHMutq843nUp3p/u/jcYDE4kp4MiqXHiTzCYU4o1RiAQA7);
}

/* line 300, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.tens.active > .tile-inner, .place-value-mat-widget.tiles .pvm-tile.tens.stacked:not(.locked) > .tile-inner {
  border-left-color: #ffb3b2;
  border-top-color: #ffb3b2;
}

/* line 304, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.tens.bundling > .tile-inner {
  background-color: #eb731c;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

/* line 309, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.hundreds {
  width: 142px;
  height: 142px;
}

/* line 312, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.hundreds > .click-zone {
  width: 100%;
  height: 100%;
}

/* line 316, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.hundreds > .tile-inner {
  background-color: #eb731c;
  border-color: #8C3800;
  border-radius: 2px;
  background-image: url(data:image/gif;base64,R0lGODlhigCKAIABAP/Ssf///yH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4zLWMwMTEgNjYuMTQ1NjYxLCAyMDEyLzAyLzA2LTE0OjU2OjI3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOkZCN0YxMTc0MDcyMDY4MTE4MDgzOUFERDUzMEM2OTEwIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdCNzZDMTgzMEJEQjExRTU5QTQxREI3RUU2N0E0NTU4IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdCNzZDMTgyMEJEQjExRTU5QTQxREI3RUU2N0E0NTU4IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzYgKE1hY2ludG9zaCkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpGQjdGMTE3NDA3MjA2ODExODA4MzlBREQ1MzBDNjkxMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpGQjdGMTE3NDA3MjA2ODExODA4MzlBREQ1MzBDNjkxMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgH//v38+/r5+Pf29fTz8vHw7+7t7Ovq6ejn5uXk4+Lh4N/e3dzb2tnY19bV1NPS0dDPzs3My8rJyMfGxcTDwsHAv769vLu6ubi3trW0s7KxsK+urayrqqmop6alpKOioaCfnp2cm5qZmJeWlZSTkpGQj46NjIuKiYiHhoWEg4KBgH9+fXx7enl4d3Z1dHNycXBvbm1sa2ppaGdmZWRjYmFgX15dXFtaWVhXVlVUU1JRUE9OTUxLSklIR0ZFRENCQUA/Pj08Ozo5ODc2NTQzMjEwLy4tLCsqKSgnJiUkIyIhIB8eHRwbGhkYFxYVFBMSERAPDg0MCwoJCAcGBQQDAgEAACH5BAEAAAEALAAAAACKAIoAAAL/jI8HybadHlQTyXpnhrv1yoGOGHwRaVroKqbk2LKgC88ydr9eHsa+/cMFdQxaibcb9oBMITHZ1CCL05MS+rRGl86u9EoFP43kqkp83mKzFHRbHYZrvVx2jb6u6/P8OD5b5nb3JZf2N2d3JKhY+HZoSPioE9g4uOcXmXlpAdDp+QkaKjpKWmp6ipqqukopadmHuAkp65jYqgk7m1tL+wpoxrvrGyvM6Ao8rIvZa4y7XLx4yyxdTP0bjdw8nW2E7V2pXZ39fWxN/Ix+PsbNTu6sTmSuDB+cPn9fv+6+vS+emI8vGcCBAguGszepHTh5BA/SK8EqosSJFCtOVFgO47uA/w7jaeS38CMbhgZJdmxosh/CkiJXnnxhMmbLhy9ncpSpkmbOmzZRjgu502dQg0Nr4gQKrujRjEWV9mTZFClTqRuF/jP6FKvTGRa7ev0K9lTWpVWhJqUKcqrasmPbbr1KNi3buCPdovV3dq3cvXiPvdXbd+5Vs4Bd0nX5V3BiZosD8zU8WOtdyI2vTaZ5GHPkzDwrPwwLOrToi547Xzb9j7PVwpoHqyas+HTC0qtj+5UN+3HrvLZ760bNlnZux8Qtswb+u7ad15KPK68rvLlvaLilJx+OuDrz7ZvtOsf+ebT48eQ9eZ9OuXp07lG/Wy+++7Z79tq7rz/PuP799ujj9/9HTt18+MHH0X76qXeggNEZqCCCDT74X0MMRgheQOVdiCFYA6YHYX4dEvgch7Zs6N91NU1oInMoglihhAlS+J6Iy5EIoIwBwkjfh8bhSGOI+ryYYlYr2kikTkCyGGOJ0B1ZZI3hZQhllKv02GKVSXo0pJJNzsakll4W2KWTYvqIZZhknkmUmVbmOGKWY1rpJppXuqjjl3KmpOaca/5U55t6/hnnnvwFGaieUh6KKClU/snmjIU2umSfdwqZJ6RbwrSopUZKKmiej2ZqX6WgujaqqKR+uqCpqsrHI6q8EboqhYnOSmupnAIaK6zuuXprN7kiqeKvlzIaaq+2timsnXAVJutnsMbyiuyzzHIpbbXRtjptQQUAADs=);
}

/* line 323, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.tiles .pvm-tile.hundreds.active > .tile-inner, .place-value-mat-widget.tiles .pvm-tile.hundreds.stacked:not(.locked) > .tile-inner {
  border-left-color: #FDEADC;
  border-top-color: #FDEADC;
}

/* line 332, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.money .pvm-bank {
  height: 70px;
}

/* line 336, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.money .pvm-tile, .place-value-mat-widget.money .pvm-tile > .click-zone {
  width: 68px;
  height: 32px;
}

/* line 340, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.money .pvm-tile > .tile-inner, .place-value-mat-widget.money .pvm-tile.active > .tile-inner, .place-value-mat-widget.money .pvm-tile.stacked:not(.locked) > .tile-inner {
  border-width: 3px;
  border-color: transparent;
}

/* line 347, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.discs .pvm-mat {
  width: 826px;
}

/* line 351, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.discs .pvm-tile, .place-value-mat-widget.discs .pvm-tile > .click-zone {
  width: 34px;
  height: 34px;
}

/* line 355, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.discs .pvm-tile > .tile-inner, .place-value-mat-widget.discs .pvm-tile.active > .tile-inner, .place-value-mat-widget.discs .pvm-tile.stacked:not(.locked) > .tile-inner {
  border-width: 3px;
  border-color: transparent;
}

/* line 378, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-mat:not(.has-units), .place-value-mat-widget.correct .pvm-unit-mat {
  -webkit-animation: matBackgroundFlashCorrect 1s;
  -moz-animation: matBackgroundFlashCorrect 1s;
  -ms-animation: matBackgroundFlashCorrect 1s;
  -o-animation: matBackgroundFlashCorrect 1s;
  animation: matBackgroundFlashCorrect 1s;
}

/* line 382, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-mat:not(.has-units) {
  border-color: #00c372;
}

/* line 385, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-mat {
  border-bottom-color: #00c372;
}

/* line 387, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-mat:first-child {
  border-left-color: #00c372;
}

/* line 390, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-mat:last-child {
  border-right-color: #00c372;
}

/* line 394, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-title {
  border-top-color: #00c372;
}

/* line 396, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-title:first-child {
  border-left-color: #00c372;
}

/* line 399, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.correct .pvm-unit-title:last-child {
  border-right-color: #00c372;
}

/* line 366, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect.try-again .pvm-mat:not(.has-units), .place-value-mat-widget.incorrect.try-again .pvm-unit-mat {
  background-color: #ffe3ee;
}

/* line 371, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect:not(.try-again) .pvm-mat:not(.has-units), .place-value-mat-widget.incorrect:not(.try-again) .pvm-unit-mat {
  -webkit-animation: matBackgroundFlashIncorrect 1s;
  -moz-animation: matBackgroundFlashIncorrect 1s;
  -ms-animation: matBackgroundFlashIncorrect 1s;
  -o-animation: matBackgroundFlashIncorrect 1s;
  animation: matBackgroundFlashIncorrect 1s;
}

/* line 382, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-mat:not(.has-units) {
  border-color: #ff4d76;
}

/* line 385, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-mat {
  border-bottom-color: #ff4d76;
}

/* line 387, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-mat:first-child {
  border-left-color: #ff4d76;
}

/* line 390, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-mat:last-child {
  border-right-color: #ff4d76;
}

/* line 394, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-title {
  border-top-color: #ff4d76;
}

/* line 396, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-title:first-child {
  border-left-color: #ff4d76;
}

/* line 399, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget.incorrect .pvm-unit-title:last-child {
  border-right-color: #ff4d76;
}

/* line 411, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-buttons {
  text-align: right;
  margin-top: 10px;
}

/* line 416, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-try-again-cover {
  display: block;
  position: absolute;
  z-index: 11;
  cursor: pointer;
}

/* line 421, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.place-value-mat-widget .pvm-try-again-cover.hidden {
  display: none;
}

/* line 432, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled .pvm-tile.active {
  cursor: pointer;
}

/* line 434, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled .pvm-tile.active.hover, .active-task .place-value-mat-widget.input-enabled .pvm-tile.active.ui-draggable-dragging {
  z-index: 8;
}

/* line 436, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled .pvm-tile.active.hover > .tile-inner, .active-task .place-value-mat-widget.input-enabled .pvm-tile.active.ui-draggable-dragging > .tile-inner {
  box-shadow: 0 0 0 3px #007f99;
}

/* line 442, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled .pvm-mat .pvm-tile.ghost:not(.taken) {
  cursor: pointer;
}

/* line 448, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled.money .pvm-tile.active {
  cursor: pointer;
}

/* line 450, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled.money .pvm-tile.active.hover, .active-task .place-value-mat-widget.input-enabled.money .pvm-tile.active.ui-draggable-dragging {
  z-index: 8;
}

/* line 452, app/assets/stylesheets/shared/widgets/place_value_mat.scss */
.active-task .place-value-mat-widget.input-enabled.money .pvm-tile.active.hover > .tile-inner, .active-task .place-value-mat-widget.input-enabled.money .pvm-tile.active.ui-draggable-dragging > .tile-inner {
  border: 3px solid #007f99;
  box-shadow: 0 0 0 3px transparent;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/widgets/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/widgets/../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/widgets/../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/widgets/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 5, app/assets/stylesheets/shared/widgets/resize_tool.scss */
.resize-tool {
  width: 80px;
  background: #d1d2d4;
  border-radius: 50px;
}

/* line 10, app/assets/stylesheets/shared/widgets/resize_tool.scss */
.resize-tool .difference-resize {
  display: inline-block;
  margin: 6px;
  width: 28px;
  height: 28px;
  line-height: 26px;
  background: #0097b6;
  font-size: 24px;
  font-family: 'Zapf Dingbats', sans-serif;
  text-align: center;
  color: white;
  border-radius: 50%;
  cursor: pointer;
  padding: 2px 4px;
}

/* line 25, app/assets/stylesheets/shared/widgets/resize_tool.scss */
.resize-tool .difference-resize:disabled {
  cursor: default;
  background: #e1e1e1;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/shared/widgets/scattered_tiles.scss */
.scattered-tiles {
  display: inline-block;
  vertical-align: bottom;
  width: 320px;
  height: 400px;
  margin: 10px 20px;
}

/* line 29, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.scattered-tiles .tile-draggable {
  background: #277fba;
  border: 2px solid #B3B3B3;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* line 13, app/assets/stylesheets/shared/widgets/scattered_tiles.scss */
.scattered-tiles .scattered-tile-slot {
  display: inline-block;
  position: relative;
}

/* line 40, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable {
  cursor: pointer;
}

/* line 42, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable:hover {
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset;
}

/* line 45, app/assets/stylesheets/shared/widgets/_tile_array_variables.scss */
.active-task .tile-draggable.ui-draggable-dragging {
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset, 3px 3px 13px 0px rgba(0, 0, 0, 0.5);
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/widgets/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/widgets/../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/widgets/../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/widgets/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 7, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.super-fill-in .task.align-left {
  text-align: left;
}

/* line 10, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.super-fill-in .task.align-right {
  text-align: right;
}

/* line 16, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget:not(.vueified-widget) {
  font-size: 30px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  color: black;
  display: inline-block;
  vertical-align: baseline;
}

/* line 17, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget.align-left:not(.vueified-widget) {
  text-align: left;
}

/* line 20, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget.align-right:not(.vueified-widget) {
  text-align: right;
}

/* line 31, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget:not(.vueified-widget) .token.token-text, .task .super-fill-in-widget:not(.vueified-widget) .token.math-token {
  vertical-align: baseline;
}

/* line 36, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget:not(.vueified-widget) .arrow-way-jump .zearn-input, .task .super-fill-in-widget:not(.vueified-widget) .arrow-way-jump .token {
  font-size: 25px;
}

/* line 40, app/assets/stylesheets/shared/widgets/super_fill_in.scss */
.task .super-fill-in-widget:not(.vueified-widget) .array-token.discs .number-input {
  font-size: 18px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 5, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  vertical-align: top;
  border: 2px solid #0097b6;
  border-radius: 30px;
  padding: 10px 20px;
  margin: 5px;
  overflow: hidden;
  background-color: white;
}

/* line 16, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.incorrect, .super-multiple-choice-widget .smc-choice.correct, .super-multiple-choice-widget .smc-choice.hover, .super-multiple-choice-widget .smc-choice.selected {
  padding: 10px 19px;
  border-width: 3px;
}

/* line 24, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.disabled:not(.page-refreshed), .super-multiple-choice-widget .smc-choice.correct:not(.page-refreshed), .super-multiple-choice-widget .smc-choice.incorrect:not(.page-refreshed) {
  transition: border-color 200ms ease-in-out, background-color 200ms ease-in-out;
}

/* line 29, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.disabled:not(.correct):not(.incorrect), .super-multiple-choice-widget .smc-choice.disabled.try-again {
  border-color: rgba(93, 111, 120, 0.25);
  border-width: 2px;
  background-color: white;
}

/* line 34, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.disabled:not(.correct):not(.incorrect) .smc-choice-inner, .super-multiple-choice-widget .smc-choice.disabled.try-again .smc-choice-inner {
  transition: opacity 200ms ease-in-out;
  opacity: 0.25;
}

/* line 42, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.correct:not(.disabled) {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 46, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.correct.disabled {
  border-color: #5d6f78;
  background-color: white;
}

/* line 53, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.incorrect:not(.disabled) {
  border-color: #ff4d76;
  background-color: #ffe6ee;
}

/* line 57, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice.incorrect.disabled:not(.try-again) {
  border-color: #ff4d76;
  background-color: white;
}

/* line 63, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner {
  line-height: 0;
  width: 100%;
  color: black;
}

/* line 55, app/assets/stylesheets/shared/_student_variables.scss */
body:not(.g6plus) .super-multiple-choice-widget .smc-choice .smc-choice-inner {
  font-size: 25px;
}

/* line 60, app/assets/stylesheets/shared/_student_variables.scss */
body.g6plus .super-multiple-choice-widget .smc-choice .smc-choice-inner {
  font-size: 24px;
}

/* line 70, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner:not(.align-right) {
  margin-right: auto;
}

/* line 73, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner:not(.align-left) {
  margin-left: auto;
}

/* line 77, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner.align-left {
  text-align: left;
}

/* line 81, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner.align-right {
  text-align: right;
}

/* line 85, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner .token-text {
  line-height: normal;
}

/* line 89, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner .token-container .token-text {
  padding-bottom: 5px;
}

/* line 92, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner .token-container .token .token-text {
  padding-bottom: initial;
}

/* line 97, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .smc-choice .smc-choice-inner .nowrap-bundle {
  max-width: 100%;
}

/* line 103, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .scaled-down {
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -o-transform: scale(0.7);
  transform: scale(0.7);
  -moz-transform: scale(0.7) rotate(0.0001deg);
  -ms-transform: scale(0.7) rotate(0.0001deg);
  -webkit-transform-origin: top left 0;
  -moz-transform-origin: top left 0;
  -ms-transform-origin: top left 0;
  -o-transform-origin: top left 0;
  transform-origin: top left 0;
}

/* line 117, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .scaled-down.scaled-down-60 {
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -o-transform: scale(0.6);
  transform: scale(0.6);
  -moz-transform: scale(0.6) rotate(0.0001deg);
  -ms-transform: scale(0.6) rotate(0.0001deg);
}

/* line 120, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .scaled-down.scaled-down-75 {
  -webkit-transform: scale(0.75);
  -moz-transform: scale(0.75);
  -ms-transform: scale(0.75);
  -o-transform: scale(0.75);
  transform: scale(0.75);
  -moz-transform: scale(0.75) rotate(0.0001deg);
  -ms-transform: scale(0.75) rotate(0.0001deg);
}

/* line 125, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice-widget .token-image {
  vertical-align: middle;
}

/* line 132, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.active-task .super-multiple-choice-widget .smc-choice:not(.disabled):not(.incorrect):not(.correct) {
  cursor: pointer;
}

/* line 134, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.active-task .super-multiple-choice-widget .smc-choice.hover:not(.disabled):not(.incorrect):not(.correct) {
  border-color: #007b94;
  background-color: white;
}

/* line 139, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.active-task .super-multiple-choice-widget .smc-choice.selected:not(.disabled):not(.incorrect):not(.correct) {
  border-color: #0097b6;
  background-color: #ccffff;
}

/* line 150, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
.super-multiple-choice .token-digital-clock .digital-clock-hours, .super-multiple-choice .token-digital-clock .digital-clock-minutes, .super-multiple-choice .token-digital-clock .digital-clock-colon {
  margin-top: auto;
  margin-bottom: auto;
}

@-moz-document url-prefix() {
  /* line 157, app/assets/stylesheets/shared/widgets/super_multiple_choice.scss */
  .super-multiple-choice .token-digital-clock .digital-clock-hours, .super-multiple-choice .token-digital-clock .digital-clock-minutes, .super-multiple-choice .token-digital-clock .digital-clock-colon {
    margin-bottom: 24px;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 18, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .node-area, .super-number-bond-widget:not(.vue) .autocorrect-area {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  width: 345px;
  height: 280px;
}

/* line 25, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .canvas {
  position: absolute;
  width: 345px;
  height: 280px;
  margin: 0;
  z-index: 1;
}

/* line 31, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .canvas svg {
  width: 345px;
  height: 280px;
}

/* line 35, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .canvas line {
  stroke: #4d4d4d;
  stroke-width: 2px;
}

/* line 39, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .canvas .lines {
  opacity: 0;
}

/* line 43, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .node-content {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
}

/* line 47, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond {
  position: absolute;
  left: 53.5px;
  top: 196px;
  z-index: 2;
  margin-top: -55px;
  margin-left: -55px;
  cursor: pointer;
}

/* line 56, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond.hide {
  opacity: 0;
}

/* line 60, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node {
  width: 55px;
  overflow: hidden;
}

/* line 64, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node .part-bond-node-inner {
  position: relative;
  width: 110px;
  height: 110px;
  background-color: rgba(255, 230, 238, 0.8);
  border: 2px solid #ff4d76;
  border-radius: 50%;
}

/* line 73, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node.right .part-bond-node-inner {
  left: -100%;
}

/* line 78, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-middle {
  width: 116px;
  display: inline-block;
  background-color: rgba(255, 230, 238, 0.8);
  border: 2px solid #ff4d76;
  border-right-width: 0;
  border-left-width: 0;
  height: 110px;
}

/* line 88, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .whole-node {
  position: absolute;
  z-index: 2;
  left: 50%;
  font-size: 24px;
  margin-left: -56px;
  height: 112px;
  width: 112px;
  border-radius: 50%;
}

/* line 98, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .whole-node:not(.correct):not(.try-again):not(.incorrect) {
  background-color: white;
  border: 2px solid #4d4d4d;
}

/* line 103, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-node {
  position: absolute;
  z-index: 2;
  height: 80px;
  width: 80px;
  border-radius: 50%;
  font-size: 18px;
  margin-top: -40px;
  margin-left: -40px;
}

/* line 113, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-node.large {
  height: 100px;
  width: 100px;
  margin-top: -50px;
  margin-left: -50px;
}

/* line 120, app/assets/stylesheets/shared/widgets/_number_bond_variables.scss */
.super-number-bond-widget:not(.vue) .part-node:not(.correct):not(.try-again):not(.incorrect) {
  background-color: white;
  border: 2px solid #4d4d4d;
}

/* line 20, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .node-area {
  display: block;
  margin: 0 auto;
  height: 246px;
}

/* line 25, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .canvas {
  z-index: 1;
  height: 246px;
}

/* line 28, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .canvas svg {
  height: 246px;
}

/* line 34, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node, .super-number-bond-widget:not(.vue) .part-node {
  z-index: 3;
}

/* line 37, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.correct:not(.final), .super-number-bond-widget:not(.vue) .part-node.correct:not(.final) {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 41, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.incorrect, .super-number-bond-widget:not(.vue) .part-node.incorrect {
  border-color: #ff4d76;
  background-color: #fea5ba;
}

/* line 44, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.incorrect.final, .super-number-bond-widget:not(.vue) .part-node.incorrect.final {
  border-width: 4px;
  background-color: #fff;
}

/* line 50, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again .super-input, .super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again .number-input, .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again .super-input, .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again .number-input {
  border-color: transparent;
  background-color: transparent;
}

/* line 56, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.correctable, .super-number-bond-widget:not(.vue) .part-node.correctable {
  background-color: #ff4d76;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.correctable .token-text, .super-number-bond-widget:not(.vue) .whole-node.correctable .number-input.disabled, .super-number-bond-widget:not(.vue) .part-node.correctable .token-text, .super-number-bond-widget:not(.vue) .part-node.correctable .number-input.disabled {
  color: #fff;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.correctable .fraction .denominator, .super-number-bond-widget:not(.vue) .part-node.correctable .fraction .denominator {
  border-color: #fff;
}

/* line 63, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node .super-fill-in-widget, .super-number-bond-widget:not(.vue) .whole-node .super-fill-in-widget .fraction, .super-number-bond-widget:not(.vue) .whole-node .super-fill-in-widget .number-input {
  font-size: 24px;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.incorrect.final .token-text, .super-number-bond-widget:not(.vue) .whole-node.incorrect.final .number-input.disabled {
  color: #ff4d76;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .whole-node.incorrect.final .fraction .denominator {
  border-color: #ff4d76;
}

/* line 73, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node .super-fill-in-widget, .super-number-bond-widget:not(.vue) .part-node .super-fill-in-widget .fraction, .super-number-bond-widget:not(.vue) .part-node .super-fill-in-widget .number-input {
  font-size: 18px;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.incorrect.final:not(.highlight) .token-text, .super-number-bond-widget:not(.vue) .part-node.incorrect.final:not(.highlight) .number-input.disabled {
  color: black;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.incorrect.final:not(.highlight) .fraction .denominator {
  border-color: black;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .token-text, .super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .number-input.disabled, .super-number-bond-widget:not(.vue) .part-node.highlight.correct.final .token-text, .super-number-bond-widget:not(.vue) .part-node.highlight.correct.final .number-input.disabled {
  color: #fff;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .fraction .denominator, .super-number-bond-widget:not(.vue) .part-node.highlight.correct.final .fraction .denominator {
  border-color: #fff;
}

/* line 88, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight[data-idx="0"]:not(.incorrect):not(.correct):not(.correctable), .super-number-bond-widget:not(.vue) .part-node.highlight.correct.final[data-idx="0"] {
  background-color: #7a00c9;
}

/* line 91, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight[data-idx="1"]:not(.incorrect):not(.correct):not(.correctable), .super-number-bond-widget:not(.vue) .part-node.highlight.correct.final[data-idx="1"] {
  background-color: #eb731c;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .tile .token-text, .super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .tile .number-input.disabled {
  color: black;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight:not(.incorrect):not(.correct):not(.correctable) .tile .fraction .denominator {
  border-color: black;
}

/* line 8, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight.incorrect.final .token-text, .super-number-bond-widget:not(.vue) .part-node.highlight.incorrect.final .number-input.disabled {
  color: #ff4d76;
}

/* line 12, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight.incorrect.final .fraction .denominator {
  border-color: #ff4d76;
}

/* line 103, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight.incorrect.final[data-idx="0"] {
  border-color: #7a00c9;
}

/* line 106, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-node.highlight.incorrect.final[data-idx="1"] {
  border-color: #eb731c;
}

/* line 112, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .number-input.disabled, .super-number-bond-widget:not(.vue) .fraction-input {
  border-color: transparent;
  background-color: transparent;
}

/* line 116, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .fraction-input .number-input:not(.disabled) {
  background: white;
}

/* line 119, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond {
  position: absolute;
  z-index: 2;
  margin-top: -55px;
  margin-left: -55px;
  opacity: 1;
}

/* line 125, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond.hide {
  opacity: 0;
}

/* line 130, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node {
  display: inline-block;
  width: 55px;
  height: 110px;
  overflow: hidden;
}

/* line 135, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node .part-bond-node-inner {
  position: relative;
  width: 110px;
  height: 110px;
  background-color: rgba(254, 165, 186, 0.8);
  border: 2px solid #4d4d4d;
  border-color: #ff4d76;
  border-radius: 50%;
  border-right-color: transparent;
  border-bottom-color: transparent;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/* line 147, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-node.right .part-bond-node-inner {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
  left: -100%;
}

/* line 152, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .part-bond .part-bond-middle {
  display: inline-block;
  background-color: rgba(254, 165, 186, 0.8);
  border: 2px solid #4d4d4d;
  border-color: #ff4d76;
  border-right-width: 0;
  border-left-width: 0;
  height: 110px;
}

/* line 163, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget:not(.vue) .enter-button {
  margin-top: 10px;
}

/* line 169, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.super-number-bond-widget.rendered:not(.vue) .whole-node, .super-number-bond-widget.rendered:not(.vue) .part-node, .super-number-bond-widget.rendered:not(.vue) .part-bond {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

/* line 181, app/assets/stylesheets/shared/widgets/super_number_bond.scss */
.active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-bond:not(.hide), .active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-bond:not(.hide) .number-input,
.active-task.super-number-bond .super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again,
.active-task.super-number-bond .super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again .number-input, .active-task.super-number-bond .super-number-bond-widget:not(.vue) .whole-node.incorrect.correctable, .active-task.super-number-bond .super-number-bond-widget:not(.vue) .whole-node.incorrect.correctable .number-input,
.active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again,
.active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again .number-input, .active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-node.incorrect.correctable, .active-task.super-number-bond .super-number-bond-widget:not(.vue) .part-node.incorrect.correctable .number-input, .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-bond:not(.hide), .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-bond:not(.hide) .number-input,
.active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again,
.active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .whole-node.incorrect.try-again .number-input, .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .whole-node.incorrect.correctable, .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .whole-node.incorrect.correctable .number-input,
.active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again,
.active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-node.incorrect.try-again .number-input, .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-node.incorrect.correctable, .active-task.super-number-bond-tiles .super-number-bond-widget:not(.vue) .part-node.incorrect.correctable .number-input {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-sprite, .rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/tasks/groupsitemsarrays/sprites6.png");
}

/* line 10, app/assets/stylesheets/shared/widgets/../widgets/_gia_variables.scss */
.gia-peg {
  background: #42bfa8;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 2px;
  z-index: 0;
}

/* line 4, app/assets/stylesheets/shared/widgets/../general/button.scss */
button {
  border: none;
  background-color: transparent;
}

/* line 9, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button, .super-forward-button, .super-text-button {
  background-color: #007b94;
  color: white;
  font-weight: 600;
  padding: 4px 10px;
  font-size: 20px;
  border-radius: 20px;
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow, .with-arrow.super-forward-button, .with-arrow.super-text-button {
  padding: 8px 10px 7px 10px;
}

/* line 18, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button.with-arrow .go-arrow, .with-arrow.super-forward-button .go-arrow, .with-arrow.super-text-button .go-arrow {
  vertical-align: middle;
  position: relative;
  top: -1px;
  width: 24px;
  height: 23px;
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/go_arrow.png");
  display: inline-block;
}

/* line 29, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:hover, .super-forward-button:hover, .super-text-button:hover, .zearn-button:focus, .super-forward-button:focus, .super-text-button:focus {
  background-color: #005c73;
}

/* line 33, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled {
  background-color: #cccccc;
  color: white;
}

/* line 39, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button, .plus-button, .minus-button, .zearn-button, .super-forward-button, .super-text-button, .zearn-back-button {
  cursor: pointer;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:hover:enabled, .plus-button:hover:enabled, .minus-button:hover:enabled, .zearn-button:hover:enabled, .super-forward-button:hover:enabled, .super-text-button:hover:enabled, .zearn-back-button:hover:enabled {
  -webkit-box-shadow: 0px 1px 3px 1px #cccccc;
  -moz-box-shadow: 0px 1px 3px 1px #cccccc;
  -ms-box-shadow: 0px 1px 3px 1px #cccccc;
  -o-box-shadow: 0px 1px 3px 1px #cccccc;
  box-shadow: 0px 1px 3px 1px #cccccc;
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:disabled, .plus-button:disabled, .minus-button:disabled, .zearn-button:disabled, .super-forward-button:disabled, .super-text-button:disabled, .zearn-back-button:disabled {
  cursor: default;
}

/* line 49, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button:active:enabled, .down-button.active, .plus-button:active:enabled, .plus-button.active, .minus-button:active:enabled, .minus-button.active, .zearn-button:active:enabled, .super-forward-button:active:enabled, .super-text-button:active:enabled, .zearn-button.active, .active.super-forward-button, .active.super-text-button, .zearn-back-button:active:enabled, .zearn-back-button.active {
  -webkit-box-shadow: 0px 0px 3px 1px #cccccc;
  -moz-box-shadow: 0px 0px 3px 1px #cccccc;
  -ms-box-shadow: 0px 0px 3px 1px #cccccc;
  -o-box-shadow: 0px 0px 3px 1px #cccccc;
  box-shadow: 0px 0px 3px 1px #cccccc;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button img, .plus-button img, .minus-button img, .zearn-button img, .super-forward-button img, .super-text-button img, .zearn-back-button img {
  vertical-align: middle;
}

/* line 58, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button {
  background-color: #d1d2d4;
  padding: 6px 15px 6px 10px;
  display: inline-block;
  border-radius: 40px;
  vertical-align: middle;
  color: #8c8c8c;
  font-weight: 600;
  font-size: 13px;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button img {
  margin-right: 4px;
  margin-top: -2px;
}

/* line 73, app/assets/stylesheets/shared/widgets/../general/button.scss */
.zearn-back-button .back-text {
  display: inline-block;
  vertical-align: middle;
  padding-left: 3px;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button {
  width: 46px;
  height: 46px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
  background-position: -46px -64px;
}

/* line 90, app/assets/stylesheets/shared/widgets/../general/button.scss */
.rotate-button.reverse {
  background-position: 0 -64px;
}

/* line 95, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button, .minus-button {
  background-color: #007b94;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  color: white;
}

/* line 101, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button i, .minus-button i {
  font-size: 16px;
}

/* line 104, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small, .minus-button.small {
  width: 24px;
  height: 24px;
}

/* line 107, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button.small i, .minus-button.small i {
  font-size: 12px;
}

/* line 112, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):hover, .plus-button:not(:disabled):focus, .minus-button:not(:disabled):hover, .minus-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 115, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:not(:disabled):active, .minus-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 119, app/assets/stylesheets/shared/widgets/../general/button.scss */
.plus-button:disabled, .minus-button:disabled {
  background-color: #cccccc;
}

/* line 124, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right {
  width: 17px;
  height: 30px;
}

/* line 128, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft.png");
}

/* line 130, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 135, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright.png");
  background-position: 0px -1px;
}

/* line 138, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/skipright_inactive.png");
  background-position: -1px -3px;
}

/* line 143, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left, .double-skip-right {
  width: 26px;
  height: 30px;
}

/* line 147, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft.png");
}

/* line 149, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-left:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipleft_inactive.png");
  background-position: -1px -4px;
}

/* line 154, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright.png");
  background-position: 0px -1px;
}

/* line 157, app/assets/stylesheets/shared/widgets/../general/button.scss */
.double-skip-right:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/doubleskipright_inactive.png");
  background-position: -1px -3px;
}

/* line 162, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left, .skip-right, .double-skip-left, .double-skip-right {
  display: inline-block;
  vertical-align: middle;
  margin: 0 2px;
  padding: 0;
  cursor: pointer;
  border: 0;
  background-color: transparent;
  background-repeat: no-repeat;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 172, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:disabled, .skip-right:disabled, .double-skip-left:disabled, .double-skip-right:disabled {
  cursor: default;
}

/* line 175, app/assets/stylesheets/shared/widgets/../general/button.scss */
.skip-left:focus, .skip-right:focus, .double-skip-left:focus, .double-skip-right:focus {
  outline: none;
}

/* line 180, app/assets/stylesheets/shared/widgets/../general/button.scss */
.down-button {
  border-radius: 16px;
  cursor: pointer;
  height: 33px;
  width: 61px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.png");
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/Down.svg"), none;
}

/* line 193, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button, .super-enter-button {
  width: 46px;
  height: 46px;
  background-size: 46px 46px;
  position: relative;
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  opacity: 1;
  -webkit-transition: opacity 250ms linear;
  -moz-transition: opacity 250ms linear;
  -ms-transition: opacity 250ms linear;
  -o-transition: opacity 250ms linear;
  transition: opacity 250ms linear;
}

/* line 209, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_default.svg");
}

/* line 213, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_hover.svg");
}

/* line 216, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:active {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enter_pressed.svg");
}

/* line 220, app/assets/stylesheets/shared/widgets/../general/button.scss */
.hidden.super-enter-button {
  opacity: 0;
}

/* line 224, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button, .correct.super-enter-button, .incorrect.super-enter-button {
  cursor: default;
}

/* line 228, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button:disabled, .disabled.super-enter-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/enter/round/enterDisabled2017.svg");
}

/* line 232, app/assets/stylesheets/shared/widgets/../general/button.scss */
.inline.super-enter-button {
  left: 1px;
}

/* line 237, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-enter-button-box {
  text-align: right;
}

/* line 248, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button {
  width: 46px;
  height: 46px;
  margin-right: 3px;
  background-color: #007b94;
  border-radius: 50%;
  color: white;
  cursor: pointer;
}

/* line 256, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button i {
  font-size: 24px;
}

/* line 260, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small {
  height: 40px;
  width: 40px;
}

/* line 263, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button.small i {
  font-size: 22px;
}

/* line 268, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):hover, .super-reset-button:not(:disabled):focus {
  background-color: #005c73;
}

/* line 271, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:not(:disabled):active {
  background-color: #003e4d;
}

/* line 275, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-reset-button:disabled {
  background-color: #cccccc;
  cursor: default;
}

/* line 281, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_active.svgz");
  transform: scale(-1, 1) rotate(180deg);
  margin-right: 3px;
  position: absolute;
  bottom: 20px;
  right: 30px;
  cursor: pointer;
}

/* line 290, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button.reverse {
  transform: scale(1, 1) rotate(180deg);
}

/* line 294, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:disabled {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_inactive_2017.svgz");
  cursor: default;
}

/* line 299, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-rotate-button:not(:disabled):hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/restart_hover.svgz");
}

/* line 308, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button {
  min-width: 160px;
  padding: 8px 20px;
  position: relative;
  text-align: left;
}

/* line 315, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text, .super-text-button .super-text-button-icon {
  vertical-align: middle;
}

/* line 319, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-text {
  margin-right: 40px;
  float: left;
}

/* line 324, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  top: calc(50% - 9px);
  right: 20px;
}

/* line 335, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.restart .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/restart.svg");
}

/* line 338, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-text-button.enter .super-text-button-icon {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/check.svg");
}

/* line 343, app/assets/stylesheets/shared/widgets/../general/button.scss */
a.disabled-link .super-text-button {
  color: #999999;
  background-color: #cccccc;
}

/* line 349, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button {
  background-image: url("//webassets.zearn.org/app_assets/general/arrows/arrow.svg");
  background-repeat: no-repeat;
  background-position: center;
  width: 44px;
  height: 44px;
  border-radius: 22px;
}

/* line 358, app/assets/stylesheets/shared/widgets/../general/button.scss */
.super-forward-button.backwards {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 363, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left, .scroll-right {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -30px;
  display: none;
  background-color: #007b94;
  cursor: pointer;
}

/* line 373, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left i, .scroll-right i {
  color: white;
  font-size: 24px;
  margin-top: 7px;
}

/* line 378, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.disabled, .scroll-right.disabled {
  background-color: #cccccc;
}

/* line 382, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left.hover:not(.disabled), .scroll-left:not(.disabled):hover, .scroll-left:not(.disabled):focus, .scroll-right.hover:not(.disabled), .scroll-right:not(.disabled):hover, .scroll-right:not(.disabled):focus {
  background-color: #005c73;
}

/* line 385, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left:not(.disabled):active, .scroll-right:not(.disabled):active {
  background-color: #003e4d;
}

/* line 390, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-left {
  left: 0px;
}

/* line 393, app/assets/stylesheets/shared/widgets/../general/button.scss */
.scroll-right {
  right: 0px;
}

/* line 398, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech {
  padding-bottom: 2px;
}

/* line 402, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover, .text-2-speech-hover-play {
  background-size: 12px 2px;
  background-position: center bottom;
  background-repeat: repeat-x;
}

/* line 407, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashBlue.svg");
}

/* line 410, app/assets/stylesheets/shared/widgets/../general/button.scss */
.text-2-speech-hover-play {
  background-image: url("//webassets.zearn.org/app_assets/general/buttons/Text2SpeechDashGray.svg");
}

/* line 15, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  margin: 3px;
  border: 3px solid transparent;
}

/* line 38, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.hidden {
  display: none;
}

/* line 41, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.selected {
  border-color: #0097b6;
}

/* line 44, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.ghost {
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item:not(.ghost) {
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.58);
}

/* line 50, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.thousandths:not(.ghost) {
  background-color: #77cc00;
}

/* line 53, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.hundredths:not(.ghost) {
  background-color: #136fcb;
}

/* line 56, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.tenths:not(.ghost) {
  background-color: #ee589e;
}

/* line 59, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.ones:not(.ghost) {
  background-color: #b7a993;
}

/* line 62, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.tens:not(.ghost) {
  background-color: #ea2429;
}

/* line 65, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.hundreds:not(.ghost) {
  background-color: #eb731c;
}

/* line 68, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.thousands:not(.ghost) {
  background-color: #eebc1c;
}

/* line 71, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.tenthousands:not(.ghost) {
  background-color: #31b643;
}

/* line 74, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.hundredthousands:not(.ghost) {
  background-color: #67aad3;
}

/* line 77, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.millions:not(.ghost) {
  background-color: #7a00c9;
}

/* line 80, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.orange:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_orange.png");
}

/* line 83, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs .slot-item.purple:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/discs/disc_purple.png");
}

/* line 91, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs.has-discs-num .slot-item:not(.ghost)::before {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  font-size: 12px;
  font-weight: bold;
  color: white;
}

/* line 102, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs.has-discs-num .slot-item.ones:not(.ghost)::before {
  content: '1';
}

/* line 105, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs.has-discs-num .slot-item.tens:not(.ghost)::before {
  content: '10';
}

/* line 108, app/assets/stylesheets/shared/widgets/../general/discs.scss */
.super-place-value-chart-widget.discs.has-discs-num .slot-item.hundreds:not(.ghost)::before {
  content: '100';
}

/* line 16, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item {
  display: inline-block;
  top: 0;
  left: 0;
  width: 68px;
  height: 32px;
  border: 3px solid transparent;
  background-repeat: no-repeat;
}

/* line 25, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.hidden {
  display: none;
}

/* line 28, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.selected {
  border-color: #007f99;
  position: absolute;
  top: 0;
  left: 0;
}

/* line 34, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.ghost {
  height: 26px;
  width: 62px;
  margin: 3px 0 0 3px;
  border: 3px dotted #999999;
  background-color: rgba(153, 153, 153, 0.4);
}

/* line 42, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.ones:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/1dollar.svg");
}

/* line 45, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.tens:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/10dollar.svg");
}

/* line 48, app/assets/stylesheets/shared/widgets/../general/money.scss */
.super-place-value-chart-widget.money .slot-item.hundreds:not(.ghost) {
  background-image: url("//webassets.zearn.org/app_assets/tasks/money/100dollar.svg");
}

/* line 21, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap {
  position: relative;
  display: inline-block;
}

/* line 25, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-label {
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 10px;
}

/* line 30, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc, .super-place-value-chart-widget .super-pvc-graveyard {
  display: table;
  width: 100%;
}

/* line 33, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header, .super-place-value-chart-widget .super-pvc .super-pvc-cell, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-header, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cell {
  display: table-cell;
  position: relative;
  background-color: white;
  border-style: solid;
  border-color: #808080;
}

/* line 39, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header:first-child, .super-place-value-chart-widget .super-pvc .super-pvc-cell:first-child, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-header:first-child, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cell:first-child {
  border-left-width: 2px;
}

/* line 42, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header:last-child, .super-place-value-chart-widget .super-pvc .super-pvc-cell:last-child, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-header:last-child, .super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cell:last-child {
  border-right-width: 2px;
}

/* line 51, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc .super-pvc-header:nth-child(1), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc .super-pvc-cell:nth-child(1), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc-graveyard .super-pvc-header:nth-child(1), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc-graveyard .super-pvc-cell:nth-child(1) {
  border-right-width: 4px;
  position: relative;
}

/* line 55, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc .super-pvc-header:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc .super-pvc-cell:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc-graveyard .super-pvc-header:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-1 .super-pvc-graveyard .super-pvc-cell:nth-child(2) {
  border-left-width: 4px;
}

/* line 51, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc .super-pvc-header:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc .super-pvc-cell:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc-graveyard .super-pvc-header:nth-child(2), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc-graveyard .super-pvc-cell:nth-child(2) {
  border-right-width: 4px;
  position: relative;
}

/* line 55, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc .super-pvc-header:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc .super-pvc-cell:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc-graveyard .super-pvc-header:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-2 .super-pvc-graveyard .super-pvc-cell:nth-child(3) {
  border-left-width: 4px;
}

/* line 51, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc .super-pvc-header:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc .super-pvc-cell:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc-graveyard .super-pvc-header:nth-child(3), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc-graveyard .super-pvc-cell:nth-child(3) {
  border-right-width: 4px;
  position: relative;
}

/* line 55, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc .super-pvc-header:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc .super-pvc-cell:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc-graveyard .super-pvc-header:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-3 .super-pvc-graveyard .super-pvc-cell:nth-child(4) {
  border-left-width: 4px;
}

/* line 51, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc .super-pvc-header:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc .super-pvc-cell:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc-graveyard .super-pvc-header:nth-child(4), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc-graveyard .super-pvc-cell:nth-child(4) {
  border-right-width: 4px;
  position: relative;
}

/* line 55, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc .super-pvc-header:nth-child(5), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc .super-pvc-cell:nth-child(5), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc-graveyard .super-pvc-header:nth-child(5), .super-place-value-chart-widget .super-pvc-wrap.decimal-at-4 .super-pvc-graveyard .super-pvc-cell:nth-child(5) {
  border-left-width: 4px;
}

/* line 63, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-headers, .super-place-value-chart-widget .super-pvc .super-pvc-cells, .super-place-value-chart-widget .super-pvc .super-pvc-total-displays {
  display: table-row;
}

/* line 66, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display-wrap {
  display: table-cell;
  z-index: 1;
  position: relative;
}

/* line 71, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display {
  font-size: 18px;
  color: #fff;
  display: inline-block;
  position: relative;
  top: -10px;
  padding: 5px 10px;
  border: 0;
  background-color: #787778;
  border-radius: 4px;
}

/* line 81, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display .super-pvc-num {
  font-weight: bold;
}

/* line 88, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display.ones, .super-place-value-chart-widget .super-pvc .super-pvc-total-display.tens, .super-place-value-chart-widget .super-pvc .super-pvc-total-display.tenths {
  min-width: 90px;
}

/* line 91, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display.hundreds, .super-place-value-chart-widget .super-pvc .super-pvc-total-display.thousands {
  min-width: 120px;
}

/* line 94, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-total-display.hundredths, .super-place-value-chart-widget .super-pvc .super-pvc-total-display.thousandths {
  min-width: 140px;
}

/* line 99, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header {
  font-size: 20px;
  font-weight: bold;
  color: black;
  background-color: #f0f5f7;
  border-width: 2px 1px;
}

/* line 106, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header .super-pvc-header-inner {
  position: relative;
  padding: 10px 0;
}

/* line 111, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header .qty-buttons {
  margin-top: 5px;
  font-size: 0;
}

/* line 114, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header .qty-buttons button:first-child {
  margin-right: 15px;
}

/* line 119, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-header .decimal {
  position: absolute;
  width: 16px;
  height: 16px;
  background: black;
  border-radius: 10px;
  bottom: -9px;
  right: -12px;
  z-index: 1;
}

/* line 130, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-cell {
  vertical-align: top;
  border-width: 0 1px 2px 1px;
  background: #f3fdff;
}

/* line 134, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc .super-pvc-cell .super-pvc-slot-group {
  display: inline-block;
  vertical-align: top;
}

/* line 140, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-cell-highlight {
  display: none;
  position: absolute;
  border: 3px solid #0097b6;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

/* line 150, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-cell.hover .super-pvc-cell-highlight {
  display: block;
}

/* line 153, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-cell.incorrect {
  background: #ffe3ee;
}

/* line 156, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-cell.correct {
  background: #ccffd9;
}

/* line 161, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.display-only .super-pvc .super-pvc-cell:not(.highlighted) {
  background-color: #fff;
}

/* line 164, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.display-only .super-pvc-graveyard .slot-item:not(.ghost) {
  opacity: .5;
}

/* line 169, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-bundling:not(.has-total-displays) .super-pvc, .super-place-value-chart-widget.has-graveyard .super-pvc {
  margin-bottom: 40px;
}

/* line 177, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-total-displays:not(.has-horiz-slots) .super-pvc-slot-group, .super-place-value-chart-widget.has-bundling:not(.has-horiz-slots) .super-pvc-slot-group {
  padding-bottom: 15px;
}

/* line 184, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots.has-total-displays .super-pvc-cells.last .super-pvc-slot-group.last, .super-place-value-chart-widget.has-horiz-slots.has-bundling .super-pvc-cells.last .super-pvc-slot-group.last {
  padding-bottom: 15px;
}

/* line 188, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots .super-pvc-cell:not(.display-vertical) .super-pvc-slot-group {
  display: block;
}

/* line 190, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots .super-pvc-cell:not(.display-vertical) .super-pvc-slot-group .super-pvc-slot {
  vertical-align: top;
}

/* line 197, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots .super-pvc.hover:not([data-num-rows='1']) .super-pvc-cells:not(.last) .super-pvc-cell.hover .super-pvc-cell-highlight {
  border-bottom-width: 0;
}

/* line 200, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots .super-pvc.hover:not([data-num-rows='1']) .super-pvc-cells:not(.first) .super-pvc-cell.hover .super-pvc-cell-highlight {
  border-top-width: 0;
}

/* line 206, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots.discs .super-pvc-cell:not(.display-vertical) .super-pvc-slot {
  display: inline-block;
}

/* line 211, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots.has-shared-columns .super-pvc .super-pvc-cells:not(.last) .super-pvc-cell {
  border-bottom: 0;
}

/* line 217, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-horiz-slots .super-pvc-cell.display-vertical {
  width: 203px;
}

/* line 222, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-row-mask, .super-place-value-chart-widget .super-pvc-col-highlight {
  position: absolute;
}

/* line 224, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-row-mask.hidden, .super-place-value-chart-widget .super-pvc-col-highlight.hidden {
  display: none;
}

/* line 229, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-row-mask {
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 7;
}

/* line 234, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-col-highlight {
  border: 6px solid #fad232;
  z-index: 2;
  pointer-events: none;
}

/* line 241, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-error .super-pvc-total-display-wrap {
  z-index: 11;
  position: relative;
}

/* line 245, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-error .super-pvc-total-display {
  background-color: #787778;
  position: relative;
  z-index: 11;
}

/* line 251, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-error:not(.has-fast-bundle) .super-pvc-bundle-funnel.active {
  background: url("//webassets.zearn.org/app_assets/tasks/super_pvc/funnel_inactive.svgz") no-repeat;
}

/* line 256, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-error.has-fast-bundle .super-pvc-bundle-funnel.active {
  background-color: #cccccc;
}

/* line 260, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-error .super-pvc-bundle-funnel {
  z-index: 11;
}

/* line 265, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-enter-box {
  margin-top: 4px;
}

/* line 269, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-reset-box {
  margin-top: 4px;
  text-align: right;
}

/* line 274, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-slot {
  position: relative;
  width: 40px;
  height: 40px;
}

/* line 280, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item {
  position: relative;
  z-index: 5;
  opacity: 1;
  border-radius: 50%;
}

/* line 285, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.ghost {
  z-index: 4;
  position: absolute;
}

/* line 289, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.hidden {
  display: none;
}

/* line 292, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.invisible {
  visibility: hidden;
}

/* line 295, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.selected::after {
  display: block;
  position: absolute;
  content: '';
  background: url("//webassets.zearn.org/app_assets/tasks/super_pvc/selected_dark.svgz") no-repeat;
  width: 17px;
  height: 17px;
  top: -1px;
  right: -3px;
}

/* line 305, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.selected, .super-place-value-chart-widget .slot-item.scaffold-bundle {
  border-color: #0097b6;
}

/* line 308, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.selected, .super-place-value-chart-widget .slot-item.selected-helper {
  z-index: 6;
}

/* line 311, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .slot-item.transition {
  transition-property: all;
  transition-duration: 1s;
  transition-timing-function: ease-in-out;
  z-index: 9;
}

/* line 320, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cell {
  border-width: 2px 1px;
}

/* line 322, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cell:not(.correct):not(.incorrect) {
  background: #c4d4d6;
}

/* line 326, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-graveyard .super-pvc-cells:not(.first) .super-pvc-cell {
  border-top-width: 0;
}

/* line 331, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.money .super-pvc-slot {
  width: 68px;
  height: 32px;
}

/* line 335, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.money .slot-item {
  border-radius: 0;
}

/* line 337, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.money .slot-item.ghost {
  left: 0;
}

/* line 342, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.money .super-pvc-total-display.ones, .super-place-value-chart-widget.money .super-pvc-total-display.tens, .super-place-value-chart-widget.money .super-pvc-total-display.hundreds {
  min-width: 100px;
}

/* line 346, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.money .super-pvc-bundle-drag .slot-item {
  position: relative;
}

/* line 351, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.discs:not(.has-discs-num) .slot-item.selected::after {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  content: '';
  top: 0;
  right: 0;
  background: url("//webassets.zearn.org/app_assets/general/arrows/check.svg") no-repeat center center;
  background-size: 70%;
}

/* line 363, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-drag-outer {
  display: inline-block;
}

/* line 366, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-drag {
  z-index: 9;
  text-align: left;
  margin: 5px;
  display: inline-block;
  vertical-align: top;
}

/* line 373, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-drag-col {
  display: inline-block;
  vertical-align: bottom;
}

/* line 378, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .display-vertical .super-pvc-bundle-drag-col {
  display: table-cell;
}

/* line 381, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-horiz-slots) .super-pvc-bundle-drag-col .slot-item {
  display: block;
}

/* line 385, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
}

/* line 390, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle .slot-item {
  position: absolute;
}

/* line 395, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-funnel-cells {
  display: table-row;
  border: 0;
}

/* line 399, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-funnel-cell {
  display: table-cell;
  position: relative;
  border: 0;
}

/* line 404, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-funnel {
  position: absolute;
  z-index: 3;
}

/* line 407, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-funnel.bundle-in {
  z-index: 9;
}

/* line 412, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-fast-bundle) .super-pvc-bundle-funnel {
  background: url("//webassets.zearn.org/app_assets/tasks/super_pvc/funnel_inactive.svgz") no-repeat;
  width: 140px;
  height: 49px;
  left: -70px;
  top: -15px;
  border: 0;
}

/* line 419, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-fast-bundle) .super-pvc-bundle-funnel.active {
  background: url("//webassets.zearn.org/app_assets/tasks/super_pvc/funnel_active.svgz") no-repeat;
}

/* line 424, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-fast-bundle) .slot-item.bundle-in.transition {
  -webkit-animation: bundleIn 1s ease-in-out 1 forwards;
  -moz-animation: bundleIn 1s ease-in-out 1 forwards;
  -ms-animation: bundleIn 1s ease-in-out 1 forwards;
  -o-animation: bundleIn 1s ease-in-out 1 forwards;
  animation: bundleIn 1s ease-in-out 1 forwards;
}

@-webkit-keyframes bundleIn {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
}

@-moz-keyframes bundleIn {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
}

@-o-keyframes bundleIn {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
}

@keyframes bundleIn {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
}

/* line 437, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-fast-bundle) .slot-item.bundle-out.pre-transition {
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
}

/* line 440, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget:not(.has-fast-bundle) .slot-item.bundle-out.transition {
  -webkit-animation: bundleOut 1s ease-in-out 1 forwards;
  -moz-animation: bundleOut 1s ease-in-out 1 forwards;
  -ms-animation: bundleOut 1s ease-in-out 1 forwards;
  -o-animation: bundleOut 1s ease-in-out 1 forwards;
  animation: bundleOut 1s ease-in-out 1 forwards;
}

@-webkit-keyframes bundleOut {
  0% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes bundleOut {
  0% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes bundleOut {
  0% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes bundleOut {
  0% {
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    -ms-transform: scale(0.5);
    -o-transform: scale(0.5);
    transform: scale(0.5);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

/* line 455, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-fast-bundle .super-pvc-bundle-funnel {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 33px;
  height: 30px;
  left: -16px;
  top: -15px;
  background-color: #cccccc;
  border-radius: 7px;
}

/* line 465, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-fast-bundle .super-pvc-bundle-funnel.active {
  background-color: #0097b6;
}

/* line 468, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-fast-bundle .super-pvc-bundle-funnel svg {
  width: 21px;
  height: 21px;
}

/* line 471, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-fast-bundle .super-pvc-bundle-funnel svg line, .super-place-value-chart-widget.has-fast-bundle .super-pvc-bundle-funnel svg polyline {
  fill: none;
  stroke: white;
  stroke-width: 2px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* line 482, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-fast-bundle .slot-item.transition.bundle-in, .super-place-value-chart-widget.has-fast-bundle .slot-item.transition.bundle-out {
  transition-duration: 0.5s;
}

/* line 489, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error-wrap {
  text-align: center;
  position: absolute;
  top: -65px;
  z-index: 12;
  width: 100%;
}

/* line 496, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget.has-label .super-pvc-bundle-error-wrap {
  top: -30px;
}

/* line 499, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error {
  background-color: #ffe3ee;
  color: #000;
  font-size: 20px;
  font-weight: bold;
  display: table;
  min-width: 530px;
  border-radius: 20px;
  position: relative;
  margin: 0 auto;
  -webkit-box-shadow: 0px 0px 0px 3px #ff4d76;
  -moz-box-shadow: 0px 0px 0px 3px #ff4d76;
  -ms-box-shadow: 0px 0px 0px 3px #ff4d76;
  -o-box-shadow: 0px 0px 0px 3px #ff4d76;
  box-shadow: 0px 0px 0px 3px #ff4d76;
}

/* line 514, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error.hidden {
  display: none;
}

/* line 517, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-msg, .super-place-value-chart-widget .super-pvc-bundle-error .error-button-wrap {
  position: relative;
  display: table-cell;
  vertical-align: middle;
  width: auto;
  z-index: 2;
}

/* line 524, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-msg {
  text-align: left;
  padding: 0 0 0 20px;
}

/* line 528, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-button-wrap {
  width: 100px;
}

/* line 531, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-button {
  position: relative;
  background-color: #0097b6;
  padding: 4px 10px;
  color: #fff;
  font-weight: 600;
  font-size: 20px;
  border-radius: 20px;
  margin: 8px 0;
  cursor: pointer;
}

/* line 541, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-button .error-button-inner {
  padding: 5px 10px;
}

/* line 544, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-button.disabled {
  background-color: #cccccc;
}

/* line 547, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .error-button:hover {
  background-color: #048ec3;
}

/* line 551, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error .caret {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  background-color: #ffe3ee;
  border: 3px solid #ff4d76;
  border-width: 0 3px 3px 0;
  width: 26px;
  height: 26px;
  position: absolute;
  bottom: -15px;
  left: calc(50% - 15px);
  z-index: 1;
  border-radius: 0 0 5px 0;
}

/* line 564, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error.col-first .caret {
  left: calc(16% - 15px);
}

/* line 567, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error.col-last .caret {
  left: calc(83% - 15px);
}

/* line 571, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-widget .super-pvc-bundle-error-cover {
  position: absolute;
  z-index: 10;
  background-color: #fff;
  opacity: .6;
}

/* line 582, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget .super-pvc-cell.incorrect {
  cursor: pointer;
}

/* line 589, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled.has-bundling:not(.has-touch) .slot-item:hover:not(.selected):not(.ghost):not(.locked), .active-task .super-place-value-chart-widget.input-enabled.has-shared-columns:not(.has-touch) .slot-item:hover:not(.selected):not(.ghost):not(.locked), .active-task .super-place-value-chart-widget.input-enabled.has-graveyard:not(.has-touch) .slot-item:hover:not(.selected):not(.ghost):not(.locked) {
  border-color: #007f99;
}

/* line 593, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled.has-bundling .slot-item:not(.locked), .active-task .super-place-value-chart-widget.input-enabled.has-shared-columns .slot-item:not(.locked), .active-task .super-place-value-chart-widget.input-enabled.has-graveyard .slot-item:not(.locked) {
  cursor: pointer;
}

/* line 599, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled.has-bundling .super-pvc-bundle-funnel.active {
  cursor: pointer;
}

/* line 602, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled.has-bundling:not(.has-fast-bundle) .super-pvc-bundle-funnel.active:hover {
  background: url("//webassets.zearn.org/app_assets/tasks/super_pvc/funnel_hover.svgz") no-repeat;
}

/* line 605, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled.has-bundling.has-fast-bundle .super-pvc-bundle-funnel.active:hover {
  background-color: #048ec3;
}

/* line 609, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.active-task .super-place-value-chart-widget.input-enabled .super-pvc-cell.clickable, .active-task .super-place-value-chart-widget.input-enabled .super-pvc-graveyard .super-pvc-cell {
  cursor: pointer;
}

@-webkit-keyframes select {
  0% {
    border-color: transparent;
  }
  33%, 66% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@-moz-keyframes select {
  0% {
    border-color: transparent;
  }
  33%, 66% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@-o-keyframes select {
  0% {
    border-color: transparent;
  }
  33%, 66% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@keyframes select {
  0% {
    border-color: transparent;
  }
  33%, 66% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@-webkit-keyframes pulseTwiceAndSelect {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  40% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    border-color: transparent;
  }
  60%, 80% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@-moz-keyframes pulseTwiceAndSelect {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  40% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    border-color: transparent;
  }
  60%, 80% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@-o-keyframes pulseTwiceAndSelect {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  40% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    border-color: transparent;
  }
  60%, 80% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

@keyframes pulseTwiceAndSelect {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  10% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  20% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  30% {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
  }
  40% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    border-color: transparent;
  }
  60%, 80% {
    border-color: rgba(0, 151, 182, 0.75);
  }
  100% {
    border-color: transparent;
  }
}

/* line 640, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:first-child .slot-item {
  -webkit-animation: pulseTwiceAndSelect 1500ms linear;
  -moz-animation: pulseTwiceAndSelect 1500ms linear;
  -ms-animation: pulseTwiceAndSelect 1500ms linear;
  -o-animation: pulseTwiceAndSelect 1500ms linear;
  animation: pulseTwiceAndSelect 1500ms linear;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(2) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(3) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(4) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(5) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(6) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(7) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(8) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(9) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 644, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart-bundle .super-pvc-cell.pulse-discs .super-pvc-slot-group:first-child .super-pvc-slot:nth-child(10) .slot-item {
  -webkit-animation: select 900ms linear 600ms;
  -moz-animation: select 900ms linear 600ms;
  -ms-animation: select 900ms linear 600ms;
  -o-animation: select 900ms linear 600ms;
  animation: select 900ms linear 600ms;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-wrap, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-wrap {
  width: 211.6666666667px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-header, .super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-cell, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-cell, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-cell {
  width: 211.6666666667px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-slot, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-slot, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-slot {
  width: 40px;
  height: 40px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .slot-item, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .slot-item, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .slot-item {
  width: 34px;
  height: 34px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-header {
  font-size: 20px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-1-col .super-pvc-total-display, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-1-col .super-pvc-total-display, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-1-col .super-pvc-total-display {
  font-size: 18px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-wrap, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-wrap {
  width: 423.3333333333px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-header, .super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-cell, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-cell, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-cell {
  width: 211.6666666667px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-slot, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-slot, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-slot {
  width: 40px;
  height: 40px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .slot-item, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .slot-item, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .slot-item {
  width: 34px;
  height: 34px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-header {
  font-size: 20px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-2-col .super-pvc-total-display, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-2-col .super-pvc-total-display, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-2-col .super-pvc-total-display {
  font-size: 18px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-wrap, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-wrap {
  width: 635px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-header, .super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-cell, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-cell, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-cell {
  width: 211.6666666667px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-slot, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-slot, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-slot {
  width: 40px;
  height: 40px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .slot-item, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .slot-item, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .slot-item {
  width: 34px;
  height: 34px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-header {
  font-size: 20px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-3-col .super-pvc-total-display, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-3-col .super-pvc-total-display, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-3-col .super-pvc-total-display {
  font-size: 18px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-wrap, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-wrap {
  width: 635px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-header, .super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-cell, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-cell, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-cell {
  width: 158.75px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot {
  width: 30px;
  height: 30px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .slot-item, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .slot-item, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .slot-item {
  width: 26px;
  height: 26px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-header {
  font-size: 19px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-total-display, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-total-display, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-total-display {
  font-size: 17px;
}

/* line 688, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot-group.last, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot-group.last, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-4-col .super-pvc-slot-group.last {
  margin-bottom: 2px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap {
  width: 635px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell {
  width: 127px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot {
  width: 24px;
  height: 24px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .slot-item, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .slot-item, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .slot-item {
  width: 20px;
  height: 20px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-header {
  font-size: 17px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display {
  font-size: 15px;
}

/* line 694, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot-group.last, .super-place-value-chart-algorithm .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot-group.last, .super-place-value-chart-bundle .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot-group.last {
  margin-bottom: 2px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-wrap {
  width: 835px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-cell {
  width: 167px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-slot {
  width: 32px;
  height: 32px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .slot-item, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .slot-item, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .slot-item {
  width: 26px;
  height: 26px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-header {
  font-size: 16px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-5-col .super-pvc-total-display {
  font-size: 14px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-wrap, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-wrap, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-wrap {
  width: 835px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header, .super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-cell, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-cell, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-cell {
  width: 139.1666666667px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-slot, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-slot, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-slot {
  width: 26px;
  height: 26px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .slot-item, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .slot-item, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .slot-item {
  width: 20px;
  height: 20px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-header {
  font-size: 16px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-total-display, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-total-display, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-6-col .super-pvc-total-display {
  font-size: 14px;
}

/* line 653, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-wrap, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-wrap, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-wrap {
  width: 854px;
}

/* line 656, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header, .super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-cell, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-cell, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-cell {
  width: 122px;
}

/* line 660, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot {
  width: 23px;
  height: 23px;
}

/* line 664, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .slot-item, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .slot-item, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .slot-item {
  width: 20px;
  height: 20px;
}

/* line 668, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-header {
  font-size: 17px;
}

/* line 671, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-total-display, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-total-display, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-total-display {
  font-size: 15px;
}

/* line 710, app/assets/stylesheets/shared/widgets/super_place_value_chart.scss */
.super-place-value-chart.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot-group.last, .super-place-value-chart-algorithm.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot-group.last, .super-place-value-chart-bundle.grid-12 .super-place-value-chart-widget.discs.has-7-col .super-pvc-slot-group.last {
  margin-bottom: 2px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  margin: 10px 0 0 0;
  vertical-align: middle;
}

/* line 11, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc {
  position: absolute;
  left: 0px;
  width: 40px;
  height: 40px;
  background-color: transparent;
  background-size: 40px 40px;
  -webkit-transition: opacity, 250ms, linear;
  -moz-transition: opacity, 250ms, linear;
  -ms-transition: opacity, 250ms, linear;
  -o-transition: opacity, 250ms, linear;
  transition: opacity, 250ms, linear;
}

/* line 20, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-disc-a {
  background-image: url("//webassets.zearn.org/app_assets/tasks/ten_frames/disc_purple.svg");
}

/* line 23, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-disc-b {
  background-image: url("//webassets.zearn.org/app_assets/tasks/ten_frames/disc_orange.svg");
}

/* line 28, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-disc-a .face-img, .ten-frames-widget .ten-frame-disc.tf-disc-b .face-img {
  display: none;
  background-repeat: no-repeat;
  height: 150%;
  margin: -5px 1px;
}

/* line 34, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-disc-a.show-face .face-img, .ten-frames-widget .ten-frame-disc.tf-disc-b.show-face .face-img {
  display: block;
}

/* line 39, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.ui-draggable:not(.ui-draggable-disabled) {
  cursor: pointer;
}

/* line 43, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-subtracted {
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
  left: 72px;
  opacity: 0.3;
}

/* line 48, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.tf-subtracted-extra {
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
  left: 140px;
  opacity: 0.3;
}

/* line 54, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.inactive {
  opacity: 0.3;
}

/* line 58, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.jiggle {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 62, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-disc.pulse {
  -webkit-animation: pulse 700ms ease-in-out infinite;
  -moz-animation: pulse 700ms ease-in-out infinite;
  -ms-animation: pulse 700ms ease-in-out infinite;
  -o-animation: pulse 700ms ease-in-out infinite;
  animation: pulse 700ms ease-in-out infinite;
}

/* line 67, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow, .ten-frames-widget .ten-frame {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

/* line 72, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-col, .ten-frames-widget .ten-frame .ten-frame-col {
  display: inline-block;
  vertical-align: top;
}

/* line 76, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-col:first-child .ten-frame-cell, .ten-frames-widget .ten-frame .ten-frame-col:first-child .ten-frame-cell {
  border-right-width: 2px;
}

/* line 81, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-col:last-child .ten-frame-cell, .ten-frames-widget .ten-frame .ten-frame-col:last-child .ten-frame-cell {
  border-left-width: 2px;
}

/* line 87, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell, .ten-frames-widget .ten-frame .ten-frame-cell {
  width: 50px;
  height: 50px;
  border-style: solid;
  border-width: 0px 0px 4px 0;
}

/* line 93, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell:last-child, .ten-frames-widget .ten-frame .ten-frame-cell:last-child {
  border-bottom-width: 0;
}

/* line 97, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell .ten-frame-slot, .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot {
  position: relative;
  width: 40px;
  height: 40px;
  top: 3px;
  left: 4px;
  border: 4px dotted transparent;
  border-radius: 30px;
  -webkit-transition: border-color, 250ms, linear;
  -moz-transition: border-color, 250ms, linear;
  -ms-transition: border-color, 250ms, linear;
  -o-transition: border-color, 250ms, linear;
  transition: border-color, 250ms, linear;
}

/* line 107, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell .ten-frame-slot .ten-frame-disc, .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc {
  top: -4px;
  left: -4px;
}

/* line 110, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-subtracted, .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-subtracted {
  left: 72px;
}

/* line 113, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-subtracted-extra, .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-subtracted-extra {
  left: 140px;
}

/* line 119, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell .ten-frame-slot.ui-droppable .ten-frame-disc.ui-draggable.ui-draggable-disabled, .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot.ui-droppable .ten-frame-disc.ui-draggable.ui-draggable-disabled {
  cursor: default;
}

/* line 128, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-overflow .ten-frame-cell {
  border-color: transparent;
}

/* line 133, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame {
  border: 3px solid #808080;
  border-radius: 4px;
  margin: 0 5px;
}

/* line 138, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame.full {
  background: yellow;
}

/* line 142, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame .ten-frame-cell {
  border-color: #808080;
  border-width: 2px;
  background: #f3fdff;
  -webkit-transition: background, 250ms, linear;
  -moz-transition: background, 250ms, linear;
  -ms-transition: background, 250ms, linear;
  -o-transition: background, 250ms, linear;
  transition: background, 250ms, linear;
}

/* line 150, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame .ten-frame-cell.tf-hint-a .ten-frame-slot:empty, .ten-frames-widget .ten-frame .ten-frame-cell.tf-hint-b .ten-frame-slot:empty {
  border-color: #808080;
}

/* line 155, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame .ten-frame-cell.tf-hint-a {
  background: #bc7fe3;
}

/* line 159, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame .ten-frame-cell.tf-hint-b {
  background: #f5bfa0;
}

/* line 163, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame .ten-frame-cell.tf-hint {
  background: #6ecbdb;
}

/* line 168, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame.tf-incorrect {
  border: 2px solid red;
  box-shadow: 0 0 0px 4px red;
}

/* line 172, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame.tf-correct {
  border: 2px solid #0fa566;
  box-shadow: 0 0 0px 4px #0fa566;
}

/* line 179, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame.five-frame .ten-frame-col {
  margin-right: 0px;
}

/* line 181, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame.five-frame .ten-frame-col:nth-child(2) {
  display: none;
}

/* line 189, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.ten-frames-widget .ten-frame-op {
  vertical-align: middle;
  font-size: 40px;
  margin: 0 20px;
}

/* line 197, app/assets/stylesheets/shared/widgets/ten_frames.scss */
.active-task .ten-frames-widget .ten-frame-disc.ui-draggable:not(.ui-draggable-disabled),
.active-task .ten-frames-widget .ten-frame-slot.ui-droppable:not(.ui-droppable-disabled) {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles {
  display: inline-block;
  vertical-align: bottom;
  margin: 50px 0 10px 50px;
  border-radius: 0;
  padding-bottom: 0;
}

/* line 13, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles.centered {
  margin: 50px;
}

/* line 17, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-col-button-wrapper {
  height: 0;
}

/* line 21, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .no-button-wrapper {
  margin-top: 0;
  margin-left: 50px;
}

/* line 26, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-cell-dot {
  display: none;
}

/* line 30, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid {
  background-color: #F3F3F3;
}

/* line 34, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid.dragging .array-grid-cell.clickable:not(.filled):hover .array-cell-plus {
  display: none;
}

/* line 39, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid.dragging .array-cell-image.tile-draggable.ui-draggable-dragging {
  border-color: #B3B3B3;
  border-style: solid;
  border-width: 2px;
  width: 100%;
  height: 100%;
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset, 3px 3px 13px 0px rgba(0, 0, 0, 0.5);
}

/* line 51, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell .array-grid-cell-inner {
  width: 100%;
  height: 100%;
}

/* line 56, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.in-target-rect {
  background: white;
}

/* line 61, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled .array-cell-image {
  position: absolute;
  border-color: #B3B3B3;
  border-style: solid;
  border-width: 0 2px 2px 0;
  width: 100%;
  height: 100%;
  background: #277fba;
  z-index: 1;
}

/* line 72, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled.highlight-subtract .array-cell-minus, .array-widget.tiles .array-grid-cell.filled.clickable:not(.just-added):hover .array-cell-minus {
  display: none;
}

/* line 76, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled.prepop .array-cell-image {
  background: #277fba;
}

/* line 79, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled.first-row-filled .array-cell-image {
  border-top-width: 2px;
  height: 100%;
  height: calc(100% + 2px);
  top: -2px;
}

/* line 85, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled.first-col-filled .array-cell-image {
  border-left-width: 2px;
  width: 100%;
  width: calc(100% + 2px);
  left: -2px;
}

/* line 92, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.filled.clickable:hover .array-cell-image.tile-draggable {
  background: #58b0e0;
  box-shadow: #277fba 0px 0px 15px 0px inset;
}

/* line 98, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.grid-on .array-cell-dot {
  display: block;
  background: none;
  border-color: #8c8c8c;
  border-style: solid;
  border-width: 0 2px 2px 0;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 0;
}

/* line 111, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.grid-on:first-child .array-cell-dot {
  border-left-width: 2px;
}

/* line 115, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.grid-on:first-child:not(.filled) .array-cell-dot {
  left: -2px;
  width: 100%;
  width: calc(100% + 2px);
}

/* line 126, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-widget.tiles .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  background: none;
  opacity: 1;
  border: 3px dashed #B3B3B3;
  width: 100%;
  width: calc(100% + 2px);
  height: 100%;
  height: calc(100% + 2px);
  top: -2px;
  left: -2px;
}

/* line 138, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell.highlight-add:not(.filled):first-child .array-cell-image, .array-widget.tiles .array-grid-cell.clickable:not(.filled):hover:first-child .array-cell-image {
  width: 100%;
  left: 0;
}

/* line 146, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-cell .array-cell-plus {
  color: #B3B3B3;
  background: none;
  font-size: 24px;
  left: 0;
  width: 100%;
  top: 50%;
  margin-top: -10px;
}

/* line 161, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-row:first-child .array-grid-cell.grid-on:not(.filled) .array-cell-dot {
  border-top-width: 2px;
  top: -2px;
  height: 100%;
  height: calc(100% + 2px);
}

/* line 170, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .array-grid-row:first-child .array-grid-cell.highlight-add:not(.filled) .array-cell-image, .array-widget.tiles .array-grid-row:first-child .array-grid-cell.clickable:not(.filled):hover .array-cell-image {
  height: 100%;
  top: 0px;
}

/* line 180, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .tiles-target-rect {
  position: absolute;
}

/* line 182, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .tiles-target-rect .tiles-target-rect-top, .array-widget.tiles .tiles-target-rect .tiles-target-rect-bottom, .array-widget.tiles .tiles-target-rect .tiles-target-rect-left, .array-widget.tiles .tiles-target-rect .tiles-target-rect-right {
  position: absolute;
  background: #58595b;
}

/* line 186, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .tiles-target-rect .tiles-target-rect-top, .array-widget.tiles .tiles-target-rect .tiles-target-rect-bottom {
  height: 4px;
}

/* line 189, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .tiles-target-rect .tiles-target-rect-left, .array-widget.tiles .tiles-target-rect .tiles-target-rect-right {
  width: 4px;
}

/* line 194, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .gia-total-label {
  top: -50px;
  right: 0;
  padding: 0;
  width: auto;
  background: none;
}

/* line 200, app/assets/stylesheets/shared/widgets/tile_array.scss */
.array-widget.tiles .gia-total-label .gia-total-num {
  color: #8c8c8c;
}

/* line 208, app/assets/stylesheets/shared/widgets/tile_array.scss */
.active-task .tiles.array-widget .array-grid-cell.clickable.prepop {
  cursor: default;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/shared/widgets/touch_numpad.scss */
.touch-numpad {
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  background: #aeadb3;
  /* Old browsers */
  background: -moz-linear-gradient(top, #aeadb3 0%, #43444b 100%);
  /* FF3.6+ */
  background: -webkit-linear-gradient(top, #aeadb3 0%, #43444b 100%);
  /* Chrome10+,Safari5.1+ */
  background: -ms-linear-gradient(top, #aeadb3 0%, #43444b 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #aeadb3 0%, #43444b 100%);
  /* W3C */
  min-height: 120px;
  z-index: 50;
  border-top: 1px solid black;
}

/* line 13, app/assets/stylesheets/shared/widgets/touch_numpad.scss */
.touch-numpad .touch-numpad-button {
  -webkit-apperance: none;
  background: #fefefe;
  /* Old browsers */
  background: -moz-linear-gradient(top, #fefefe 0%, #959595 100%);
  /* FF3.6+ */
  background: -webkit-linear-gradient(top, #fefefe 0%, #959595 100%);
  /* Chrome10+,Safari5.1+ */
  background: -ms-linear-gradient(top, #fefefe 0%, #959595 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, #fefefe 0%, #959595 100%);
  /* W3C */
  font-size: 30px;
  height: 100px;
  border-radius: 30px;
  margin: 10px 5px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* line 21, app/assets/stylesheets/shared/widgets/touch_numpad.scss */
.touch-numpad .touch-numpad-button:active {
  opacity: 0.5;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/shared/widgets/video.scss */
.video-player {
  background: black;
  width: 800px;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
}

/* line 11, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .plyr .plyr__captions {
  transform: translateY(-15px);
}

/* line 14, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .plyr .plyr__captions span {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  background-color: rgba(0, 0, 0, 0.75);
  color: white;
}

/* line 30, app/assets/stylesheets/shared/widgets/video.scss */
.video-player.with-border {
  width: 802px;
}

/* line 32, app/assets/stylesheets/shared/widgets/video.scss */
.video-player.with-border .video-wrapper {
  min-height: 451px;
  border: 1px solid #b8c5cc;
  border-bottom: none;
}

/* line 39, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-wrapper {
  position: relative;
}

/* line 43, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  cursor: pointer;
  z-index: 1;
  background: #323232;
  opacity: 1;
}

/* line 53, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-circle-play, .video-player .video-buffering-icon, .video-player .long-buffer-menu {
  position: absolute;
  top: 50%;
  left: 50%;
}

/* line 59, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-circle-play {
  width: 96px;
  height: 96px;
  margin-top: -48px;
  margin-left: -48px;
  background: url("//webassets.zearn.org/assets/lessons/circle_play.png");
}

/* line 66, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-buffering-icon {
  width: 100px;
  height: 100px;
  margin-top: -50px;
  margin-left: -50px;
  background: url("//webassets.zearn.org/app_assets/video_guided_practices/buffering.gif");
  border-radius: 10px;
  z-index: 2;
  display: none;
}

/* line 77, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .long-buffer-menu {
  display: none;
  background-image: url("//webassets.zearn.org/assets/DS_Pattern.png");
  z-index: 3;
  width: 300px;
  height: 200px;
  margin-top: -100px;
  margin-left: -150px;
  text-align: center;
  padding: 10px;
  border: 10px solid #b8c5cc;
  border-radius: 5px;
}

/* line 90, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .long-buffer-menu .lower-bitrate-link {
  width: 75%;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
}

/* line 98, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls {
  background: #1cc7e6;
  height: 60px;
  padding: 0 20px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/* line 106, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button {
  width: 46px;
  height: 46px;
  border-radius: 23px;
  cursor: pointer;
  border: none;
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.25);
  background-color: white;
  color: #007b94;
  padding: 0 7px;
}

/* line 118, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button:not(.touch-enabled):hover, .video-player .video-controls .play-button:not(.touch-enabled):focus {
  background-color: #007b94;
  color: white;
}

/* line 122, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button:not(.touch-enabled):focus:not(:focus-visible):not(:hover) {
  background-color: white;
  color: #007b94;
}

/* line 126, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button:not(.touch-enabled):active {
  background-color: #005c73;
  color: white;
}

/* line 132, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button:active {
  background-color: #005c73;
  color: white;
}

/* line 137, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button .fa-play {
  display: inline-block;
  margin-left: 5px;
  font-size: 24px;
}

/* line 143, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button .fa-pause {
  display: none;
  margin-left: 1px;
  font-size: 24px;
}

/* line 150, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button.playing .fa-play {
  display: none;
}

/* line 153, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button.playing .fa-pause {
  display: inline-block;
}

/* line 156, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .play-button.playing:active {
  background-color: #005c73;
}

/* line 162, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button {
  margin: 3px;
  width: 40px;
  height: 30px;
  border-radius: 17.5px;
  box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.25);
  background-image: url("//webassets.zearn.org/app_assets/video_player/video_player_sprites.svg");
  background-repeat: no-repeat;
  background-color: white;
  background-size: 700%;
  background-position: -25px -8px;
}

/* line 174, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button .cc-button-on {
  display: none;
  position: relative;
  transform: rotate(223deg);
  right: 9px;
  top: 9px;
  width: 35px;
  height: 35px;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/video_player/video_player_sprites.svg");
  background-repeat: no-repeat;
  background-size: 700%;
}

/* line 189, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button.caption-on .cc-button-on {
  display: inline-block;
  background-position: -189px -11px;
}

/* line 196, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button:not(.touch-enabled):hover, .video-player .video-controls .cc-button:not(.touch-enabled):focus {
  background-color: #007b94;
  background-position: -90px -8px;
  cursor: pointer;
}

/* line 201, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button.caption-on:not(.touch-enabled):hover .cc-button-on, .video-player .video-controls .cc-button.caption-on:not(.touch-enabled):focus .cc-button-on {
  background-position: -161px -11px;
}

/* line 205, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button:not(.touch-enabled):hover:active, .video-player .video-controls .cc-button:not(.touch-enabled):focus:active {
  background-color: #005c73;
}

/* line 207, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button:not(.touch-enabled):hover:active .cc-button-on, .video-player .video-controls .cc-button:not(.touch-enabled):focus:active .cc-button-on {
  background-position: -132px -11px;
}

/* line 214, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button.touch-enabled:active {
  background-color: #005c73;
  background-position: -90px -8px;
}

/* line 218, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls .cc-button.touch-enabled.caption-on:active .cc-button-on {
  background-position: -132px -11px;
}

/* line 225, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #progress-area {
  width: 559px;
  display: inline-block;
  vertical-align: middle;
  position: relative;
}

/* line 232, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #time-label, .video-player .video-controls #end-label {
  display: inline-block;
  vertical-align: middle;
  color: #303b40;
  font-size: 15px;
  min-width: 32px;
  text-align: center;
  font-weight: bold;
}

/* line 242, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #time-label {
  margin-left: 8px;
}

/* line 246, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #end-label {
  margin-right: 8px;
  visibility: hidden;
}

/* line 251, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #progress-bar {
  width: 559px;
  height: 34px;
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: white;
  background: linear-gradient(to bottom, white 0%, #e4e4e4 100%);
}

/* line 261, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #progress-bar-shadow {
  position: absolute;
  border-radius: 18px;
  width: 100%;
  height: 100%;
  box-shadow: inset 0px 0px 3px 0px rgba(0, 0, 0, 0.5);
}

/* line 269, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #progress-loaded {
  background-color: #e4e4e4;
  height: 100%;
  width: 0px;
}

/* line 275, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-controls #current-progress {
  height: 100%;
  width: 0px;
  background-color: #005c73;
}

/* line 282, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker {
  position: absolute;
  top: 0;
  width: 2px;
  height: 100%;
  background: #303b40;
}

/* line 289, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker .video-stoppage-marker-circle-container {
  position: absolute;
  width: 18px;
  height: 18px;
  left: -8px;
  top: 9px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 300, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker .video-stoppage-marker-circle {
  width: 18px;
  height: 18px;
  border-radius: 15px;
  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.5);
  overflow: hidden;
  border: 1px solid #303b40;
}

/* line 308, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker .video-stoppage-marker-circle .video-stoppage-marker-circle-top, .video-player .video-stoppage-marker .video-stoppage-marker-circle .video-stoppage-marker-circle-bottom {
  background: white;
  width: 100%;
  height: 50%;
}

@-webkit-keyframes circlePulse {
  0%, 100% {
    border-width: 1px;
  }
  50% {
    border-width: 3px;
  }
}

@-moz-keyframes circlePulse {
  0%, 100% {
    border-width: 1px;
  }
  50% {
    border-width: 3px;
  }
}

@-o-keyframes circlePulse {
  0%, 100% {
    border-width: 1px;
  }
  50% {
    border-width: 3px;
  }
}

@keyframes circlePulse {
  0%, 100% {
    border-width: 1px;
  }
  50% {
    border-width: 3px;
  }
}

/* line 324, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker.pulse .video-stoppage-marker-circle-container {
  width: 21px;
  height: 21px;
  left: -10px;
  top: 7px;
}

/* line 330, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker.pulse .video-stoppage-marker-circle {
  box-sizing: content-box;
  width: 15px;
  height: 15px;
  -webkit-animation: circlePulse 800ms;
  -moz-animation: circlePulse 800ms;
  -ms-animation: circlePulse 800ms;
  -o-animation: circlePulse 800ms;
  animation: circlePulse 800ms;
}

/* line 338, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker.started .video-stoppage-marker-circle-bottom, .video-player .video-stoppage-marker.completed .video-stoppage-marker-circle-top {
  background: #1cc7e6;
}

/* line 343, app/assets/stylesheets/shared/widgets/video.scss */
.video-player .video-stoppage-marker.completed:hover .video-stoppage-marker-circle-bottom, .video-player .video-stoppage-marker.completed:hover .video-stoppage-marker-circle-top {
  background: #ccffff;
}

/* line 349, app/assets/stylesheets/shared/widgets/video.scss */
.video-player:not(.simple) .video-controls #progress-bar {
  cursor: pointer;
}

/* line 355, app/assets/stylesheets/shared/widgets/video.scss */
.qtip.tooltip {
  background: white;
  background: linear-gradient(to bottom, white 0%, #e4e4e4 100%);
  border-radius: 6px;
  color: #303b40;
  font-size: 12px;
  line-height: 10px;
  min-width: 10px;
  border-color: #e4e4e4;
  box-shadow: 0px 1px 1px 2px rgba(0, 0, 0, 0.25);
  font-weight: bold;
}

/* line 367, app/assets/stylesheets/shared/widgets/video.scss */
.qtip.tooltip .qtip-content {
  text-align: center;
  padding: 2px 5px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 10, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.fix-safari-ios-inputs-html {
  margin: 0;
  overflow: hidden;
  height: 100%;
}

/* line 15, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.fix-safari-ios-inputs-body {
  margin: 0;
  overflow-x: auto;
  overflow-y: scroll;
  height: 100%;
  -webkit-overflow-scrolling: touch;
}

/* line 24, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.feed #footer {
  margin-bottom: 70px;
}

/* line 29, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: fixed;
  width: 1024px;
  height: 60px;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  bottom: 0px;
  border-top: 1px solid #e4e4e4;
  background: white;
  text-align: center;
  z-index: 20;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  white-space: nowrap;
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
}

/* line 46, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad:not(.pinned-to-tg) {
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5), 0px -4px 12px #cccccc;
}

/* line 49, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad.extended:not(.pinned-to-tg) {
  height: 244px;
}

/* line 54, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad.pinned-to-tg {
  position: absolute;
  bottom: -60px;
  top: auto !important;
}

/* line 60, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad.with-fading {
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 63, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad.with-fading.fade-out {
  opacity: 0;
  pointer-events: none;
}

/* line 71, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad.extended {
  z-index: 100;
}

/* line 76, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-controls-left {
  width: 30px;
  margin-left: 20px;
  margin-right: auto;
}

/* line 82, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-input-keys {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 770px;
}

/* line 88, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-controls-right {
  width: 150px;
  margin-left: auto;
  margin-right: 20px;
}

/* line 95, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 45px;
  margin: 0px 5px;
  font-size: 24px;
  font-weight: 600;
  border-width: 1px;
  border-style: solid;
}

/* line 105, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice:not(.inactive) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  cursor: pointer;
}

/* line 110, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice.hidden {
  display: none;
}

/* line 115, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice:not(.zearn-keypad-enter):not(.zearn-keypad-back) {
  width: 45px;
  color: #007b94;
  border-color: #0097b6;
  border-radius: 100%;
  background-color: white;
}

/* line 122, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice:not(.zearn-keypad-enter):not(.zearn-keypad-back):hover:not(.inactive):not(.touch), .zearn-keypad .zearn-keypad-choice.pressed.touch:not(.zearn-keypad-enter):not(.zearn-keypad-back) {
  background-color: #e9fbff;
}

/* line 126, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice.inactive:not(.zearn-keypad-enter):not(.zearn-keypad-back) {
  color: #cccccc;
  border-color: #cccccc;
}

/* line 134, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice.zearn-keypad-undo .zearn-keypad-undo-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -14px -91px;
  width: 21px;
  height: 14px;
}

/* line 140, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-choice.zearn-keypad-undo.inactive .zearn-keypad-undo-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -55px -91px;
}

/* line 147, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter {
  max-width: 136px;
  min-width: 136px;
  color: white;
  background-color: #007b94;
  border-radius: 25px;
  padding: 0 20px;
  border: 1px;
  letter-spacing: 0.5px;
}

/* line 158, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter:hover:not(.inactive):not(.touch), .zearn-keypad .zearn-keypad-enter.pressed.touch {
  border-color: #005c73;
  background-color: #005c73;
}

/* line 163, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter.inactive {
  border-color: #cccccc;
  background-color: #cccccc;
}

/* line 168, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter.with-right-arrow .zearn-keypad-enter-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -53px -15px;
}

/* line 172, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter.with-down-arrow .zearn-keypad-enter-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -91px -15px;
}

/* line 176, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter .zearn-keypad-enter-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -15px -15px;
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-left: 13px;
}

/* line 184, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-enter .zearn-keypad-enter-text {
  display: inline-block;
}

/* line 190, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-back {
  border-color: transparent;
}

/* line 193, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-back .zearn-keypad-back-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -15px -53px;
  width: 18px;
  height: 18px;
}

/* line 200, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-back:hover:not(.inactive):not(.touch) .zearn-keypad-back-icon, .zearn-keypad .zearn-keypad-back.pressed.touch .zearn-keypad-back-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -53px -53px;
}

/* line 205, app/assets/stylesheets/shared/widgets/zearn_keypad.scss */
.zearn-keypad .zearn-keypad-back.inactive .zearn-keypad-back-icon {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -91px -53px;
}
/* apply a natural box layout model to all elements */
/* line 4, app/assets/stylesheets/custom.scss */
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

/* line 6, app/assets/stylesheets/custom.scss */
.tooltip {
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

/* line 11, app/assets/stylesheets/custom.scss */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* line 17, app/assets/stylesheets/custom.scss */
input[type=number] {
  -moz-appearance: textfield;
}

/* line 21, app/assets/stylesheets/custom.scss */
input {
  padding: 0px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 26, app/assets/stylesheets/custom.scss */
input[type="checkbox"] {
  cursor: pointer;
}

/* line 31, app/assets/stylesheets/custom.scss */
input.placeholder {
  color: #aaa;
}

/* line 40, app/assets/stylesheets/custom.scss */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* line 45, app/assets/stylesheets/custom.scss */
body {
  margin: 0px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* line 50, app/assets/stylesheets/custom.scss */
body.g6plus {
  font-family: "Source Sans Pro", Verdana, Geneva, sans-serif;
}

/* line 53, app/assets/stylesheets/custom.scss */
body.g6plus input {
  font-family: "Source Sans Pro", Verdana, Geneva, sans-serif;
}

/* line 58, app/assets/stylesheets/custom.scss */
body.modal-popup-present {
  overflow: hidden;
}

/* line 63, app/assets/stylesheets/custom.scss */
a {
  cursor: pointer;
  text-decoration: none;
}

/* line 68, app/assets/stylesheets/custom.scss */
a img {
  border: 0;
}

/* line 73, app/assets/stylesheets/custom.scss */
p {
  font-size: 20px;
}

/* line 77, app/assets/stylesheets/custom.scss */
li {
  list-style-type: none;
}

/* line 82, app/assets/stylesheets/custom.scss */
.main-content {
  margin: 10px;
  margin-bottom: 0px;
  position: relative;
}

/* line 89, app/assets/stylesheets/custom.scss */
.stack > *:not(.active) {
  display: none;
}

/* line 96, app/assets/stylesheets/custom.scss */
.ie8 .stack.problems .tower, .ie8 .stack.problems .stage {
  display: none;
}

/* line 98, app/assets/stylesheets/custom.scss */
.ie8 .stack.problems .tower.active, .ie8 .stack.problems .stage.active {
  display: block;
}

/* line 104, app/assets/stylesheets/custom.scss */
.ie8 #learning-lab .stack .learning-lab-home, .ie8 #learning-lab .stack .lab-sections {
  display: none;
}

/* line 106, app/assets/stylesheets/custom.scss */
.ie8 #learning-lab .stack .learning-lab-home.active, .ie8 #learning-lab .stack .lab-sections.active {
  display: block;
}

/* line 115, app/assets/stylesheets/custom.scss */
.valign-outer {
  display: table;
  width: 100%;
}

/* line 119, app/assets/stylesheets/custom.scss */
.valign-middle {
  display: table-cell;
  vertical-align: middle;
}

/* line 126, app/assets/stylesheets/custom.scss */
.main-container {
  position: relative;
  background: white;
  border-radius: 10px;
  margin-top: 50px;
  -webkit-box-shadow: 0px 0px 5px 5px #b3b3b3;
  -moz-box-shadow: 0px 0px 5px 5px #b3b3b3;
  -ms-box-shadow: 0px 0px 5px 5px #b3b3b3;
  -o-box-shadow: 0px 0px 5px 5px #b3b3b3;
  box-shadow: 0px 0px 5px 5px #b3b3b3;
}

/* line 133, app/assets/stylesheets/custom.scss */
.top-right-link {
  position: absolute;
  top: 8px;
  right: 8px;
  text-decoration: underline;
}

/* line 140, app/assets/stylesheets/custom.scss */
.top-left-link {
  position: absolute;
  top: 8px;
  left: 8px;
  text-decoration: underline;
}

/* line 148, app/assets/stylesheets/custom.scss */
.header {
  background: gray;
  color: white;
  text-align: right;
  padding: 2px;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 30px;
  height: 30px;
  font-size: 20px;
  line-height: 30px;
}

/* line 159, app/assets/stylesheets/custom.scss */
.header a {
  color: lightGray;
}

/* line 164, app/assets/stylesheets/custom.scss */
.clear {
  clear: both;
}

/* line 168, app/assets/stylesheets/custom.scss */
.left {
  float: left;
}

/* line 172, app/assets/stylesheets/custom.scss */
.right {
  float: right;
}

/* line 180, app/assets/stylesheets/custom.scss */
.main-title {
  margin-bottom: 5px;
  margin-left: 5px;
  text-shadow: 1px 1px #BBB;
  font-size: 17px;
  color: #0497e7;
}

/* line 188, app/assets/stylesheets/custom.scss */
.main-right {
  position: absolute;
  right: 10px;
  color: grey;
  padding-right: 30px;
  line-height: 22px;
}

/* line 195, app/assets/stylesheets/custom.scss */
.main-left {
  position: absolute;
  left: 10px;
}

/* line 200, app/assets/stylesheets/custom.scss */
.flash-message {
  padding: 10px;
  margin: 5px;
  text-align: center;
}

/* line 206, app/assets/stylesheets/custom.scss */
#announcement {
  position: relative;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  min-width: 600px;
  max-width: 800px;
  height: 40px;
  line-height: 40px;
  border-radius: 20px;
  background-color: #b3b3b3;
}

/* line 218, app/assets/stylesheets/custom.scss */
#announcement a, #announcement a:visited {
  color: blue;
  text-decoration: underline;
  font-weight: bold;
}

/* line 223, app/assets/stylesheets/custom.scss */
#announcement .hide-announcement {
  position: absolute;
  right: 10px;
  font-size: 14px;
  color: black;
  font-weight: bold;
  text-decoration: none;
}

/* line 233, app/assets/stylesheets/custom.scss */
.caret {
  margin-top: 23px;
  margin-left: 5px;
  display: inline-block;
  vertical-align: top;
  border-top: 4px solid white;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

/* line 241, app/assets/stylesheets/custom.scss */
.caret.black {
  margin-top: 13px;
  border-top: 4px solid black;
}

/* line 247, app/assets/stylesheets/custom.scss */
.dropdown-menu {
  font-size: 15px;
  text-align: left;
  padding: 0;
  margin: 5px;
  border-top: 1px solid #c1d8ed;
  color: black;
  list-style-type: none;
  list-style: none;
  display: none;
}

/* line 257, app/assets/stylesheets/custom.scss */
.dropdown-menu a, .dropdown-menu .dropdown-item {
  display: block;
  padding: 5px;
  line-height: 20px;
  color: #333333;
  white-space: nowrap;
}

/* line 264, app/assets/stylesheets/custom.scss */
.dropdown-menu a:hover {
  background: #f0f5f7;
}

/* line 269, app/assets/stylesheets/custom.scss */
.dent-dropdown {
  display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  text-align: left;
}

/* line 273, app/assets/stylesheets/custom.scss */
.dent-dropdown .dropdown-button {
  cursor: pointer;
}
/* line 6, app/assets/stylesheets/centered_dialog.scss */
.centered-dialog {
  height: 100%;
  width: 100%;
}

/* line 10, app/assets/stylesheets/centered_dialog.scss */
.centered-dialog body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100%;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 16, app/assets/stylesheets/centered_dialog.scss */
.centered-dialog body .centering-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: auto;
  margin-bottom: auto;
  padding: 10px;
}

/* line 24, app/assets/stylesheets/centered_dialog.scss */
.centered-dialog body .centering-wrapper .dialog {
  max-width: 680px;
  width: 100%;
  min-height: 680px;
  background: #ffffff;
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  position: relative;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 35, app/assets/stylesheets/centered_dialog.scss */
.centered-dialog body .centering-wrapper .dialog header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 74px;
  background-color: #fbfbfb;
}
/* line 3, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog {
  height: 100%;
  width: 100%;
}

/* line 7, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100%;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 13, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body .centering-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: auto;
  margin-bottom: auto;
  padding: 10px;
}

/* line 21, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body .centering-wrapper .dialog {
  width: 500px;
  min-height: 500px;
  text-align: center;
  padding: 20px;
  background: #ffffff;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  -ms-border-radius: 15px;
  -o-border-radius: 15px;
  border-radius: 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 31, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body .centering-wrapper .dialog img.logo {
  margin: 0 auto 40px auto;
  height: 54px;
  width: 189px;
}

/* line 37, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body .centering-wrapper .dialog header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  height: 74px;
  background-color: #fbfbfb;
}

/* line 45, app/assets/stylesheets/compact_centered_dialog.scss */
.compact-centered-dialog body .centering-wrapper .btn.sign-out {
  display: block;
  width: 200px;
  text-align: center;
  margin: 20px auto;
}
/* line 9, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.link {
  color: #007b94;
  font-size: 18px;
  line-height: 26px;
}

/* line 13, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.link:hover {
  color: #005c73;
}

/* line 17, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.link.btn-sized-link {
  display: inline-block;
  height: 50px;
  line-height: 50px;
  padding: 0 20px;
  text-align: center;
  letter-spacing: 0.18px;
}

/* line 27, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .icon-outline-action-btn {
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  color: #007b94;
  border: 1px solid #007b94;
  padding: 1px 8px 1px 24px;
  position: relative;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  -ms-border-radius: 14px;
  -o-border-radius: 14px;
  border-radius: 14px;
}

/* line 37, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .icon-outline-action-btn i {
  display: block;
  position: absolute;
  left: -5px;
  top: -3px;
  color: white;
  background-color: #007b94;
  height: 24px;
  width: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 12px;
}

/* line 50, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .icon-outline-action-btn i.fa-times {
  font-size: 15px;
}

/* line 55, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .icon-outline-action-btn:hover {
  color: #005c73;
  border-color: #005c73;
}

/* line 58, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .icon-outline-action-btn:hover i {
  background-color: #005c73;
}

/* line 64, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn, .zearn-2015-buttons button.btn, .zearn-2015-buttons input.btn {
  transition-delay: 0s;
  transition-duration: 50ms;
  transition-property: all;
  transition-timing-function: ease;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  color: #ffffff;
  background-color: #007b94;
  cursor: pointer;
  display: inline-block;
  width: 300px;
  height: 50px;
  padding: 0 20px;
  margin: 20px 0;
  line-height: 50px;
  text-align: left;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 18px;
  letter-spacing: 0.18px;
  font-weight: 700;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  -o-border-radius: 25px;
  border-radius: 25px;
}

/* line 83, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn .loader, .zearn-2015-buttons button.btn .loader, .zearn-2015-buttons input.btn .loader {
  display: none;
}

/* line 87, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn:hover, .zearn-2015-buttons button.btn:hover, .zearn-2015-buttons input.btn:hover {
  color: #ffffff;
  background-color: #005c73;
}

/* line 92, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn[disabled], .zearn-2015-buttons a.btn[disabled]:hover, .zearn-2015-buttons a.btn.disabled, .zearn-2015-buttons a.btn.disabled:hover, .zearn-2015-buttons button.btn[disabled], .zearn-2015-buttons button.btn[disabled]:hover, .zearn-2015-buttons button.btn.disabled, .zearn-2015-buttons button.btn.disabled:hover, .zearn-2015-buttons input.btn[disabled], .zearn-2015-buttons input.btn[disabled]:hover, .zearn-2015-buttons input.btn.disabled, .zearn-2015-buttons input.btn.disabled:hover {
  cursor: default;
  color: #999999;
  background-color: #cccccc;
}

/* line 98, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn.btn-reverse-outline, .zearn-2015-buttons button.btn.btn-reverse-outline, .zearn-2015-buttons input.btn.btn-reverse-outline {
  background-color: #ffffff;
  color: #0097b6;
  border: 2px solid #0097b6;
  line-height: 44px;
}

/* line 104, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn.btn-reverse-outline:hover, .zearn-2015-buttons button.btn.btn-reverse-outline:hover, .zearn-2015-buttons input.btn.btn-reverse-outline:hover {
  color: #007b94;
  border-color: #007b94;
}

/* line 110, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn i, .zearn-2015-buttons button.btn i, .zearn-2015-buttons input.btn i {
  display: block;
  float: right;
  margin-top: 14px;
}

/* line 116, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons a.btn.btn-sm, .zearn-2015-buttons button.btn.btn-sm, .zearn-2015-buttons input.btn.btn-sm {
  width: auto;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  height: 20px;
}

@media (max-width: 767px) {
  /* line 64, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn, .zearn-2015-buttons button.btn, .zearn-2015-buttons input.btn {
    height: 44px;
    line-height: 44px;
  }
}

@media (min-width: 768px) {
  /* line 130, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn.btn-centered, .zearn-2015-buttons button.btn.btn-centered, .zearn-2015-buttons input.btn.btn-centered {
    text-align: center;
  }
  /* line 134, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn.btn-hollow-not-sm, .zearn-2015-buttons button.btn.btn-hollow-not-sm, .zearn-2015-buttons input.btn.btn-hollow-not-sm {
    background-color: transparent;
    color: #666666;
    border: 3px solid #666666;
    width: auto;
    line-height: 44px;
  }
  /* line 141, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn.btn-hollow-not-sm:hover, .zearn-2015-buttons button.btn.btn-hollow-not-sm:hover, .zearn-2015-buttons input.btn.btn-hollow-not-sm:hover {
    color: #007b94;
    border-color: #007b94;
  }
  /* line 147, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn.btn-hollow-sm, .zearn-2015-buttons button.btn.btn-hollow-sm, .zearn-2015-buttons input.btn.btn-hollow-sm {
    background-color: transparent;
    color: #0097b6;
    border: 1px solid #0097b6;
    width: auto;
    text-align: center;
    font-size: 11px;
    line-height: 20px;
    height: 22px;
  }
  /* line 157, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
  .zearn-2015-buttons a.btn.btn-hollow-sm:hover, .zearn-2015-buttons button.btn.btn-hollow-sm:hover, .zearn-2015-buttons input.btn.btn-hollow-sm:hover {
    color: #007b94;
    border-color: #007b94;
  }
}

/* line 165, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .loading .btn {
  text-align: left;
  background: #007b94;
  cursor: default;
}

/* line 170, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .loading .btn.btn-link-like {
  background: transparent;
  color: #007b94;
}

/* line 175, app/assets/stylesheets/themes/zearn-2015/buttons.scss */
.zearn-2015-buttons .loading .btn .loader {
  display: block;
  float: right;
}
/* line 27, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) {
  color: #666666;
}

/* line 30, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) label {
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 35, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .pseudo-field {
  white-space: nowrap;
  margin-top: 10px;
}

/* line 8, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .pseudo-field.has-error .errors {
  color: #ff2a00;
  font-style: italic;
  padding-left: 10px;
  white-space: normal;
  width: calc(100% - 330px);
  text-transform: capitalize;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

@media screen and (max-width: 680px) {
  /* line 8, app/assets/stylesheets/themes/zearn-2015/form.scss */
  .zearn-2015-form form:not(.plain-form) .pseudo-field.has-error .errors {
    display: block;
    width: 100%;
    padding-left: 0;
    margin-top: 10px;
  }
}

/* line 40, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .pseudo-field .pseudo-input {
  border: 1px solid transparent;
  display: inline-block;
  max-width: 320px;
  width: 100%;
  min-height: 40px;
  line-height: 40px;
  vertical-align: middle;
}

/* line 50, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .pseudo-field:first-child {
  margin-top: 0;
}

/* line 57, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field:not(.adult):not(.student) {
  margin-top: 10px;
}

/* line 58, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field:not(.adult):not(.student):not(.international):not(td) {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 8, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field.has-error .errors {
  color: #ff2a00;
  font-style: italic;
  padding-left: 10px;
  white-space: normal;
  width: calc(100% - 330px);
  text-transform: capitalize;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

@media screen and (max-width: 680px) {
  /* line 8, app/assets/stylesheets/themes/zearn-2015/form.scss */
  .zearn-2015-form form:not(.plain-form) .field.has-error .errors {
    display: block;
    width: 100%;
    padding-left: 0;
    margin-top: 10px;
  }
}

/* line 67, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field:first-child {
  margin-top: 0;
}

/* line 72, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field.optional::after {
  content: 'Optional';
  padding-left: 10px;
  font-style: italic;
  line-height: 40px;
}

/* line 81, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field.has-error .chosen-container .chosen-single, .zearn-2015-form form:not(.plain-form) .field.has-error .chosen-container .chosen-choices,
.zearn-2015-form form:not(.plain-form) .field.has-error input, .zearn-2015-form form:not(.plain-form) .field.has-error select, .zearn-2015-form form:not(.plain-form) .field.has-error input[disabled], .zearn-2015-form form:not(.plain-form) .field.has-error select[disabled] {
  border: 1px solid #ff2a00;
}

/* line 88, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .field-group {
  margin-top: 10px;
}

/* line 92, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]), .zearn-2015-form form:not(.plain-form) select, .zearn-2015-form form:not(.plain-form) textarea, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices {
  max-width: 320px;
  width: 100%;
  color: #666666;
  border: 1px solid #b3b3b3;
  border-radius: 4px;
  background-color: #ffffff;
  font-size: 18px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  line-height: 38px;
  height: 40px;
  padding: 0 10px;
  vertical-align: middle;
  -webkit-appearance: none;
}

/* line 76, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):focus::-moz-placeholder, .zearn-2015-form form:not(.plain-form) select:focus::-moz-placeholder, .zearn-2015-form form:not(.plain-form) textarea:focus::-moz-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:focus::-moz-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:focus::-moz-placeholder {
  color: transparent;
}

/* line 77, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox])::-moz-placeholder, .zearn-2015-form form:not(.plain-form) select::-moz-placeholder, .zearn-2015-form form:not(.plain-form) textarea::-moz-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single::-moz-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices::-moz-placeholder {
  color: #bcbcbc;
  opacity: 1;
}

/* line 81, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):-ms-input-placeholder, .zearn-2015-form form:not(.plain-form) select:-ms-input-placeholder, .zearn-2015-form form:not(.plain-form) textarea:-ms-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:-ms-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:-ms-input-placeholder {
  color: #bcbcbc !important;
}

/* line 82, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):focus:-ms-placeholder, .zearn-2015-form form:not(.plain-form) select:focus:-ms-placeholder, .zearn-2015-form form:not(.plain-form) textarea:focus:-ms-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:focus:-ms-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:focus:-ms-placeholder {
  color: transparent;
}

/* line 83, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox])::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) select::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) textarea::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices::-webkit-input-placeholder {
  color: #bcbcbc;
}

/* line 84, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):focus::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) select:focus::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) textarea:focus::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:focus::-webkit-input-placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:focus::-webkit-input-placeholder {
  color: transparent;
}

/* line 86, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox])::placeholder, .zearn-2015-form form:not(.plain-form) select::placeholder, .zearn-2015-form form:not(.plain-form) textarea::placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single::placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices::placeholder {
  color: #bcbcbc;
}

/* line 87, app/assets/stylesheets/themes/zearn-2015/../../shared/_deprecated_prefix_mixins.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):focus::placeholder, .zearn-2015-form form:not(.plain-form) select:focus::placeholder, .zearn-2015-form form:not(.plain-form) textarea:focus::placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:focus::placeholder, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:focus::placeholder {
  color: transparent;
}

/* line 109, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) input[disabled]:not([type=checkbox]), .zearn-2015-form form:not(.plain-form) select[disabled], .zearn-2015-form form:not(.plain-form) textarea[disabled], .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single[disabled], .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices[disabled] {
  color: #ababab;
  background: #f6f6f6 none;
  border: 1px solid #f6f6f6;
  opacity: 1;
}

/* line 116, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) input[disabled]:not([type=checkbox])::-ms-expand, .zearn-2015-form form:not(.plain-form) select[disabled]::-ms-expand, .zearn-2015-form form:not(.plain-form) textarea[disabled]::-ms-expand, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single[disabled]::-ms-expand, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices[disabled]::-ms-expand {
  color: #ababab;
}

/* line 121, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) input:not([type=checkbox]):-webkit-autofill, .zearn-2015-form form:not(.plain-form) select:-webkit-autofill, .zearn-2015-form form:not(.plain-form) textarea:-webkit-autofill, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:-webkit-autofill, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices:-webkit-autofill {
  -webkit-text-fill-color: #666666 !important;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset;
}

/* line 126, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) input[disabled]:not([type=checkbox]):-webkit-autofill, .zearn-2015-form form:not(.plain-form) select[disabled]:-webkit-autofill, .zearn-2015-form form:not(.plain-form) textarea[disabled]:-webkit-autofill, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single[disabled]:-webkit-autofill, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices[disabled]:-webkit-autofill {
  -webkit-text-fill-color: #ababab !important;
  -webkit-box-shadow: 0 0 0 1000px #f6f6f6 inset;
}

/* line 136, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container.chosen-disabled .chosen-single {
  color: gray;
  background: #f6f6f6 none;
  border: 1px solid #f6f6f6;
  opacity: 1;
}

/* line 144, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container a {
  cursor: default;
}

/* line 148, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single {
  box-shadow: none;
}

/* line 151, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single.chosen-default {
  color: #bcbcbc;
}

/* line 155, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single div b {
  background-image: none !important;
}

/* line 159, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single abbr.search-choice-close {
  top: 14px;
  right: 36px;
}

/* line 165, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices {
  padding-top: 6px;
  background-image: none;
}

/* line 169, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices li.search-field {
  height: 32px;
}

/* line 173, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices li.search-field input[type="text"] {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  position: absolute;
}

/* line 178, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices .search-choice {
  background-image: none;
}

/* line 182, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-choices a.search-choice-close {
  cursor: pointer;
}

/* line 187, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-search input[type="text"] {
  font-size: 17px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 191, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-results li {
  font-size: 17px;
}

/* line 195, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container .chosen-drop {
  border-radius: 0 0 4px 4px;
}

/* line 201, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container-active .chosen-single {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

/* line 206, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .chosen-container-active.chosen-with-drop .chosen-single {
  background: transparent url("//webassets.zearn.org/app_assets/landing_page/sign_up/select-arrow-up.svg") no-repeat right 10px center;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

/* line 214, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) textarea {
  height: auto;
}

/* line 218, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  appearance: none;
  background: transparent url("//webassets.zearn.org/app_assets/landing_page/sign_up/select-arrow.svg") no-repeat right 10px center;
  background-size: 18px 10px;
}

/* line 223, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select.placeholder-shown, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single.placeholder-shown {
  color: #bcbcbc;
}

/* line 226, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select.placeholder-shown option, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single.placeholder-shown option {
  color: #666666;
}

/* line 231, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select::-ms-expand, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single::-ms-expand {
  display: none;
}

/* line 235, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select:-moz-focusring, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}

/* line 240, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select[disabled], .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single[disabled] {
  color: #ababab;
}

/* line 244, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) select[disabled]::-ms-value, .zearn-2015-form form:not(.plain-form) .chosen-container .chosen-single[disabled]::-ms-value {
  color: #ababab;
}

/* line 249, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .divider {
  height: 1px;
  max-width: 320px;
  width: 100%;
  margin: 30px 0;
  background-color: #b8b8b8;
}

@media screen and (max-width: 680px) {
  /* line 258, app/assets/stylesheets/themes/zearn-2015/form.scss */
  .zearn-2015-form form:not(.plain-form) .field.optional::after {
    display: block;
    text-align: left;
    padding-left: 0;
    margin-top: 10px;
  }
}

/* line 266, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .role-choices {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid #b3b3b3;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  max-width: 320px;
  width: 100%;
  overflow: hidden;
}

/* line 274, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .role-choices input {
  display: none;
}

/* line 278, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .role-choices label {
  width: 33.333333%;
  float: left;
  color: #898989;
  text-align: center;
  font-size: 18px;
  line-height: 40px;
  border-left: 1px solid #b3b3b3;
}

/* line 287, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .role-choices label:first-of-type {
  border-left: none;
}

/* line 292, app/assets/stylesheets/themes/zearn-2015/form.scss */
.zearn-2015-form form:not(.plain-form) .role-choices input:checked + label {
  background-color: #667780;
  color: #ffffff;
}
/* line 5, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard {
  padding-top: 41px;
}

/* line 8, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard h1 {
  margin: 0 auto;
  font-size: 30px;
  line-height: 36px;
  font-weight: 300;
  color: #00bf90;
}

/* line 16, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard h2 {
  font-size: 22px;
  font-weight: normal;
  color: #666666;
}

/* line 22, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard h1, .zearn-2015-wizard .wizard h2, .zearn-2015-wizard .wizard p {
  text-align: center;
  max-width: 560px;
  margin-left: auto;
  margin-right: auto;
}

/* line 29, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard p {
  margin-top: 20px;
  font-size: 18px;
  color: #666666;
  max-width: 440px;
}

/* line 36, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard a:not(.btn):not(.chosen-single) {
  color: #007b94;
}

/* line 38, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard a:not(.btn):not(.chosen-single):hover {
  color: #005c73;
}

/* line 44, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step {
  display: none;
}

/* line 47, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step.active {
  display: block;
}

/* line 52, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step a.btn:not(.chosen-single) {
  color: #ffffff;
}

/* line 55, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step a.btn[disabled]:not(.chosen-single), .zearn-2015-wizard .wizard .step a.btn[disabled]:not(.chosen-single):hover, .zearn-2015-wizard .wizard .step a.btn.disabled:not(.chosen-single), .zearn-2015-wizard .wizard .step a.btn.disabled:not(.chosen-single):hover {
  cursor: default;
  color: #999;
  background-color: #ccc;
}

/* line 63, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step form {
  padding-left: calc(50% - 160px);
}

/* line 67, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step .submit {
  width: 100%;
  max-width: 320px;
  text-align: center;
}

/* line 73, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step button.btn, .zearn-2015-wizard .wizard .step a.btn {
  max-width: 220px;
  width: 100%;
  height: 42px;
  line-height: 42px;
  margin-top: 20px;
  font-size: 18px;
}

/* line 82, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step button.btn i, .zearn-2015-wizard .wizard .step a.btn i {
  margin-top: 12px;
}

/* line 85, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step button.btn i.loader, .zearn-2015-wizard .wizard .step a.btn i.loader {
  display: none;
}

/* line 92, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step.loading form a.btn, .zearn-2015-wizard .wizard .step.loading form button.btn, .zearn-2015-wizard .wizard .step.loading .btn-next, .zearn-2015-wizard .wizard .step.disabled form a.btn, .zearn-2015-wizard .wizard .step.disabled form button.btn, .zearn-2015-wizard .wizard .step.disabled .btn-next {
  background-color: #005c73;
  cursor: default;
}

/* line 96, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step.loading form a.btn[disabled], .zearn-2015-wizard .wizard .step.loading form a.btn[disabled]:hover, .zearn-2015-wizard .wizard .step.loading form button.btn[disabled], .zearn-2015-wizard .wizard .step.loading form button.btn[disabled]:hover, .zearn-2015-wizard .wizard .step.loading .btn-next[disabled], .zearn-2015-wizard .wizard .step.loading .btn-next[disabled]:hover, .zearn-2015-wizard .wizard .step.disabled form a.btn[disabled], .zearn-2015-wizard .wizard .step.disabled form a.btn[disabled]:hover, .zearn-2015-wizard .wizard .step.disabled form button.btn[disabled], .zearn-2015-wizard .wizard .step.disabled form button.btn[disabled]:hover, .zearn-2015-wizard .wizard .step.disabled .btn-next[disabled], .zearn-2015-wizard .wizard .step.disabled .btn-next[disabled]:hover {
  color: #ffffff;
}

/* line 100, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step.loading form a.btn i.arrow, .zearn-2015-wizard .wizard .step.loading form button.btn i.arrow, .zearn-2015-wizard .wizard .step.loading .btn-next i.arrow, .zearn-2015-wizard .wizard .step.disabled form a.btn i.arrow, .zearn-2015-wizard .wizard .step.disabled form button.btn i.arrow, .zearn-2015-wizard .wizard .step.disabled .btn-next i.arrow {
  display: none;
}

/* line 104, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
.zearn-2015-wizard .wizard .step.loading form a.btn i.loader, .zearn-2015-wizard .wizard .step.loading form button.btn i.loader, .zearn-2015-wizard .wizard .step.loading .btn-next i.loader, .zearn-2015-wizard .wizard .step.disabled form a.btn i.loader, .zearn-2015-wizard .wizard .step.disabled form button.btn i.loader, .zearn-2015-wizard .wizard .step.disabled .btn-next i.loader {
  display: block;
}

@media screen and (max-width: 680px) {
  /* line 5, app/assets/stylesheets/themes/zearn-2015/wizard.scss */
  .zearn-2015-wizard .wizard {
    padding-left: 10px;
    padding-right: 10px;
  }
}
/* line 9, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .international {
  display: none;
}

/* line 13, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .input-with-link-wrapper {
  display: inline-block;
  max-width: 320px;
  width: 100%;
  font-size: 0;
}

/* line 23, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .zipcode.loading .loader-wrapper .loader {
  display: block;
}

/* line 29, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .zipcode .loader-wrapper {
  position: relative;
  display: inline-block;
  width: calc(100% - 100px);
}

/* line 34, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .zipcode .loader-wrapper input {
  width: 100%;
}

/* line 38, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .zipcode .loader-wrapper .loader {
  display: none;
  position: absolute;
  top: 12px;
  right: 12px;
}

/* line 46, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .zipcode .is-international {
  width: 100px;
  white-space: normal;
  vertical-align: middle;
  display: inline-block;
}

/* line 55, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .city #city {
  width: calc(100% - 58px);
}

/* line 59, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .city .is-domestic {
  display: inline-block;
  vertical-align: middle;
  width: 58px;
  white-space: normal;
}

/* line 68, app/assets/stylesheets/wizards/school_finder.scss */
.wizard .step form .is-international label, .wizard .step form .is-domestic label {
  font-size: 15px;
  background: transparent;
  color: #007b94;
  padding-left: 5px;
  cursor: pointer;
}
/* perfect-scrollbar v0.6.10 */
.ps-container {
  -ms-touch-action: none;
  touch-action: none;
  overflow: hidden !important;
  -ms-overflow-style: none; }
  @supports (-ms-overflow-style: none) {
    .ps-container {
      overflow: auto !important; } }
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .ps-container {
      overflow: auto !important; } }
  .ps-container.ps-active-x > .ps-scrollbar-x-rail,
  .ps-container.ps-active-y > .ps-scrollbar-y-rail {
    display: block;
    background-color: transparent; }
  .ps-container.ps-in-scrolling {
    pointer-events: none; }
    .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
      background-color: #eee;
      opacity: 0.9; }
      .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
        background-color: #999; }
    .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
      background-color: #eee;
      opacity: 0.9; }
      .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
        background-color: #999; }
  .ps-container > .ps-scrollbar-x-rail {
    display: none;
    position: absolute;
    /* please don't change 'position' */
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity: 0;
    -webkit-transition: background-color .2s linear, opacity .2s linear;
    -moz-transition: background-color .2s linear, opacity .2s linear;
    -o-transition: background-color .2s linear, opacity .2s linear;
    transition: background-color .2s linear, opacity .2s linear;
    bottom: 3px;
    /* there must be 'bottom' for ps-scrollbar-x-rail */
    height: 8px; }
    .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
      position: absolute;
      /* please don't change 'position' */
      background-color: #aaa;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      -webkit-transition: background-color .2s linear;
      -moz-transition: background-color .2s linear;
      -o-transition: background-color .2s linear;
      transition: background-color .2s linear;
      bottom: 0;
      /* there must be 'bottom' for ps-scrollbar-x */
      height: 8px; }
  .ps-container > .ps-scrollbar-y-rail {
    display: none;
    position: absolute;
    /* please don't change 'position' */
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    opacity: 0;
    -webkit-transition: background-color .2s linear, opacity .2s linear;
    -moz-transition: background-color .2s linear, opacity .2s linear;
    -o-transition: background-color .2s linear, opacity .2s linear;
    transition: background-color .2s linear, opacity .2s linear;
    right: 3px;
    /* there must be 'right' for ps-scrollbar-y-rail */
    width: 8px; }
    .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
      position: absolute;
      /* please don't change 'position' */
      background-color: #aaa;
      -webkit-border-radius: 4px;
      -moz-border-radius: 4px;
      border-radius: 4px;
      -webkit-transition: background-color .2s linear;
      -moz-transition: background-color .2s linear;
      -o-transition: background-color .2s linear;
      transition: background-color .2s linear;
      right: 0;
      /* there must be 'right' for ps-scrollbar-y */
      width: 8px; }
  .ps-container:hover.ps-in-scrolling {
    pointer-events: none; }
    .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
      background-color: #eee;
      opacity: 0.9; }
      .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
        background-color: #999; }
    .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
      background-color: #eee;
      opacity: 0.9; }
      .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
        background-color: #999; }
  .ps-container:hover > .ps-scrollbar-x-rail,
  .ps-container:hover > .ps-scrollbar-y-rail {
    opacity: 0.6; }
  .ps-container:hover > .ps-scrollbar-x-rail:hover {
    background-color: #eee;
    opacity: 0.9; }
    .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
      background-color: #999; }
  .ps-container:hover > .ps-scrollbar-y-rail:hover {
    background-color: #eee;
    opacity: 0.9; }
    .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
      background-color: #999; }
/* line 6, app/assets/stylesheets/signup_infos/more_info.scss */
.devise-registrations body .step.more-info p {
  margin-bottom: 15px;
  max-width: 370px;
}

/* line 11, app/assets/stylesheets/signup_infos/more_info.scss */
.devise-registrations body .step.more-info .fields {
  margin-top: 10px;
}
/* line 3, app/assets/stylesheets/signup_infos/new.scss */
.signup-infos.new body .centering-wrapper .dialog {
  height: auto;
  min-height: 490px;
}
/* line 12, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header {
  padding: 0 10px;
}

/* line 15, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0;
  list-style: none;
  max-width: 390px;
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
}

/* line 26, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.navigation-disabled li.step {
  cursor: default;
}

/* line 31, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar li.step {
  font-size: 14px;
  font-weight: 700;
  color: #ffffff;
  background-color: #b2b2b2;
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  position: relative;
  z-index: 1;
  cursor: pointer;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  border-radius: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 46, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar li.step::after {
  position: absolute;
  z-index: -1;
  content: '';
  width: 1000px;
  height: 1px;
  background-color: #b2b2b2;
  display: block;
  left: 32px;
  top: 16px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

/* line 59, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar li.step.current-step {
  background: #008c6a;
  cursor: default;
}

/* line 64, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar li.step.unclickable {
  cursor: default;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-0 li.step-0:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-0 li.step--1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-1 li.step-0:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-1 li.step--1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-1 li.step-1:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-1 li.step-0::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step-0:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step--1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step-1:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step-0::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step-2:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-2 li.step-1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-0:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step--1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-1:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-0::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-2:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-3:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-3 li.step-2::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-0:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step--1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-1:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-0::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-2:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-1::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-3:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-2::after {
  background-color: #23c69e;
}

/* line 73, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-4:not(.current-step) {
  background: #23c69e;
}

/* line 78, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations body header.progress-header .progress-bar.reached-step-4 li.step-3::after {
  background-color: #23c69e;
}

/* line 90, app/assets/stylesheets/signup_infos/progress_bar.scss */
.devise-registrations.signup-infos body header .progress-bar {
  max-width: 200px;
}
/* line 5, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions {
  text-align: center;
  padding-bottom: 45px;
}

/* line 9, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section {
  height: 300px;
  max-width: 440px;
  width: 100%;
  margin: 15px auto 0 auto;
  padding-right: 20px;
  text-align: left;
  position: relative;
}

/* line 18, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section h3 {
  display: none;
}

/* line 22, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section p {
  text-align: left;
}

/* line 25, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section p:first-of-type {
  margin-top: 0;
}

/* line 29, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section p:last-of-type {
  margin-bottom: 0;
}

/* line 35, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section > .ps-scrollbar-y-rail {
  display: block;
  opacity: 0.6;
}

/* line 40, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .legal-section:not(.read) {
  box-shadow: inset 0 -15px 15px -10px grey;
}

/* line 44, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions .errors {
  padding-top: 10px;
  font-style: italic;
  color: #ff2a00;
}

/* line 50, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions form {
  text-align: left;
}

/* line 53, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions form .agreement-read {
  display: none;
}

/* line 57, app/assets/stylesheets/signup_infos/terms_and_conditions.scss */
.wizard .step.terms-and-conditions form .accept {
  margin-top: 40px;
}
/* line 4, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .centering-wrapper .dialog {
  width: 500px;
  min-height: 430px;
}

/* line 11, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step h1, .existing-accounts body .wizard .step h2 {
  margin: 0 auto 10px auto;
}

/* line 15, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step h1 {
  color: #7029a5;
  font-size: 32px;
  font-weight: lighter;
}

/* line 21, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step h2 {
  color: #808080;
  font-weight: bold;
}

/* line 26, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step a:not(.chosen-single):hover {
  color: #007b94;
}

/* line 31, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-0 .brain, .existing-accounts body .wizard .step.step-2 .brain {
  width: 150px;
  height: 150px;
  background: url("//webassets.zearn.org/app_assets/roadblocks/smiling_brain.svg") no-repeat center;
  margin: 40px auto;
}

/* line 38, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-0 form, .existing-accounts body .wizard .step.step-2 form {
  padding-left: 0;
  margin-top: 20px;
}

/* line 42, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-0 form .buttons, .existing-accounts body .wizard .step.step-2 form .buttons {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin: 0 auto;
}

/* line 48, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-0 form .buttons .btn, .existing-accounts body .wizard .step.step-2 form .buttons .btn {
  text-align: center;
  margin: 0 10px;
  width: 100px;
}

/* line 58, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area {
  margin-top: 20px;
}

/* line 62, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area form {
  padding-left: 0;
}

/* line 66, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area .credentials {
  width: 250px;
  margin: inherit auto;
}

/* line 70, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area .credentials .errors {
  padding-left: 0;
  text-align: center;
  color: initial;
  font-style: normal;
  text-transform: none;
  display: block;
  width: 100%;
}

/* line 84, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area .buttons {
  width: 250px;
  margin: 20px auto;
}

/* line 88, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area .buttons .btn, .existing-accounts body .wizard .step.step-1 .sign-in-area .buttons a.btn-sized-link {
  max-width: 250px;
  width: 250px;
}

/* line 93, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area .buttons .btn {
  margin-top: 0;
}

/* line 98, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .wizard .step.step-1 .sign-in-area hr {
  width: 350px;
  margin: 0 auto;
  border: none;
  border-top: 1px solid #b8c5cc;
}

/* line 109, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .buttons-3p {
  margin: 0;
}

/* line 112, app/assets/stylesheets/existing_accounts/existing_accounts.scss */
.existing-accounts body .buttons-3p hr, .existing-accounts body .buttons-3p .login-3p {
  margin-bottom: 20px;
}
/* line 3, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy {
  height: 100%;
}

/* line 6, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body {
  height: 100%;
}

/* line 8, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body a {
  font-weight: bold;
  color: #007b94;
}

/* line 11, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body a:hover {
  color: #005c73;
}

/* line 16, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .fa.fa-question-circle {
  color: #0097b6;
  font-size: 20px;
}

/* line 20, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .fa.fa-question-circle:hover {
  color: #007b94;
}

/* line 27, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog .back-area, .devise-authy body.verify-authy .sign-in-box .back-area {
  text-align: center;
  margin-top: 30px;
}

/* line 33, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body a.start-over-link {
  text-transform: uppercase;
}

/* line 36, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body a.start-over-link .fa-arrow-left {
  padding-right: 8px;
  font-size: 18px;
}

/* line 42, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .instruction {
  font-weight: bold;
}

/* line 46, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .explanation {
  color: #999999;
}

/* line 50, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .authy-form {
  margin: 0 auto;
}

/* line 53, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .authy-form .btn {
  width: 200px;
  font-size: 16px;
  height: 40px;
  padding: 0;
  line-height: 30px;
  text-align: center;
}

/* line 63, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .error-message {
  color: #ec2127;
  font-size: 13px;
  font-style: italic;
  margin-bottom: 13px;
  margin-left: 4px;
  margin-top: 4px;
  text-align: left;
}

/* line 73, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body p.authy-attribution {
  font-size: 12px;
}

/* line 76, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body p.authy-attribution img {
  height: 20px;
  vertical-align: middle;
  position: relative;
  top: -1px;
  left: 2px;
}

/* line 84, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .authy-attribution {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  max-width: none;
}

/* line 93, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog {
  min-height: 550px;
  position: relative;
}

/* line 97, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog h1 {
  color: #7029a5;
}

/* line 101, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog h1 .fa .fa-question-circle, .devise-authy body .centering-wrapper .dialog h1 .fa .fa-info-circle {
  position: relative;
  top: -2px;
}

/* line 108, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog .authy-form {
  width: 280px;
}

/* line 110, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog .authy-form .btn {
  margin: 0;
}

/* line 115, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy body .centering-wrapper .dialog .explanation {
  font-size: 12px;
}

/* line 124, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.enable-authy .centering-wrapper .dialog .authy-form, .devise-authy.enable-authy .centering-wrapper .dialog .explanation, .devise-authy.enable-authy .centering-wrapper .dialog .button-wrapper {
  margin-top: 30px;
}

/* line 128, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.enable-authy .centering-wrapper .dialog .intl-tel-input.allow-dropdown input {
  padding: 0 52px;
}

/* line 132, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.enable-authy .centering-wrapper .dialog .intl-tel-input .country-list .divider {
  margin: 0 0 5px 0;
  background: none;
  max-width: none;
}

/* line 141, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* line 147, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .sign-in-wrapper {
  margin: 0;
}

/* line 150, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .sign-in-wrapper .sign-in-box {
  top: -40px;
}

/* line 155, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .instruction {
  color: #808080;
  font-size: 18px;
  margin-top: 36px;
}

/* line 161, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .explanation {
  font-size: 14px;
}

/* line 165, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .remember-device {
  margin-top: 20px;
}

/* line 169, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy button.btn {
  margin: 0;
}

/* line 173, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .error-message {
  margin-left: 25px;
  height: 16px;
}

/* line 178, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy hr {
  position: absolute;
  bottom: 80px;
  width: 350px;
}

/* line 183, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy .verify-authy .authy-attribution {
  margin: 0;
  bottom: 40px;
}

/* line 191, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.verify-authy-installation a.start-over-link {
  position: absolute;
  top: 16px;
  left: 16px;
  font-size: 12px;
}

/* line 197, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.verify-authy-installation a.start-over-link .fa-arrow-left {
  padding-right: 4px;
  font-size: 14px;
}

/* line 205, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.authy-confirmation .centering-wrapper .dialog img {
  margin: 16px 0;
}

/* line 208, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.authy-confirmation .centering-wrapper .dialog .explanation {
  font-size: 14px;
  line-height: 22px;
}

/* line 213, app/assets/stylesheets/landing_page/devise_authy.scss */
.devise-authy.authy-confirmation .centering-wrapper .dialog .btn {
  text-align: center;
  width: 200px;
  height: 50px;
  line-height: 50px;
  margin-top: 40px;
}

@media (max-width: 767px) {
  /* line 223, app/assets/stylesheets/landing_page/devise_authy.scss */
  .devise-authy .verify-authy .sign-in-wrapper .sign-in-box {
    top: -30px;
  }
}
/* line 3, app/assets/stylesheets/landing_page/index.scss */
html.landing-page {
  height: 100%;
}

/* line 6, app/assets/stylesheets/landing_page/index.scss */
html.landing-page body {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  height: 100%;
}

@media (max-width: 767px) {
  /* line 14, app/assets/stylesheets/landing_page/index.scss */
  html.landing-page body .inner {
    margin: auto;
  }
  /* line 17, app/assets/stylesheets/landing_page/index.scss */
  html.landing-page body .inner .content {
    width: 100%;
  }
}
/* line 3, app/assets/stylesheets/shared/general/button-base.scss */
.zearn-back-button, .blue-button {
  border: none;
  padding: 6px 30px;
  border-radius: 50px;
  cursor: pointer;
  text-align: center;
  font-size: 15px;
  width: auto;
  display: inline-block;
  font-weight: normal;
}

/* line 14, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button {
  color: white;
  background-color: #007b94;
}

/* line 18, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button:hover {
  background-color: #005c73;
}

/* line 21, app/assets/stylesheets/shared/general/button-base.scss */
.blue-button a {
  color: white;
}

/* line 25, app/assets/stylesheets/shared/general/button-base.scss */
.zearn-back-button {
  background: white;
  color: #007b94;
  border: 1px solid #007b94;
  font-size: 10px;
  margin-right: 10px;
}

/* line 5, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page {
  background-color: #ebebeb;
}

/* line 9, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 0px;
  color: #444;
  /*start jobs styles */
  /*end jobs styles */
}

/* line 15, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .inner {
  width: 90%;
  margin: auto;
}

/* line 22, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .content {
  max-width: 960px;
  margin: 0 auto;
  padding-top: 40px;
  background-color: white;
  border-radius: 4px;
  -webkit-box-shadow: 1px 1px 3px 0 rgba(128, 128, 128, 0.5);
  -moz-box-shadow: 1px 1px 3px 0 rgba(128, 128, 128, 0.5);
  -ms-box-shadow: 1px 1px 3px 0 rgba(128, 128, 128, 0.5);
  -o-box-shadow: 1px 1px 3px 0 rgba(128, 128, 128, 0.5);
  box-shadow: 1px 1px 3px 0 rgba(128, 128, 128, 0.5);
}

/* line 31, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page #yellow-box {
  margin-top: 30px;
  padding: 50px 70px;
  width: 100%;
  background-color: #fad232;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (max-width: 767px) {
  /* line 31, app/assets/stylesheets/landing_page/landing_page.scss */
  body.landing_page:not(.vue) .jobs-page #yellow-box {
    padding: 20px;
  }
}

/* line 46, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page #brainy {
  width: 150px;
  height: 145px;
  background-image: url("//webassets.zearn.org/app_assets/general/characters/Brain.png");
  background-repeat: no-repeat;
  background-size: contain;
}

/* line 54, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page h1 {
  font-size: 30px;
  font-weight: 300;
  line-height: 34px;
  text-align: center;
  color: #303b40;
  margin-top: 45px;
  margin-bottom: 25px;
}

/* line 64, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .box-title {
  font-size: 20px;
  font-weight: 300;
  line-height: 28px;
  color: #303b40;
  text-align: center;
  max-width: 100%;
  margin-top: 0px;
  margin-bottom: 0px;
}

/* line 75, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .title {
  text-align: center;
  font-size: 36px;
  font-weight: 300;
  color: #303b40;
  margin: 0 auto;
}

/* line 83, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page h2 {
  font-size: 16px;
  color: #303b40;
  margin: 40px 0 0 60px;
}

@media only screen and (max-width: 767px) {
  /* line 83, app/assets/stylesheets/landing_page/landing_page.scss */
  body.landing_page:not(.vue) .jobs-page h2 {
    text-align: center;
    margin-left: 0;
  }
}

/* line 94, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page #textcontainer {
  padding: 35px 50px 45px 60px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

@media only screen and (max-width: 767px) {
  /* line 94, app/assets/stylesheets/landing_page/landing_page.scss */
  body.landing_page:not(.vue) .jobs-page #textcontainer {
    padding: 20px;
  }
}

/* line 104, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page #roles {
  width: 250px;
  margin-right: 60px;
  margin-bottom: 30px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 112, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page #descriptions {
  min-width: 400px;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -webkit-flex-shrink: 1;
  flex-shrink: 1;
  -webkit-flex-basis: 300px;
  flex-basis: 300px;
}

@media only screen and (max-width: 767px) {
  /* line 112, app/assets/stylesheets/landing_page/landing_page.scss */
  body.landing_page:not(.vue) .jobs-page #descriptions {
    min-width: 100%;
  }
}

/* line 123, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-title {
  cursor: pointer;
  font-weight: normal;
  font-size: 18px;
  color: #303b40;
  margin: 7px 0;
}

/* line 130, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-title.selected {
  font-size: 18px;
  color: #007b94;
  font-weight: 700;
}

/* line 135, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-title.selected:hover {
  color: #007b94;
}

/* line 140, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-title:hover {
  color: #005c73;
}

/* line 145, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-text {
  display: none;
}

/* line 148, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .job-text.showing {
  display: block;
}

/* line 153, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .text {
  margin-top: 0px;
  margin-bottom: 20px;
  font-size: 16px;
  color: #303b40;
  font-weight: 300;
  line-height: 24px;
}

/* line 162, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .inline-text {
  font-size: 16px;
  color: #303b40;
  font-weight: 300;
  line-height: 24px;
}

/* line 169, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page ul {
  margin-top: 5px;
  margin-bottom: 20px;
}

/* line 174, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page ol {
  margin-top: 5px;
  margin-bottom: 0px;
}

/* line 179, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page li {
  margin-top: 5px;
  color: #303b40;
  font-size: 16px;
  font-weight: 300;
  line-height: 24px;
  list-style-type: circle;
}

/* line 187, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page p span, body.landing_page:not(.vue) .jobs-page li span {
  font-weight: 700;
}

/* line 191, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page h3 {
  line-height: 24px;
  font-size: 16px;
  color: #303b40;
  margin-top: 0px;
  margin-bottom: 5px;
}

/* line 199, app/assets/stylesheets/landing_page/landing_page.scss */
body.landing_page:not(.vue) .jobs-page .text-header {
  color: #303b40;
  font-size: 20px;
  margin-top: 6px;
  margin-bottom: 20px;
  display: inline-block;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/guided_practices/guided_practices.scss */
body.video_guided_practices, body.pd_video_sessions {
  background-color: #ebebeb;
}

/* line 6, app/assets/stylesheets/guided_practices/guided_practices.scss */
body.video_guided_practices #footer, body.pd_video_sessions #footer {
  background: none;
}

/* line 11, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice {
  width: 1024px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  position: relative;
}

/* line 18, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-header {
  margin-left: 60px;
}

/* line 24, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint {
  display: none;
  position: absolute;
  top: 700px;
  z-index: 2;
  transition: all 500ms;
}

/* line 29, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint .checkpoint-time {
  position: absolute;
  top: 10px;
  right: 140px;
  font-size: 12px;
  z-index: 4;
}

/* line 36, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint .tasks-page {
  -webkit-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -moz-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -ms-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -o-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
}

/* line 39, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint .task-group {
  padding-bottom: 50px;
}

/* line 44, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint.raise {
  transform: translate(0px, -700px);
}

/* line 50, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint.raise.reset {
  position: relative;
  z-index: auto;
  top: 0;
  transition: none;
  transform: none;
}

/* line 59, app/assets/stylesheets/guided_practices/guided_practices.scss */
#guided-practice #guided-practice-checkpoint.lower {
  transform: translate(0px, 700px);
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/towers/tower.scss */
.tower-sprite, .tower #tower-bottom, .tower .tower-cell, .tower #lockup {
  background-image: url("//webassets.zearn.org/app_assets/towers/tower_sprites4.png");
  background-repeat: no-repeat;
}

/* line 15, app/assets/stylesheets/towers/tower.scss */
body.towers .main-content {
  margin: 0px auto;
  width: 100%;
  min-width: 1024px;
}

/* line 21, app/assets/stylesheets/towers/tower.scss */
body.towers.tower-page {
  background-color: #ebebeb;
}

/* line 27, app/assets/stylesheets/towers/tower.scss */
body.tower-page .stage, body.tower-page .final-screen {
  margin: 0px;
}

/* line 34, app/assets/stylesheets/towers/tower.scss */
body.tower-page .task-group {
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  min-height: 420px;
  padding-bottom: 60px;
}

/* line 40, app/assets/stylesheets/towers/tower.scss */
body.tower-page .zearn-keypad.pinned-to-tg {
  bottom: 0px;
}

/* line 46, app/assets/stylesheets/towers/tower.scss */
body.towers.old-tower {
  background-image: url("//webassets.zearn.org/assets/DS_Pattern.png");
}

/* line 50, app/assets/stylesheets/towers/tower.scss */
body.towers #footer {
  min-height: initial;
  background: transparent;
}

/* line 57, app/assets/stylesheets/towers/tower.scss */
body.towers .flag-pole {
  background-image: url("//webassets.zearn.org/app_assets/general/flags/flagpole.png");
  background-size: 14px;
  height: 87px;
  width: 14px;
}

/* line 66, app/assets/stylesheets/towers/tower.scss */
.tower .white-bar {
  position: absolute;
  z-index: 1;
  top: 0px;
  height: 150px;
  width: 100%;
  min-width: 960px;
  opacity: .7;
  filter: alpha(opacity=70);
  background: white;
}

/* line 78, app/assets/stylesheets/towers/tower.scss */
.tower #lockup {
  z-index: 2;
  position: absolute;
  left: 50%;
  margin-left: -83px;
  top: 32px;
  width: 166px;
  height: 73px;
  background-position: 0px -651px;
}

/* line 90, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area {
  position: relative;
  margin: 0px auto 60px auto;
  left: 22px;
  background-image: url("//webassets.zearn.org/app_assets/towers/tower_bg_sprites.png");
  background-repeat: no-repeat;
  width: 1022px;
  height: 625px;
}

/* line 98, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area.completed-0 {
  background-position: 0 0;
}

/* line 99, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area.completed-1 {
  background-position: 0 -625px;
}

/* line 100, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area.completed-2 {
  background-position: -1022px 0;
}

/* line 101, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area.completed-3 {
  background-position: -1022px -622px;
}

/* line 102, app/assets/stylesheets/towers/tower.scss */
.tower .tower-area.completed-4, .tower .tower-area.completed-5 {
  background-position: -1022px -1247px;
}

/* line 106, app/assets/stylesheets/towers/tower.scss */
.tower .tower-background {
  z-index: -1;
  position: absolute;
  top: -122px;
  left: -10px;
  opacity: .6;
}

/* line 114, app/assets/stylesheets/towers/tower.scss */
.tower .tower-button {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  right: 3px;
  height: 34px;
}

/* line 121, app/assets/stylesheets/towers/tower.scss */
.tower .tower-button:hover {
  height: 32px;
}

/* line 126, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower {
  position: relative;
  height: 410px;
  z-index: 1;
}

/* line 131, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 {
  top: 123px;
}

/* line 133, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .flag-right {
  position: absolute;
  top: 42px;
  left: 635px;
}

/* line 140, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-3 {
  z-index: 2;
  top: 0px;
}

/* line 143, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-3 .tower-cell {
  left: -16px;
}

/* line 146, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-3 .tower-button {
  top: 60px;
  left: 22px;
}

/* line 152, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-2 {
  z-index: 1;
  top: 160px;
}

/* line 155, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-2 .tower-cell {
  left: 38px;
}

/* line 158, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-2 .tower-button {
  top: 64px;
  left: -26px;
}

/* line 164, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-1 {
  top: 327px;
}

/* line 166, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-1 .tower-cell {
  left: -20px;
}

/* line 169, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-row.stage-1 .tower-button {
  top: 68px;
  left: 20px;
}

/* line 178, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1 {
  width: 271px;
  height: 176px;
}

/* line 181, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.not-started {
  background-position: -570px -1074px;
}

/* line 184, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.in-progress {
  background-position: -285px -1074px;
}

/* line 187, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.completed {
  background-position: 0 -1074px;
}

/* line 191, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.completed {
  background-position: 0 0;
}

/* line 194, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.in-progress {
  background-position: -271px 0;
}

/* line 197, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-1.not-started {
  background-position: -542px 0;
}

/* line 201, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-2 {
  width: 271px;
  height: 208px;
}

/* line 204, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-2.completed {
  background-position: -813px 0;
}

/* line 207, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-2.in-progress {
  background-position: -1084px 0;
}

/* line 210, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-2.locked {
  background-position: 0 -208px;
}

/* line 213, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-2.not-started {
  background-position: -271px -208px;
}

/* line 217, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-3 {
  width: 279px;
  height: 199px;
}

/* line 220, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-3.completed {
  background-position: -542px -208px;
}

/* line 223, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-3.in-progress {
  background-position: -821px -208px;
}

/* line 226, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-3.locked {
  background-position: -1100px -208px;
}

/* line 229, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-3 .tower-cell.stage-3.not-started {
  background-position: -542px -407px;
}

/* line 236, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4, .tower .whole-tower.height-1, .tower .whole-tower.height-2 {
  top: 207px;
  left: -22px;
}

/* line 241, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-4, .tower .whole-tower.height-1 .tower-row.stage-4, .tower .whole-tower.height-2 .tower-row.stage-4 {
  top: 0px;
}

/* line 243, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-4 .tower-cell, .tower .whole-tower.height-1 .tower-row.stage-4 .tower-cell, .tower .whole-tower.height-2 .tower-row.stage-4 .tower-cell {
  width: 190px;
  left: 4px;
}

/* line 249, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-3, .tower .whole-tower.height-1 .tower-row.stage-3, .tower .whole-tower.height-2 .tower-row.stage-3 {
  top: 96px;
}

/* line 251, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-3 .tower-cell, .tower .whole-tower.height-1 .tower-row.stage-3 .tower-cell, .tower .whole-tower.height-2 .tower-row.stage-3 .tower-cell {
  left: 25px;
  width: 233px;
}

/* line 255, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-3 .tower-button, .tower .whole-tower.height-1 .tower-row.stage-3 .tower-button, .tower .whole-tower.height-2 .tower-row.stage-3 .tower-button {
  right: 28px;
}

/* line 260, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-2, .tower .whole-tower.height-1 .tower-row.stage-2, .tower .whole-tower.height-2 .tower-row.stage-2 {
  top: 193px;
}

/* line 264, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-1, .tower .whole-tower.height-1 .tower-row.stage-1, .tower .whole-tower.height-2 .tower-row.stage-1 {
  height: 120px;
  top: 290px;
}

/* line 270, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-row.stage-1 .tower-cell, .tower .whole-tower.height-4 .tower-row.stage-2 .tower-cell, .tower .whole-tower.height-1 .tower-row.stage-1 .tower-cell, .tower .whole-tower.height-1 .tower-row.stage-2 .tower-cell, .tower .whole-tower.height-2 .tower-row.stage-1 .tower-cell, .tower .whole-tower.height-2 .tower-row.stage-2 .tower-cell {
  width: 284px;
}

/* line 277, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-1, .tower .whole-tower.height-1 .tower-cell.stage-1, .tower .whole-tower.height-2 .tower-cell.stage-1 {
  width: 285px;
  height: 121px;
}

/* line 280, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-1.not-started, .tower .whole-tower.height-1 .tower-cell.stage-1.not-started, .tower .whole-tower.height-2 .tower-cell.stage-1.not-started {
  background-position: -570px -1074px;
}

/* line 283, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-1.in-progress, .tower .whole-tower.height-1 .tower-cell.stage-1.in-progress, .tower .whole-tower.height-2 .tower-cell.stage-1.in-progress {
  background-position: -285px -1074px;
}

/* line 286, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-1.completed, .tower .whole-tower.height-1 .tower-cell.stage-1.completed, .tower .whole-tower.height-2 .tower-cell.stage-1.completed {
  background-position: 0 -1074px;
}

/* line 290, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-2, .tower .whole-tower.height-1 .tower-cell.stage-2, .tower .whole-tower.height-2 .tower-cell.stage-2 {
  width: 285px;
  height: 131px;
}

/* line 293, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-2.locked, .tower .whole-tower.height-1 .tower-cell.stage-2.locked, .tower .whole-tower.height-2 .tower-cell.stage-2.locked {
  background-position: -285px -1205px;
}

/* line 296, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-2.not-started, .tower .whole-tower.height-1 .tower-cell.stage-2.not-started, .tower .whole-tower.height-2 .tower-cell.stage-2.not-started {
  background-position: -570px -1205px;
}

/* line 299, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-2.in-progress, .tower .whole-tower.height-1 .tower-cell.stage-2.in-progress, .tower .whole-tower.height-2 .tower-cell.stage-2.in-progress {
  background-position: 0 -1205px;
}

/* line 302, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-2.completed, .tower .whole-tower.height-1 .tower-cell.stage-2.completed, .tower .whole-tower.height-2 .tower-cell.stage-2.completed {
  background-position: -855px -1074px;
}

/* line 306, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-3, .tower .whole-tower.height-1 .tower-cell.stage-3, .tower .whole-tower.height-2 .tower-cell.stage-3 {
  width: 234px;
  height: 131px;
}

/* line 309, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-3.locked, .tower .whole-tower.height-1 .tower-cell.stage-3.locked, .tower .whole-tower.height-2 .tower-cell.stage-3.locked {
  background-position: -1089px -1205px;
}

/* line 312, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-3.not-started, .tower .whole-tower.height-1 .tower-cell.stage-3.not-started, .tower .whole-tower.height-2 .tower-cell.stage-3.not-started {
  background-position: -1355px 0px;
}

/* line 315, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-3.in-progress, .tower .whole-tower.height-1 .tower-cell.stage-3.in-progress, .tower .whole-tower.height-2 .tower-cell.stage-3.in-progress {
  background-position: -855px -1205px;
}

/* line 318, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-3.completed, .tower .whole-tower.height-1 .tower-cell.stage-3.completed, .tower .whole-tower.height-2 .tower-cell.stage-3.completed {
  background-position: -1140px -1074px;
}

/* line 322, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-4, .tower .whole-tower.height-1 .tower-cell.stage-4, .tower .whole-tower.height-2 .tower-cell.stage-4 {
  width: 191px;
  height: 130px;
}

/* line 325, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-4.completed, .tower .whole-tower.height-1 .tower-cell.stage-4.completed, .tower .whole-tower.height-2 .tower-cell.stage-4.completed {
  background-position: -1379px -131px;
}

/* line 328, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-4.in-progress, .tower .whole-tower.height-1 .tower-cell.stage-4.in-progress, .tower .whole-tower.height-2 .tower-cell.stage-4.in-progress {
  background-position: -1379px -261px;
}

/* line 331, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-4.locked, .tower .whole-tower.height-1 .tower-cell.stage-4.locked, .tower .whole-tower.height-2 .tower-cell.stage-4.locked {
  background-position: -1379px -391px;
}

/* line 334, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-4 .tower-cell.stage-4.not-started, .tower .whole-tower.height-1 .tower-cell.stage-4.not-started, .tower .whole-tower.height-2 .tower-cell.stage-4.not-started {
  background-position: -1363px -521px;
}

/* line 341, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 {
  top: 123px;
}

/* line 344, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .flag-right {
  position: absolute;
  top: 42px;
  left: 637px;
}

/* line 351, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-5 {
  z-index: 4;
  top: 0px;
}

/* line 354, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-5 .tower-cell {
  left: -14px;
}

/* line 357, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-5 .tower-button {
  top: 16px;
  left: 27px;
}

/* line 362, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-4 {
  z-index: 3;
  top: 102px;
}

/* line 365, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-4 .tower-cell {
  left: 40px;
}

/* line 368, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-4 .tower-button {
  top: 0px;
  left: -32px;
}

/* line 373, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-3 {
  z-index: 2;
  top: 188px;
}

/* line 376, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-3 .tower-cell {
  left: -18px;
}

/* line 379, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-3 .tower-button {
  top: 16px;
  left: 27px;
}

/* line 384, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-2 {
  z-index: 1;
  top: 294px;
}

/* line 387, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-2 .tower-cell {
  left: 39px;
}

/* line 390, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-2 .tower-button {
  top: 6px;
  left: -28px;
}

/* line 395, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-1 {
  top: 384px;
}

/* line 397, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-1 .tower-cell {
  left: -19px;
}

/* line 400, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-row.stage-1 .tower-button {
  top: 24px;
  left: 28px;
}

/* line 408, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-5 {
  width: 279px;
  height: 149px;
}

/* line 411, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-5.completed {
  background-position: -271px -925px;
}

/* line 414, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-5.in-progress {
  background-position: -550px -925px;
}

/* line 417, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-5.locked {
  background-position: -829px -925px;
}

/* line 420, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-5.not-started {
  background-position: -1108px -925px;
}

/* line 424, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-4 {
  width: 271px;
  height: 135px;
}

/* line 427, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-4.completed {
  background-position: -271px -790px;
}

/* line 430, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-4.in-progress {
  background-position: -542px -790px;
}

/* line 433, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-4.locked {
  background-position: -813px -790px;
}

/* line 436, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-4.not-started {
  background-position: -1084px -790px;
}

/* line 440, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-3 {
  width: 271px;
  height: 151px;
}

/* line 443, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-3.completed {
  background-position: -542px -639px;
}

/* line 446, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-3.in-progress {
  background-position: -813px -639px;
}

/* line 449, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-3.locked {
  background-position: -1084px -639px;
}

/* line 452, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-3.not-started {
  background-position: 0 -790px;
}

/* line 456, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-2 {
  width: 271px;
  height: 115px;
}

/* line 459, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-2.completed {
  background-position: -271px -524px;
}

/* line 462, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-2.in-progress {
  background-position: -821px -524px;
}

/* line 465, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-2.locked {
  background-position: -1092px -524px;
}

/* line 468, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-2.not-started {
  background-position: -271px -639px;
}

/* line 472, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-1 {
  width: 271px;
  height: 117px;
}

/* line 475, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-1.completed {
  background-position: -821px -407px;
}

/* line 478, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-1.in-progress {
  background-position: -1092px -407px;
}

/* line 481, app/assets/stylesheets/towers/tower.scss */
.tower .whole-tower.height-5 .tower-cell.stage-1.not-started {
  background-position: 0 -524px;
}

/* line 490, app/assets/stylesheets/towers/tower.scss */
.tower .tower-row {
  width: 100%;
  position: absolute;
  pointer-events: none;
}

/* line 496, app/assets/stylesheets/towers/tower.scss */
.tower .tower-cell {
  pointer-events: auto;
  margin-left: auto;
  margin-right: auto;
  cursor: pointer;
  position: relative;
  padding-top: 45px;
}

/* line 505, app/assets/stylesheets/towers/tower.scss */
.tower .tower-cell.locked, .tower .tower-cell.completed {
  cursor: default;
}

/* line 512, app/assets/stylesheets/towers/tower.scss */
.tower #tower-bottom {
  position: relative;
  top: 190px;
  right: -35px;
  width: 892px;
  height: 196px;
  background-position: -1589px 0;
}

/* line 524, app/assets/stylesheets/towers/tower.scss */
.tower-completer .loading-message {
  height: 400px;
  margin-top: 100px;
}
/* line 3, app/assets/stylesheets/dashboards/job_results.scss */
body.job_results {
  background-image: url("//webassets.zearn.org/app_assets/student_home/background-doodle-stars-f.png");
  text-align: center;
}

/* line 6, app/assets/stylesheets/dashboards/job_results.scss */
body.job_results .loading_box {
  padding: 20px;
  display: inline-block;
  background-color: white;
  border-radius: 10px;
}

/* line 13, app/assets/stylesheets/dashboards/job_results.scss */
body.job_results .logo {
  height: 100px;
}

/* line 17, app/assets/stylesheets/dashboards/job_results.scss */
body.job_results #footer {
  display: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 14, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast {
  font-family: "cubano", "Arial Black", sans-serif;
  background-color: #7642d1;
}

/* line 18, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-correct-circle {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/correct.png");
  width: 20px;
  height: 24px;
}

/* line 24, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-incorrect-circle {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/incorrect.png");
  width: 18px;
  height: 18px;
}

/* line 30, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-opening .sf-opening-background {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/introUpdate.png");
  height: 500px;
}

/* line 34, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-opening .sf-opening-background .sf-opening-logo {
  display: none;
}

/* line 38, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-opening .sf-opening-background .sf-opening-footer {
  position: absolute;
  top: 70%;
  width: 100%;
  height: 40px;
}

/* line 44, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-opening .sf-opening-background .sf-opening-footer .go-button {
  margin-top: 55px;
  border-radius: 35px;
  width: 132px;
  height: 63px;
  background-color: #ffe919;
  color: #834ae8;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 42px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

/* line 54, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-opening .sf-opening-background .sf-opening-footer .go-button:hover {
  background-color: #ffff73;
}

/* line 62, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .zearn-button, #sprint-fluencies.blast .sf-review .zearn-button {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 19px;
  font-weight: normal;
  border-radius: 20px;
  width: 160px;
  height: 41px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
  white-space: nowrap;
}

/* line 72, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header, #sprint-fluencies.blast .sf-review .sf-header {
  background-color: inherit;
}

/* line 74, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-header-logo, #sprint-fluencies.blast .sf-review .sf-header .sf-header-logo {
  top: 20px;
  left: 34px;
  width: 137px;
  height: 51px;
  background-size: 137px 51px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/logo.svg");
}

/* line 82, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-header-scores, #sprint-fluencies.blast .sf-review .sf-header .sf-header-scores {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 86, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-round, #sprint-fluencies.blast .sf-timed .sf-header .sf-bonus, #sprint-fluencies.blast .sf-review .sf-header .sf-round, #sprint-fluencies.blast .sf-review .sf-header .sf-bonus {
  position: relative;
  top: 19px;
  height: 52px;
  width: 140px;
  margin: 0px 15px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 93, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-round .sf-round-label, #sprint-fluencies.blast .sf-timed .sf-header .sf-bonus .sf-round-label, #sprint-fluencies.blast .sf-review .sf-header .sf-round .sf-round-label, #sprint-fluencies.blast .sf-review .sf-header .sf-bonus .sf-round-label {
  position: absolute;
  width: 126px;
  height: 48px;
  border-radius: 40px;
  background-color: #492985;
  color: white;
  font-size: 16px;
  padding-top: 14px;
  padding-left: 25px;
}

/* line 104, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-round .sf-score, #sprint-fluencies.blast .sf-timed .sf-header .sf-bonus .sf-score, #sprint-fluencies.blast .sf-review .sf-header .sf-round .sf-score, #sprint-fluencies.blast .sf-review .sf-header .sf-bonus .sf-score {
  position: absolute;
  top: -2px;
  left: 88px;
  width: 52px;
  height: 52px;
  border-radius: 100%;
  background-color: #7cfdff;
  -webkit-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
  -ms-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.2);
  text-align: center;
  color: #7243ca;
  font-size: 26px;
  padding-top: 9px;
}

/* line 118, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-round .sf-score.lock .sf-lock, #sprint-fluencies.blast .sf-timed .sf-header .sf-bonus .sf-score.lock .sf-lock, #sprint-fluencies.blast .sf-review .sf-header .sf-round .sf-score.lock .sf-lock, #sprint-fluencies.blast .sf-review .sf-header .sf-bonus .sf-score.lock .sf-lock {
  display: block;
}

/* line 122, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-round .sf-score .sf-lock, #sprint-fluencies.blast .sf-timed .sf-header .sf-bonus .sf-score .sf-lock, #sprint-fluencies.blast .sf-review .sf-header .sf-round .sf-score .sf-lock, #sprint-fluencies.blast .sf-review .sf-header .sf-bonus .sf-score .sf-lock {
  display: none;
  position: relative;
  top: 4px;
  left: 18px;
  width: 15px;
  height: 22px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/lock.png");
}

/* line 133, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-header .sf-review-message, #sprint-fluencies.blast .sf-review .sf-header .sf-review-message {
  position: absolute;
  top: 24px;
  left: 700px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 28px;
  font-weight: 300;
  color: white;
}

/* line 143, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems, #sprint-fluencies.blast .sf-review .sf-problems {
  margin-top: -90px;
  padding-top: 110px;
}

/* line 147, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-instructions, #sprint-fluencies.blast .sf-review .sf-problems .sf-instructions {
  text-align: center;
  margin-bottom: 16px;
  margin-top: 0px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: 300;
  color: white;
}

/* line 155, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table {
  border-collapse: separate;
  border-spacing: 0px 2px;
}

/* line 159, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table tr:not(.wider) .sf-rhs, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table tr:not(.wider) .sf-rhs {
  width: 25%;
}

/* line 163, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table .sf-row, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table .sf-row {
  background-color: #7642d1;
}

/* line 167, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table .sf-row.active-row td, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table .sf-row.active-row td {
  background-color: white;
  color: black;
}

/* line 173, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table .sf-row:not(.active-row) td, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table .sf-row:not(.active-row) td {
  background-color: #a282de;
  color: rgba(255, 255, 255, 0.5);
}

/* line 178, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table .sf-row .sf-correctness, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table .sf-row .sf-correctness {
  margin: 0px 20px 5px 10px;
}

/* line 183, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table tr td:first-child, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table tr td:first-child {
  border-top-left-radius: 40px;
  border-bottom-left-radius: 40px;
}

/* line 187, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems .sf-problems-container .sf-problems-table tr td:last-child, #sprint-fluencies.blast .sf-review .sf-problems .sf-problems-container .sf-problems-table tr td:last-child {
  border-top-right-radius: 40px;
  border-bottom-right-radius: 40px;
}

/* line 193, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-problems-container .sf-problems-table .active-row.answering td:last-child, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-problems-container .sf-problems-table .active-row.answering td:last-child {
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

/* line 197, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices {
  background-color: white;
  border-radius: 35px;
  height: 70px;
  top: 4px;
  left: -15px;
}

/* line 204, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice {
  height: 49px;
  min-width: 49px;
  line-height: 45px;
  background-color: #a184db;
  color: black;
  border-color: transparent;
}

/* line 211, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.disabled, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.disabled {
  background-color: #cccccc;
  color: #666666;
}

/* line 215, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:hover:not(.disabled), #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:hover:not(.disabled) {
  border-color: #703fcc;
}

/* line 218, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:active:not(.disabled), #sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.selected, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:active:not(.disabled), #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.selected {
  background-color: #703fcc;
  border-color: #492985;
}

/* line 224, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices {
  height: 90px;
  padding: 15px 10px;
}

/* line 227, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices .sf-mc-choice, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices .sf-mc-choice {
  height: 60px;
  min-width: 60px;
  line-height: 55px;
}

/* line 234, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image {
  transform: scaleX(-1);
  bottom: -10px;
}

/* line 238, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut {
  right: 10px;
}

/* line 241, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut ~ .sf-speech-bubble, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut ~ .sf-speech-bubble {
  left: -40px;
  top: 160px;
}

/* line 245, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut ~ .sf-speech-bubble .sf-speech-bubble-img, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.astronaut ~ .sf-speech-bubble .sf-speech-bubble-img {
  transform: scaleX(-1);
}

/* line 251, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster {
  right: 10px;
}

/* line 254, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble {
  left: -40px;
  top: 160px;
}

/* line 258, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-img, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-img {
  transform: scaleX(-1);
}

/* line 262, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-text, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-text {
  right: 10px;
}

/* line 269, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.alien ~ .sf-speech-bubble, #sprint-fluencies.blast .sf-review .sf-problems.sf-mc-problems .sf-side-image-box-right .sf-side-image.alien ~ .sf-speech-bubble {
  left: -90px;
  top: 150px;
}

/* line 281, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro {
  background: #7642d1;
}

/* line 284, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message {
  background: #7642d1;
  color: #7cfdff;
}

/* line 288, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-get, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-ready, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-num-questions, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-questions,
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-blast, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-off, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-alien, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-monster, #sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-rocket {
  font-family: "cubano", "Arial Black", sans-serif;
  position: absolute;
}

/* line 293, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-get {
  top: 65px;
  left: 307px;
  font-size: 223px;
}

/* line 298, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-ready {
  bottom: 95px;
  left: 307px;
  font-size: 119px;
}

/* line 303, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-num-questions {
  position: absolute;
  width: 100%;
  top: 85px;
  font-size: 250px;
}

/* line 309, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-num-questions.single-digit {
  top: -40px;
  font-size: 380px;
}

/* line 314, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-questions {
  position: absolute;
  width: 100%;
  bottom: 96px;
  font-size: 40px;
}

/* line 320, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-blast {
  top: 10px;
  left: 82px;
  font-size: 210px;
}

/* line 325, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-off {
  top: 150px;
  left: 82px;
  font-size: 297px;
}

/* line 330, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-alien {
  bottom: 0px;
  right: 0px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/alien.png");
  width: 224px;
  height: 288px;
}

/* line 337, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-monster {
  bottom: 0px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/monster.png");
  width: 234px;
  height: 278px;
}

/* line 343, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-rocket {
  top: 180px;
  left: 747px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/rocket.png");
  width: 219px;
  height: 274px;
}

/* line 352, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .countdown-bar .progress-bar {
  background-color: #492985;
}

/* line 355, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop {
  background-color: #7642d1;
  padding: 0px;
}

/* line 359, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-timed-times, #sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-timed-up {
  position: relative;
  font-family: "cubano", "Arial Black", sans-serif;
  font-weight: normal;
  color: #7cfdff;
}

/* line 365, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-timed-times {
  font-size: 194px;
}

/* line 368, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-timed-up {
  top: -70px;
  font-size: 116px;
  margin-right: -10px;
}

/* line 373, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-check-button {
  position: relative;
  top: -130px;
  height: 45px;
  background-color: #ffe919;
  color: #703fcc;
  z-index: 1;
  border-radius: 25px;
}

/* line 381, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-check-button:hover {
  background-color: #ffff73;
}

/* line 385, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-stop .sf-timed-alien-rock {
  position: absolute;
  bottom: 0px;
  left: 132px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/alien_rock.png");
  width: 733px;
  height: 291px;
}

/* line 395, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background .sf-timed-still {
  color: #0097b6;
  font-size: 97px;
  margin-top: 10px;
}

/* line 400, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background .sf-timed-there {
  color: #0097b6;
  font-size: 68px;
  margin-top: -30px;
  margin-bottom: 40px;
}

/* line 406, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background .sf-timed-planet {
  position: absolute;
  top: 150px;
  left: 600px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/planet.png");
  width: 105px;
  height: 50px;
}

/* line 414, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background p .sf-timed-pause-start-over {
  background-color: #7029a5;
  margin-right: 15px;
}

/* line 417, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background p .sf-timed-pause-start-over:hover {
  background-color: #a96dd2;
}

/* line 421, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background p .sf-timed-pause-continue {
  background-color: #0097b6;
  margin-left: 15px;
}

/* line 424, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-timed .sf-timed-pause.sf-popup-background p .sf-timed-pause-continue:hover {
  background-color: #6dddf2;
}

/* line 435, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-header, #sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-score,
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-text {
  font-family: "cubano", "Arial Black", sans-serif;
  font-weight: normal;
}

/* line 440, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-header {
  font-size: 68px;
}

/* line 443, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-header.stop-early, #sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-header.keep-trying {
  font-size: 65px;
  white-space: nowrap;
}

/* line 448, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-header.keep-trying {
  margin-top: 20px;
}

/* line 452, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-message .sf-review-continue-message-score {
  font-size: 45px;
  color: #00e697;
  margin-top: -15px;
}

/* line 459, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons {
  top: 250px;
}

/* line 462, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-keep-practicing {
  background-color: #7029a5;
  margin-right: 15px;
}

/* line 465, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-keep-practicing:hover {
  background-color: #a96dd2;
}

/* line 469, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-keep-practicing + .sf-review-next {
  margin-left: 15px;
}

/* line 472, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-next, #sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-stop-early {
  background-color: #0097b6;
}

/* line 474, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-next:hover, #sprint-fluencies.blast .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-stop-early:hover {
  background-color: #6dddf2;
}

/* line 480, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish {
  background-color: #7642d1;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/finishUpdate.png");
  background-size: 960px 519px;
  background-repeat: no-repeat;
}

/* line 486, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-header {
  margin-top: 40px;
  font-family: "cubano", "Arial Black", sans-serif;
  font-weight: normal;
  font-size: 94px;
  color: #7cfdff;
}

/* line 493, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-scores {
  margin-top: 0px;
}

/* line 496, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-scores .sf-review-finish-score .sf-review-star {
  color: #7cfdff;
}

/* line 499, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-scores .sf-review-finish-score .sf-review-finish-round, #sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-scores .sf-review-finish-score .sf-review-finish-round-score {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: normal;
  font-size: 40px;
  color: #ffe919;
}

/* line 507, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .sf-review-finish-message {
  color: white;
  font-weight: 100;
  font-size: 26px;
}

/* line 514, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .done-area .saving-message {
  color: white;
}

/* line 517, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .love-it-btn, #sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .done-btn {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: bold;
  font-size: 18px;
}

/* line 522, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn {
  margin-right: -50px;
  box-shadow: none;
  border: 1px solid #e1e1e1;
  background-color: transparent;
  color: #e1e1e1;
}

/* line 528, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn:hover {
  background-color: #a96dd2;
}

/* line 532, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img {
  top: 6px;
  left: 20px;
  background-image: url("//webassets.zearn.org/app_assets/general/activity/heart-light-gray.png");
}

/* line 537, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img.selected {
  background-image: url("//webassets.zearn.org/app_assets/general/activity/heart-pink.png");
}

/* line 542, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #0097b6;
}

/* line 547, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:hover {
  background-color: #6dddf2;
}

/* line 550, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-review .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:disabled {
  background-color: #5d6f78;
}

/* line 559, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image {
  bottom: 0px;
  top: auto;
}

/* line 563, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.astronaut {
  width: 114px;
  height: 141px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/astronaut.png");
}

/* line 567, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.astronaut ~ .sf-speech-bubble {
  width: 87px;
  height: 79px;
  top: 86px;
  left: 90px;
}

/* line 572, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.astronaut ~ .sf-speech-bubble .sf-speech-bubble-img {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/speech-bubble-2.png");
}

/* line 575, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.astronaut ~ .sf-speech-bubble .sf-speech-bubble-text {
  padding: 5px 5px 20px 5px;
}

/* line 580, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.monster {
  width: 89px;
  height: 95px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/monster.png");
}

/* line 584, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.monster ~ .sf-speech-bubble {
  width: 127px;
  height: 119px;
  top: 75px;
  left: 50px;
}

/* line 589, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-img {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/speech-bubble.png");
}

/* line 592, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.monster ~ .sf-speech-bubble .sf-speech-bubble-text {
  padding: 27px 25px 41px 38px;
}

/* line 597, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.alien {
  width: 101px;
  height: 152px;
  right: 0px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/alien.png");
}

/* line 602, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.alien ~ .sf-speech-bubble {
  width: 190px;
  height: 130px;
}

/* line 605, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.alien ~ .sf-speech-bubble .sf-speech-bubble-img {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/blasts/characters/speech-bubble-3.png");
}

/* line 608, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-side-image.alien ~ .sf-speech-bubble .sf-speech-bubble-text {
  padding: 48px 45px 35px 45px;
}

/* line 614, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-speech-bubble {
  position: absolute;
  top: 0px;
  right: 0px;
}

/* line 618, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-speech-bubble .sf-speech-bubble-img, #sprint-fluencies.blast .sf-problems .sf-speech-bubble .sf-speech-bubble-text {
  height: 100%;
  width: 100%;
  position: absolute;
}

/* line 623, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-problems .sf-speech-bubble .sf-speech-bubble-text {
  font-size: 18px;
  font-weight: 100;
  line-height: 1.3;
  color: white;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 636, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-progress {
  padding: 0px;
}

/* line 638, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-progress .sf-progress-cell {
  height: 15px;
  background-color: #492985;
  border: 1px solid #703fcc;
}

/* line 642, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-progress .sf-progress-cell.correct, #sprint-fluencies.blast .sf-progress .sf-progress-cell.incorrect {
  background-color: yellow;
}

/* line 644, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-progress .sf-progress-cell.correct .sf-progress-status, #sprint-fluencies.blast .sf-progress .sf-progress-cell.incorrect .sf-progress-status {
  background-image: none;
  background-size: 0px;
  width: auto;
  height: auto;
  background-color: none;
}

/* line 652, app/assets/stylesheets/sprint_fluencies/blasts.scss */
#sprint-fluencies.blast .sf-progress .sf-progress-cell .sf-progress-status {
  margin: auto;
  width: auto;
  height: auto;
  border-radius: 0px;
  border: none;
  background: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/sprint_fluencies/fraction_multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems.sf-fraction-mc-problems .fraction {
  min-width: 32px;
}

/* line 10, app/assets/stylesheets/sprint_fluencies/fraction_multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-problems-table .sf-row td span {
  line-height: 32px;
}

/* line 13, app/assets/stylesheets/sprint_fluencies/fraction_multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-problems-table .sf-row .fraction {
  font-size: 18px;
}

/* line 19, app/assets/stylesheets/sprint_fluencies/fraction_multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices .sf-mc-choice .numerator, #sprint-fluencies .sf-problems.sf-mc-problems.sf-fraction-mc-problems .sf-mc-choices .sf-mc-choice .denominator {
  font-size: 20px;
  width: 40px;
  margin: 0 auto;
  line-height: 26px;
  height: 26px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 12, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-problems-container, #sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices {
  display: inline-block;
  vertical-align: middle;
}

/* line 17, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices {
  background-color: #cccccc;
  height: 80px;
  padding: 10px;
  position: relative;
  top: 1px;
  border-radius: 5px;
  left: -1px;
  transition: opacity 200ms ease-in-out;
}

/* line 27, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices.inactive {
  opacity: 0;
}

/* line 30, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices.inactive .sf-mc-choice {
  visibility: hidden;
}

/* line 35, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice {
  display: inline-block;
  height: 60px;
  min-width: 60px;
  border-radius: 100%;
  vertical-align: middle;
  margin: 0 5px;
  border: 2px solid #646464;
  background-color: white;
  font-weight: bold;
  line-height: 56px;
  color: black;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 30px;
  cursor: pointer;
  transition: opacity 200ms ease-in-out;
}

/* line 52, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:hover:not(.disabled) {
  border-color: #0097b6;
}

/* line 56, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice:active:not(.disabled), #sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.selected {
  border-color: #0097b6;
  background-color: #ccffff;
}

/* line 61, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.inactive {
  opacity: 0;
}

/* line 65, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-mc-choices .sf-mc-choice.disabled {
  border-color: #cccccc;
  color: #cccccc;
  cursor: default;
  transition: 400ms ease-in-out;
}

/* line 77, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-problems-table .sf-row .sf-correctness-cell {
  width: 50%;
}

/* line 81, app/assets/stylesheets/sprint_fluencies/multiple_choice.scss */
#sprint-fluencies .sf-problems.sf-mc-problems .sf-problems-table .sf-row.active-row {
  border-right-width: 0px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

/* line 31, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias {
  font-family: 'Dosis', sans-serif;
  text-align: center;
  margin: 0px auto;
  width: 1024px;
  height: 578px;
  border: 1px solid #ddd;
  position: relative;
  -webkit-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -moz-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -ms-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -o-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
}

/* line 41, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-correct-circle, #multiply-manias .sf-progress .sf-progress-cell.correct .sf-progress-status, #multiply-manias .sf-correctness.true, #multiply-manias .sf-incorrect-circle, #multiply-manias .sf-progress .sf-progress-cell.incorrect .sf-progress-status, #multiply-manias .sf-correctness.false {
  width: 28px;
  height: 28px;
  background-color: transparent;
}

/* line 46, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-correct-circle, #multiply-manias .sf-progress .sf-progress-cell.correct .sf-progress-status, #multiply-manias .sf-correctness.true {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/green_checkmark.png");
  background-size: 100% 100%;
}

/* line 50, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-incorrect-circle, #multiply-manias .sf-progress .sf-progress-cell.incorrect .sf-progress-status, #multiply-manias .sf-correctness.false {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/white_x_mark.png");
  background-size: 100% 100%;
}

/* line 55, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening {
  height: 576px;
  position: relative;
  cursor: pointer;
}

/* line 60, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background {
  height: 100%;
  width: 100%;
}

/* line 63, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row {
  background: white;
  border-color: #e5197a;
}

/* line 66, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row.main {
  border-top-width: 3px;
}

/* line 68, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row.main .text {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/mm_startscreen_sprites2.png");
  height: 100%;
  width: 100%;
  position: absolute;
  background-repeat: no-repeat;
}

/* line 74, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row.main .text.text-0 {
  background-position: center -185px;
}

/* line 77, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row.main .text.text-1 {
  background-position: center -323px;
  opacity: 0;
}

/* line 81, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-background .sf-opening-row.main .text.text-2 {
  background-position: center -461px;
  opacity: 0;
}

/* line 89, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-footer {
  display: none;
  position: absolute;
  bottom: 30px;
  right: 50px;
  width: 200px;
  height: 150px;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/mm_startscreen_sprites2.png");
  background-position: -670px 0;
  -webkit-animation: pulse 1.2s ease-in-out infinite;
  -moz-animation: pulse 1.2s ease-in-out infinite;
  -ms-animation: pulse 1.2s ease-in-out infinite;
  -o-animation: pulse 1.2s ease-in-out infinite;
  animation: pulse 1.2s ease-in-out infinite;
}

/* line 100, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .sf-opening-footer .go-button {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  height: 150px;
  cursor: pointer;
}

/* line 109, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .character-animation {
  position: absolute;
  z-index: 2;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/mm_startscreen_sprites2.png");
}

/* line 113, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .character-animation.animation-0 {
  background-position: 0 0;
  width: 112px;
  height: 142px;
  left: 90px;
  top: 80px;
}

/* line 120, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .character-animation.animation-1 {
  background-position: -112px 0;
  width: 167px;
  height: 114px;
  left: 200px;
  top: 330px;
  opacity: 0;
}

/* line 128, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-opening .character-animation.animation-2 {
  background-position: -279px 0;
  width: 162px;
  height: 160px;
  left: 670px;
  top: 10px;
  opacity: 0;
}

/* line 139, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .mm-row {
  width: 100%;
  height: 72px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #999;
}

/* line 144, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .mm-row.main {
  position: relative;
  overflow: hidden;
  height: 144px;
  background-color: white;
  border-top: 2px solid #3f3f3f;
  border-bottom: 3px solid #3f3f3f;
}

/* line 152, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .mm-row:last-child {
  border-bottom: none;
}

/* line 157, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .zearn-button {
  font-family: 'Dosis', sans-serif;
  background: #0097b6;
  border-radius: 2px;
  letter-spacing: 1px;
}

/* line 162, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .zearn-button:disabled {
  background: #c7e7f8;
}

/* line 167, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-header-area {
  display: table;
  position: absolute;
  width: 130px;
  height: 170px;
  margin-top: -85px;
  left: -1px;
  top: 288px;
  background: white;
  border: 1px solid #ddd;
  border-left-color: white;
  border-top-right-radius: 1em;
  border-bottom-right-radius: 1em;
  box-shadow: 1px 1px 0 1px #f7f7f7;
  z-index: 2;
}

/* line 182, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-header-area .countdown-clock, #multiply-manias .sf-header-area .sf-review-practice-area {
  position: absolute;
  top: 85px;
  margin-top: -50px;
  left: 65px;
  margin-left: -50px;
}

/* line 191, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .try-again-popup, #multiply-manias .incorrect-popup, #multiply-manias .sf-timed-stop-box, #multiply-manias .sf-review-continue-box {
  position: absolute;
  width: 100%;
  height: 150px;
  top: 288px;
  margin-top: -75px;
}

/* line 199, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed-stop-backdrop, #multiply-manias .sf-review-continue-backdrop {
  position: absolute;
  width: 100%;
  height: 100%;
  background: white;
  opacity: 0.4;
}

/* line 205, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed-stop-backdrop.transparent, #multiply-manias .sf-review-continue-backdrop.transparent {
  opacity: 0;
}

/* line 210, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-correctness {
  vertical-align: middle;
}

/* line 219, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-correctness.good-work {
  visibility: hidden;
}

/* line 224, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed {
  position: relative;
  height: 576px;
}

/* line 228, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro {
  position: absolute;
  width: 100%;
  height: 100%;
  background: white;
  z-index: 2;
}

/* line 234, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-messages-container {
  position: absolute;
  width: 100%;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

/* line 239, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-message {
  display: table;
  width: 100%;
  height: 139px;
  font-size: 60px;
  font-weight: bold;
  color: white;
}

/* line 246, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-message span {
  display: table-cell;
  vertical-align: middle;
}

/* line 250, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-message.intro-0 {
  background: #e5197a;
}

/* line 253, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-message.intro-1 {
  background: #0097b6;
}

/* line 256, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-intro .sf-timed-intro-message.intro-2 {
  background: #5a29fb;
  font-size: 90px;
}

/* line 263, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-header-area {
  display: none;
}

/* line 267, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop {
  display: none;
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
}

/* line 275, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop .sf-timed-stop-box {
  overflow: hidden;
  background: #ffa01c;
  color: white;
  font-size: 90px;
  font-weight: bold;
}

/* line 281, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop .sf-timed-stop-box .sf-timed-stop-container {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

/* line 287, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop .sf-timed-stop-box .sf-timed-stop-block {
  width: 100%;
  height: 150px;
  background: #ffa01c;
}

/* line 292, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop .sf-timed-stop-box .sf-timed-stop-message {
  vertical-align: middle;
}

/* line 295, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-stop .sf-timed-stop-box .zearn-button {
  text-transform: uppercase;
  font-size: 28px;
}

/* line 302, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-pause {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  background: #333;
  color: white;
  opacity: 0.93;
  z-index: 2;
}

/* line 313, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-pause .pause-character, #multiply-manias .sf-timed .sf-timed-pause .pause-content {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* line 318, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-pause .pause-character {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/StillThere2.gif");
}

/* line 321, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-pause .pause-message {
  margin-top: 200px;
  font-size: 90px;
}

/* line 325, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-timed .sf-timed-pause .zearn-button {
  opacity: 1;
  font-size: 24px;
  text-transform: uppercase;
  margin: 40px;
}

/* line 334, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems {
  font-size: 24px;
}

/* line 337, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-side-image-box {
  display: none;
  z-index: 1;
  position: absolute;
  width: 100%;
  height: 150px;
  top: 288px;
  margin-top: -75px;
}

/* line 346, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-side-image {
  border-top: 3px solid #3f3f3f;
  border-bottom: 3px solid #3f3f3f;
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
}

/* line 354, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-side-image.last-answered {
  border-bottom-color: #ffa01c;
}

/* line 359, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-container {
  position: relative;
  overflow: hidden;
  height: 575px;
  width: 100%;
  background: #f7f7f7;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: 200;
}

/* line 369, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .trailer {
  display: none;
}

/* line 373, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table {
  position: absolute;
  left: 0;
  width: 100%;
  border-collapse: collapse;
  border-top: 1px solid #999;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

/* line 382, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table.to-top-scroll {
  -webkit-transition: all 1000ms;
  -moz-transition: all 1000ms;
  -ms-transition: all 1000ms;
  -o-transition: all 1000ms;
  transition: all 1000ms;
}

/* line 386, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-correctness-cell {
  text-align: right;
  padding-right: 10px;
}

/* line 391, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-message-cell {
  padding-right: 20px;
  width: 270px;
  font-family: 'Dosis', sans-serif;
}

/* line 396, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-message-cell .review-correct-message {
  display: none;
  font-size: 26px;
}

/* line 402, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-lhs, #multiply-manias .sf-problems .sf-problems-table .sf-rhs {
  white-space: nowrap;
}

/* line 406, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-lhs {
  text-align: right;
  width: 47%;
}

/* line 411, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-rhs {
  text-align: left;
}

/* line 415, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-equals {
  min-width: 40px;
}

/* line 419, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-td-inner {
  display: inline-block;
  position: relative;
  vertical-align: middle;
}

/* line 425, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table .sf-correctness {
  display: none;
}

/* line 429, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr {
  background: #f7f7f7;
  border-bottom: 1px solid #999;
}

/* line 432, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.active-row {
  background: white;
  border-top: 3px solid #3f3f3f;
  border-bottom: 3px solid #3f3f3f;
  font-size: 34px;
  font-weight: bold;
}

/* line 438, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.active-row td {
  height: 144px;
}

/* line 441, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.active-row.incorrect {
  background: #3f3f3f;
  color: white;
  border-color: #3f3f3f;
}

/* line 446, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.active-row .sf-problems-correct {
  color: white;
  font-size: 64px;
  position: absolute;
  opacity: 0;
  left: 0;
  display: inline-block;
  width: 78px;
  text-align: center;
}

/* line 457, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.clickable {
  cursor: pointer;
}

/* line 460, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.last-answered, #multiply-manias .sf-problems .sf-problems-table tr:last-child:not(.practice):not(.unanswered) {
  border-bottom: 3px solid #ffa01c;
}

/* line 463, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.first-unanswered {
  border-top: 3px solid #ffa01c;
}

/* line 466, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.unanswered {
  color: #bbb;
}

/* line 469, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.spacer {
  height: 0;
}

/* line 471, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table tr.spacer td {
  padding: 0;
  height: 0;
}

/* line 477, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table td {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  height: 72px;
}

/* line 480, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table td span {
  vertical-align: baseline;
  line-height: 40px;
}

/* line 484, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .sf-problems-table td span:not(.spacer) {
  display: inline-block;
}

/* line 491, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .try-again-popup, #multiply-manias .sf-problems .incorrect-popup {
  display: table;
  background: #3f3f3f;
  color: white;
  font-family: 'Dosis', sans-serif;
  font-size: 48px;
}

/* line 500, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .incorrect-popup .incorrect-message {
  display: table-cell;
  vertical-align: middle;
}

/* line 504, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-problems .incorrect-popup .sf-correctness {
  position: absolute;
  right: 10px;
  top: 75px;
  margin-top: -14px;
}

/* line 513, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review {
  position: relative;
}

/* line 516, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

/* line 523, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box {
  background-color: orange;
}

/* line 525, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-block {
  display: none;
  position: absolute;
  width: 100%;
  height: 150px;
  background: #ffa01c;
}

/* line 532, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box div {
  font-size: 24px;
}

/* line 534, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  padding: 16px;
  color: white;
}

/* line 541, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box .zearn-button {
  width: 240px;
  margin: 10px 30px;
}

/* line 544, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box .zearn-button span {
  vertical-align: middle;
  margin: 0 5px;
  line-height: 32px;
}

/* line 549, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-continue .sf-review-continue-box .zearn-button .right-arrow {
  display: inline-block;
  font-size: 30px;
  margin-bottom: 3px;
}

/* line 558, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-score-area {
  display: table-cell;
  vertical-align: middle;
  font-size: 66px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: bold;
  color: #47CF49;
}

/* line 565, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-score-area .sf-review-score {
  margin-right: 10px;
}

/* line 568, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-review-score-area .sf-correctness {
  display: inline-block;
  width: 28px;
  height: 28px;
}

/* line 576, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-header-area .sf-review-score-area .sf-correctness {
  visibility: hidden;
}

/* line 579, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .sf-header-area .sf-review-practice-area {
  display: none;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #f9d7af;
  color: #ffa01c;
  padding-top: 24px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 20px;
}

/* line 592, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .next-container {
  display: none;
  position: absolute;
  width: 160px;
  height: 90px;
  top: -2px;
  right: -1px;
  background: white;
  border: 1px solid #ddd;
  border-bottom-left-radius: 1em;
  border-right-color: white;
  border-top-color: white;
}

/* line 604, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review .next-container .sf-review-next {
  margin-top: 30px;
}

/* line 610, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  display: none;
  position: absolute;
  background: white;
  width: 100%;
  height: 100%;
  top: 0;
  z-index: 2;
  font-size: 24px;
}

/* line 621, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .end-message {
  margin-top: 110px;
  color: #5a29fb;
  font-size: 60px;
  font-weight: bold;
}

/* line 627, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .sf-review-finish-scores {
  margin: 10px 0;
  height: 90px;
  display: inline-block;
}

/* line 631, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .sf-review-finish-scores .sf-review-finish-score {
  position: relative;
  color: #47CF49;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 80px;
  font-weight: bold;
}

/* line 637, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .sf-review-finish-scores .sf-review-finish-score span {
  display: inline-block;
}

/* line 640, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .sf-review-finish-scores .sf-review-finish-score .sf-correctness {
  margin-bottom: 20px;
  width: 56px;
  height: 56px;
}

/* line 646, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .sf-review-finish-scores .sf-review-finish-text {
  color: #47CF49;
  font-size: 60px;
  line-height: 50px;
}

/* line 653, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area {
  margin-top: 40px;
}

/* line 655, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .love-it-btn {
  background: #ccc;
}

/* line 662, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish.correct-10 {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/EndScreen_1.png");
}

/* line 662, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish.correct-20 {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/EndScreen_2.png");
}

/* line 662, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish.correct-30 {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/EndScreen_3.png");
}

/* line 662, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-review-finish.correct-40 {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/EndScreen_4.png");
}

/* line 668, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-progress {
  width: 100%;
  display: table;
  padding: 0 40px;
}

/* line 672, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-progress .sf-progress-cell {
  display: table-cell;
}

/* line 675, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-progress .sf-progress-cell .sf-progress-status {
  margin: 5px auto;
  width: 28px;
  height: 28px;
  border-radius: 14px;
  border: 3px solid #4d4d4d;
  background: white;
}

/* line 684, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-progress .sf-progress-cell.correct .sf-progress-status {
  border: none;
}

/* line 688, app/assets/stylesheets/sprint_fluencies/multiply_manias.scss */
#multiply-manias .sf-progress .sf-progress-cell.incorrect .sf-progress-status {
  border: none;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 12, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
body.sprint_fluencies {
  background-color: #ebebeb;
}

/* line 16, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies-header {
  margin: 20px 180px;
}

/* line 20, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies {
  font-family: 'Dosis', sans-serif;
  background-color: #f2f3f3;
  text-align: center;
  margin: 0px auto;
  width: 1024px;
  min-height: 500px;
  position: relative;
  -webkit-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -moz-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -ms-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -o-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
}

/* line 30, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .zearn-button {
  font-family: 'Dosis', sans-serif;
  width: 150px;
  height: 35px;
  font-size: 22px;
  border-radius: 3px;
}

/* line 38, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-small-popup {
  width: 300px;
  height: 200px;
  background-color: #e8e6e7;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 50px;
  -webkit-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
}

/* line 50, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-medium-popup {
  width: 400px;
  height: 230px;
  background-color: #e8e6e7;
  margin-left: auto;
  margin-right: auto;
  padding: 50px 30px;
  -webkit-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
}

/* line 62, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-large-popup {
  width: 500px;
  height: 340px;
  background-color: #e8e6e7;
  margin-left: auto;
  margin-right: auto;
  padding: 30px 50px;
  -webkit-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 0px 25px 10px rgba(0, 0, 0, 0.15);
}

/* line 74, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-popup-background {
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 1;
}

/* line 79, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-correct-circle, #sprint-fluencies .sf-progress .sf-progress-cell.correct .sf-progress-status, #sprint-fluencies .sf-problems .sf-problems-table .sf-correctness.true, #sprint-fluencies .sf-incorrect-circle, #sprint-fluencies .sf-progress .sf-progress-cell.incorrect .sf-progress-status, #sprint-fluencies .sf-problems .sf-problems-table .sf-correctness.false {
  width: 28px;
  height: 28px;
  background-color: transparent;
}

/* line 84, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-correct-circle, #sprint-fluencies .sf-progress .sf-progress-cell.correct .sf-progress-status, #sprint-fluencies .sf-problems .sf-problems-table .sf-correctness.true {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/green_checkmark.png");
  background-size: 100% 100%;
}

/* line 88, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-incorrect-circle, #sprint-fluencies .sf-progress .sf-progress-cell.incorrect .sf-progress-status, #sprint-fluencies .sf-problems .sf-problems-table .sf-correctness.false {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/x_mark.png");
  background-size: 100% 100%;
}

/* line 93, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-opening {
  min-height: 500px;
  position: relative;
  cursor: pointer;
}

/* line 98, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-opening .sf-opening-background {
  height: 510px;
  width: 100%;
  background-color: #0097b6;
  padding-top: 120px;
}

/* line 104, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-opening .sf-opening-background .sf-opening-logo {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/sprint_opening_logo.svg");
  height: 225px;
  background-repeat: no-repeat;
  background-position: center;
}

/* line 111, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-opening .sf-opening-background .go-button {
  border-radius: 3px;
  width: 100px;
  height: 40px;
  background-color: white;
  color: #646464;
  font-size: 28px;
  vertical-align: middle;
  box-shadow: 2px 2px 2px grey;
  padding: 0;
}

/* line 126, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-header, #sprint-fluencies .sf-review .sf-header {
  background-color: #ffff73;
}

/* line 128, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-header .sf-header-logo, #sprint-fluencies .sf-review .sf-header .sf-header-logo {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/sprint_logo.svg");
  top: 14px;
  left: 71px;
  width: 180px;
  height: 45px;
  background-size: 180px 45px;
  background-repeat: no-repeat;
  position: absolute;
}

/* line 141, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header {
  position: relative;
  height: 80px;
  text-align: left;
  display: block;
}

/* line 147, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores {
  display: inline-block;
  vertical-align: middle;
  margin-left: 40px;
  font-size: 24px;
}

/* line 154, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores.switch .sf-round-r1, #sprint-fluencies .sf-header .sf-header-scores.switch .sf-review-r1 {
  box-shadow: none;
}

/* line 158, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores.switch .sf-round-r2, #sprint-fluencies .sf-header .sf-header-scores.switch .sf-review-r2 {
  box-shadow: 1px 1px 2px gray;
}

/* line 163, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores.switch .sf-score-table .sf-round-r1-background, #sprint-fluencies .sf-header .sf-header-scores.switch .sf-score-table .sf-review-r1-background {
  opacity: 0.3;
}

/* line 167, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores.switch .sf-score-table .sf-round-r2-background, #sprint-fluencies .sf-header .sf-header-scores.switch .sf-score-table .sf-review-r2-background {
  opacity: 1;
}

/* line 173, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-round-r1, #sprint-fluencies .sf-header .sf-header-scores .sf-round-r2, #sprint-fluencies .sf-header .sf-header-scores .sf-review-r1, #sprint-fluencies .sf-header .sf-header-scores .sf-review-r2 {
  position: absolute;
  top: 25%;
  height: 35px;
  width: 160px;
  margin-right: 5px;
  border-radius: 5px;
  font-size: 14px;
  background-color: #ffffff;
  display: inline-block;
}

/* line 185, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-round-r1, #sprint-fluencies .sf-header .sf-header-scores .sf-review-r1 {
  left: 32%;
  box-shadow: 1px 1px 2px gray;
}

/* line 190, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-round-r2, #sprint-fluencies .sf-header .sf-header-scores .sf-review-r2 {
  left: 50%;
}

/* line 194, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-score-table {
  border-radius: 5px;
  border-spacing: 0px;
  height: 35px;
  width: 160px;
  background-color: #e8e6e7;
}

/* line 201, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-score-table .sf-round-r2-background, #sprint-fluencies .sf-header .sf-header-scores .sf-score-table .sf-review-r2-background {
  opacity: 0.3;
}

/* line 205, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-score-table .sf-header-score-box {
  text-align: center;
  text-transform: uppercase;
  font-weight: 700;
  height: 100%;
  vertical-align: middle;
}

/* line 213, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-score-table .sf-header-score-box-left {
  border-radius: 5px 0px 0px 5px;
  color: #ffffff;
  background-color: #0097b6;
  width: 75px;
}

/* line 220, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-header .sf-header-scores .sf-score-table .sf-header-score-box-right {
  font-family: Oxygen, Verdana, Geneva, sans-serif, sans-serif;
  font-size: 24px;
  border-radius: 0px 5px 5px 0px;
  color: #00c372;
  background-color: white;
  width: 85px;
}

/* line 232, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-countdown-bar-placeholder {
  height: 10px;
}

/* line 236, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed {
  position: relative;
  min-height: 500px;
}

/* line 240, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-check-image {
  position: absolute;
  top: 44%;
  left: 4%;
}

/* line 246, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-go-image {
  position: absolute;
  top: -50px;
  left: 10%;
}

/* line 252, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-intro {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #f2f3f3;
  z-index: 1;
}

/* line 259, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-intro .sf-timed-intro-message {
  font-size: 60px;
  font-weight: 300;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  color: #646464;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #f2f3f3;
}

/* line 269, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-timed-num-seconds, #sprint-fluencies .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-answer-as-many, #sprint-fluencies .sf-timed .sf-timed-intro .sf-timed-intro-message .sf-go {
  position: relative;
  top: 180px;
}

/* line 276, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .countdown-clock {
  position: absolute;
  right: 10px;
  top: 15px;
  z-index: 1;
}

/* line 283, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-stop {
  display: none;
  padding-top: 120px;
  position: absolute;
  width: 100%;
  height: 100%;
  background: #f2f3f3;
  font-size: 90px;
  font-weight: bold;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  z-index: 2;
  top: 0;
  left: 0;
}

/* line 297, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-stop .sf-timed-stop-message {
  color: #93348e;
  font-size: 80px;
}

/* line 301, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-stop .sf-timed-stop-message.times-up {
  color: #f9a726;
  font-weight: 600;
  font-size: 90px;
}

/* line 308, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-stop .sf-check-button {
  width: 180px;
  font-size: 18px;
  background-color: #0097b6;
}

/* line 315, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-pause {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  z-index: 2;
}

/* line 323, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-pause .sf-timed-pause-box {
  margin-top: 80px;
}

/* line 327, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-pause .sf-timed-pause-start-over {
  background-color: #93348e;
  margin-right: 40px;
}

/* line 332, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-timed .sf-timed-pause .sf-timed-pause-continue {
  background-color: #0097b6;
  margin-left: 40px;
}

/* line 339, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems {
  font-size: 20px;
  min-height: 500px;
  margin-top: -80px;
  padding-top: 80px;
  overflow: hidden;
  position: relative;
}

/* line 347, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-side-image-box {
  position: absolute;
  top: 180px;
  width: 180px;
  height: 300px;
}

/* line 354, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-side-image-box-left {
  left: -180px;
}

/* line 358, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-side-image-box-right {
  right: -180px;
}

/* line 362, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-side-image {
  position: absolute;
  top: 0px;
  width: 100%;
  height: 100%;
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/sprites3.png");
  background-repeat: no-repeat;
}

/* line 371, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-instructions {
  margin: 20px 180px 40px 205px;
  font-weight: bold;
  font-size: 28px;
  display: flex;
  align-items: center;
}

/* line 379, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-container {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: 200;
  height: 316px;
  overflow: hidden;
  position: relative;
  width: 60%;
  margin: 0 auto;
}

/* line 389, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .trailer {
  display: none;
}

/* line 393, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table {
  border-spacing: 0px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  border-collapse: collapse;
  color: #646464;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

/* line 405, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-row .sf-correctness-cell {
  width: 10%;
}

/* line 409, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-row .sf-message-cell {
  min-width: 72px;
  width: 20%;
  text-align: left;
}

/* line 416, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-star-background {
  background: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/Stars-HighScore.png") no-repeat;
  background-size: auto 100%;
}

/* line 421, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-accuracy-display {
  width: 10%;
  min-width: 40px;
}

/* line 427, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-lhs .token-image {
  vertical-align: middle;
}

/* line 432, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-lhs, #sprint-fluencies .sf-problems .sf-problems-table .sf-rhs {
  white-space: nowrap;
}

/* line 436, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-lhs.right-align {
  text-align: right;
}

/* line 440, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-rhs {
  text-align: left;
}

/* line 444, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-equals {
  min-width: 27px;
}

/* line 448, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-td-inner {
  display: inline-block;
  position: relative;
  vertical-align: middle;
}

/* line 454, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table .sf-correctness {
  display: none;
  vertical-align: middle;
}

/* line 466, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr {
  background-color: white;
  border: 2px solid #f2f3f3;
}

/* line 470, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr.active-row {
  border: 4px solid #f2f3f3;
  background: #cccccc;
  color: black;
  font-size: 28px;
  font-weight: bold;
  height: 56px;
}

/* line 481, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr:not(.wider) .sf-lhs:not(.right-align) {
  min-width: 60%;
}

/* line 484, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr:not(.wider) .sf-lhs.right-align {
  width: 50%;
  min-width: 30%;
}

/* line 489, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr:not(.wider) .sf-rhs {
  width: 30%;
}

/* line 494, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr.sf-green-background {
  background-color: #056125;
  color: white;
}

/* line 499, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table tr.clickable {
  cursor: pointer;
}

/* line 503, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table td {
  height: 40px;
  padding: 12px;
}

/* line 507, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-problems-table td span:not(.spacer) {
  display: inline-block;
}

/* line 514, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .try-again-popup, #sprint-fluencies .sf-problems .incorrect-popup, #sprint-fluencies .sf-problems .correct-popup {
  display: none;
  min-height: 500px;
  width: 100%;
  padding-top: 60px;
  position: absolute;
  top: 0px;
  font-size: 24px;
  font-color: #646464;
}

/* line 525, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .sf-small-popup-box {
  margin-top: 100px;
}

/* line 529, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .correct-problem {
  font-weight: 600;
  font-size: 30px;
  color: #646464;
  margin: 10px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  position: relative;
  top: 15px;
}

/* line 538, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .correct-problem .token {
  vertical-align: middle;
}

/* line 544, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .incorrect-popup .top-section {
  color: #f9a726;
  font-size: 40px;
  font-weight: 600;
}

/* line 552, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .correct-popup .top-section {
  padding-top: 12px;
  color: #6fb50b;
  font-size: 40px;
  font-weight: 700;
}

/* line 563, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .mixed-fraction-input .whole .empty, #sprint-fluencies .sf-review-problems .mixed-fraction-input .whole .empty {
  display: none;
}

/* line 566, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-problems .zearn-input, #sprint-fluencies .sf-problems .number-input, #sprint-fluencies .sf-problems .super-input, #sprint-fluencies .sf-review-problems .zearn-input, #sprint-fluencies .sf-review-problems .number-input, #sprint-fluencies .sf-review-problems .super-input {
  vertical-align: middle;
}

/* line 571, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review {
  min-height: 500px;
}

/* line 576, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-header .sf-review-header-message {
  position: absolute;
  right: 30px;
  top: 25px;
  text-align: center;
  font-size: 24px;
  color: #4d4d4d;
}

/* line 585, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-header .sf-review-next {
  position: absolute;
  top: 22px;
  right: 30px;
  margin-right: 20px;
  background-color: #6fb50b;
  z-index: 1;
}

/* line 595, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-r2, #sprint-fluencies .sf-review .sf-review-done, #sprint-fluencies .sf-review .sf-review-continue {
  display: none;
}

/* line 599, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* line 606, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box {
  position: absolute;
  top: 80px;
  left: 50%;
  margin-left: -250px;
  font-size: 18px;
}

/* line 613, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons {
  position: absolute;
  left: 0px;
  bottom: 30px;
  width: 100%;
}

/* line 619, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .zearn-button {
  display: inline-block;
  font-size: 18px;
}

/* line 624, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-keep-practicing {
  background-color: #93348e;
  margin-right: 90px;
}

/* line 629, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-next, #sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box .sf-review-continue-buttons .sf-review-stop-early {
  background-color: #0097b6;
}

/* line 634, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div {
  font-size: 24px;
}

/* line 637, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-text {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 24px;
  margin-top: 30px;
}

/* line 642, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-header {
  font-family: 'Dosis', sans-serif;
  font-size: 54px;
  font-weight: 900;
  color: #0097b6;
  margin-bottom: 10px;
}

/* line 649, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-header.stop-early, #sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-header.keep-trying {
  line-height: 200px;
}

/* line 653, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-score {
  font-size: 40px;
  font-weight: 600;
  color: #6fb50b;
}

/* line 658, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review .sf-review-continue .sf-review-continue-box div.sf-review-continue-message .sf-review-continue-message-round {
  color: #646464;
}

/* line 669, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish {
  position: absolute;
  background: #f2f3f3;
  width: 100%;
  height: 100%;
  top: 0;
  z-index: 1;
  font-size: 24px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  color: #646464;
  display: none;
}

/* line 681, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-header {
  margin-top: 20px;
  font-size: 100px;
  font-weight: 700;
  color: #93348e;
  font-family: 'Dosis', sans-serif;
}

/* line 688, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-message {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}

/* line 695, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-image {
  position: absolute;
  top: 180px;
}

/* line 700, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-image-left {
  left: 50px;
}

/* line 704, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-image-right {
  right: 50px;
}

/* line 708, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-scores {
  margin: 36px 0;
  display: inline-block;
  text-align: left;
}

/* line 713, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-scores .sf-review-finish-score {
  padding: 0 30px;
  position: relative;
  color: #0fa566;
  font-size: 34px;
  font-weight: 700;
  display: inline-block;
}

/* line 721, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-scores .sf-review-finish-score .sf-review-finish-round {
  font-family: 'Dosis', sans-serif;
  font-size: 24px;
  text-transform: uppercase;
  color: #646464;
  font-weight: 600;
  margin-right: 10px;
}

/* line 731, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .sf-review-finish-scores .sf-review-star {
  color: #0c91cc;
  position: absolute;
  left: -10px;
  top: 2px;
}

/* line 740, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-untimed {
  min-height: 500px;
}

/* line 743, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-untimed .sf-untimed-finished, #sprint-fluencies .sf-untimed .sf-untimed-finished-zero {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  padding-top: 80px;
  background: #f2f3f3;
  font-size: 60px;
  line-height: 100px;
  top: 0px;
}

/* line 753, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-untimed .sf-untimed-finished .sf-untimed-num-correct, #sprint-fluencies .sf-untimed .sf-untimed-finished-zero .sf-untimed-num-correct {
  color: #6fb50b;
}

/* line 760, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area {
  margin-top: 50px;
}

/* line 763, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area .zearn-button {
  width: 155px;
  padding: 2px 10px;
}

/* line 767, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-img {
  top: 5px;
  left: 9px;
}

/* line 771, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-text, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area .zearn-button.love-it-btn .love-it-text {
  margin-left: 35px;
  text-transform: capitalize;
  font-weight: 600;
}

/* line 777, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn {
  background-color: #0097b6;
  text-transform: capitalize;
  font-weight: 600;
}

/* line 781, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-review-finish .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:disabled, #sprint-fluencies .sf-untimed .activity-complete-buttons .activity-complete-buttons-area .zearn-button.done-btn:disabled {
  background-color: #5d6f78;
}

/* line 789, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-progress {
  width: 100%;
  display: table;
  padding: 0 40px;
}

/* line 793, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-progress .sf-progress-cell {
  display: table-cell;
}

/* line 796, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-progress .sf-progress-cell .sf-progress-status {
  margin: 5px auto;
  width: 28px;
  height: 28px;
  border-radius: 14px;
  border: 3px solid #4d4d4d;
  background: #f2f3f3;
}

/* line 805, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-progress .sf-progress-cell.correct .sf-progress-status {
  border: none;
}

/* line 809, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-progress .sf-progress-cell.incorrect .sf-progress-status {
  border: none;
}

/* line 816, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/sprites2.png");
  background-repeat: no-repeat;
  display: block;
}

/* line 822, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_round1_higher_finishlineshortround {
  width: 220px;
  height: 300px;
  background-position: -385px -315px;
}

/* line 828, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_round1_higher_purpleweirdokindahappy {
  width: 220px;
  height: 300px;
  background-position: -615px -315px;
}

/* line 834, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_round2_higher_shortrounddance {
  width: 220px;
  height: 300px;
  background-position: -5px -625px;
}

/* line 840, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_round2_higherpurpleweirdodance {
  width: 220px;
  height: 300px;
  background-position: -235px -625px;
}

/* line 846, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_tied_purpleweirdoecstatic {
  width: 220px;
  height: 300px;
  background-position: -465px -625px;
}

/* line 852, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-finishline_tied_roundstillthere {
  width: 220px;
  height: 300px;
  background-position: -695px -625px;
}

/* line 858, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-inround_stilltherepopup {
  width: 350px;
  height: 224px;
  background-position: -5px -935px;
  margin: 0 auto;
}

/* line 865, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .sf-sprite-startscreens_checkworkflag {
  width: 220px;
  height: 300px;
  background-position: -845px -315px;
}

/* line 871, app/assets/stylesheets/sprint_fluencies/sprint_fluencies.scss */
#sprint-fluencies .audio-widget {
  margin-left: 10px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 2, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite {
  background-image: url("//webassets.zearn.org/app_assets/sprint_fluency/characters/sprites2.png");
  background-repeat: no-repeat;
  display: block;
}

/* line 8, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-Stars-HighScore {
  width: 86px;
  height: 45px;
  background-position: -2px -2px;
}

/* line 14, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_10inarow {
  width: 180px;
  height: 300px;
  background-position: -95px -5px;
}

/* line 20, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_15inarow {
  width: 180px;
  height: 300px;
  background-position: -285px -5px;
}

/* line 26, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_20inarow {
  width: 180px;
  height: 300px;
  background-position: -475px -5px;
}

/* line 32, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_2wrong {
  width: 180px;
  height: 300px;
  background-position: -665px -5px;
}

/* line 38, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_5inarow {
  width: 180px;
  height: 300px;
  background-position: -5px -315px;
}

/* line 44, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-checkingwork_round1beatcheckingwork {
  width: 180px;
  height: 300px;
  background-position: -195px -315px;
}

/* line 50, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_round1_higher_finishlineshortround {
  width: 220px;
  height: 300px;
  background-position: -385px -315px;
}

/* line 56, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_round1_higher_purpleweirdokindahappy {
  width: 220px;
  height: 300px;
  background-position: -615px -315px;
}

/* line 62, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_round2_higher_shortrounddance {
  width: 220px;
  height: 300px;
  background-position: -5px -625px;
}

/* line 68, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_round2_higherpurpleweirdodance {
  width: 220px;
  height: 300px;
  background-position: -235px -625px;
}

/* line 74, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_tied_purpleweirdoecstatic {
  width: 220px;
  height: 300px;
  background-position: -465px -625px;
}

/* line 80, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-finishline_tied_roundstillthere {
  width: 220px;
  height: 300px;
  background-position: -695px -625px;
}

/* line 86, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-inround_round1beatinround2 {
  width: 180px;
  height: 300px;
  background-position: -855px -5px;
}

/* line 92, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-inround_stilltherepopup {
  width: 350px;
  height: 224px;
  background-position: -5px -935px;
}

/* line 98, app/assets/stylesheets/sprint_fluencies/sprint_fluencies_sprites.scss */
.sf-sprite-startscreens_checkworkflag {
  width: 220px;
  height: 300px;
  background-position: -845px -315px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes curve-left {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -moz-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -ms-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -o-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
  }
}

@-moz-keyframes curve-left {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -moz-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -ms-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -o-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
  }
}

@-o-keyframes curve-left {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -moz-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -ms-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -o-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
  }
}

@keyframes curve-left {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -moz-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -ms-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    -o-transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
    transform: rotate(-120deg) translate(320px, -900px) rotate(120deg);
  }
}

@-webkit-keyframes curve-right {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -moz-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -ms-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -o-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
  }
}

@-moz-keyframes curve-right {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -moz-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -ms-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -o-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
  }
}

@-o-keyframes curve-right {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -moz-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -ms-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -o-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
  }
}

@keyframes curve-right {
  0% {
    -webkit-transform: rotate(0deg) translate(0px) rotate(0deg);
    -moz-transform: rotate(0deg) translate(0px) rotate(0deg);
    -ms-transform: rotate(0deg) translate(0px) rotate(0deg);
    -o-transform: rotate(0deg) translate(0px) rotate(0deg);
    transform: rotate(0deg) translate(0px) rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -moz-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -ms-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    -o-transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
    transform: rotate(120deg) translate(-320px, -900px) rotate(-120deg);
  }
}

/* line 43, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group {
  height: 500px;
  background: #136fcb;
}

/* line 47, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-button .ns-video-button-image {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/teacher_images/am.jpg");
}

/* line 51, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-button:not(.expanded) .ns-video-button-image {
  background-position: -63px -6px;
}

/* line 55, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-button.expanded {
  bottom: 26px;
}

/* line 58, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-button.expanded .ns-video-button-image {
  bottom: 34px;
  background-position: -161px 0px;
}

/* line 63, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-button.expanded.rectify .ns-video-button-image {
  background-position: -53px 0px;
}

/* line 68, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-video .ns-video-player {
  bottom: 26px;
}

/* line 73, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-hole-board {
  z-index: 12;
  height: 500px;
}

/* line 76, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-hole-board .ns-hole-bg {
  height: 500px;
}

/* line 79, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-hole-board .ns-hole-mask-rect {
  height: 500px;
}

/* line 86, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-welcome {
  padding-top: 25px;
}

/* line 88, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-welcome .am-welcome {
  width: 100%;
  height: calc(100% - 25px);
}

/* line 91, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-welcome .am-welcome img {
  height: 446px;
}

/* line 94, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-welcome .am-welcome .ns-welcome-button {
  top: 170px;
  left: 633px;
  width: 143px;
  height: 143px;
}

/* line 101, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-welcome .ns-green-circle:not(.big) {
  top: 170px;
  left: 633px;
  width: 143px;
  height: 143px;
}

/* line 109, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main {
  background: white;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
  -ms-transition: all 1s;
  -o-transition: all 1s;
  transition: all 1s;
}

/* line 112, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .ns-main-tasks {
  height: 246px;
}

/* line 115, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-equation-task:not(.active-task) .nb-eq-widget {
  opacity: 0;
  z-index: 0;
  -webkit-transition: all 250ms;
  -moz-transition: all 250ms;
  -ms-transition: all 250ms;
  -o-transition: all 250ms;
  transition: all 250ms;
}

/* line 121, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-equation-task.active-task {
  z-index: 1;
}

/* line 124, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-equation-task {
  position: absolute;
  left: 0;
}

/* line 128, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .ns-main-tasks .task-container {
  margin: 0;
}

/* line 133, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ns-main .fluency-complete-buttons {
  position: absolute;
  width: 500px;
  left: calc(50% - 250px);
}

/* line 141, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget {
  height: 0;
  position: relative;
  -webkit-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
  -ms-transition: opacity 300ms;
  -o-transition: opacity 300ms;
  transition: opacity 300ms;
  -webkit-transition: margin-top 600ms;
  -moz-transition: margin-top 600ms;
  -ms-transition: margin-top 600ms;
  -o-transition: margin-top 600ms;
  transition: margin-top 600ms;
}

/* line 147, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget.lower {
  margin-top: 125px;
}

/* line 151, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c {
  color: #7a00c9;
}

/* line 153, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a.correct:not(.correct-done), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a.incorrect, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1.correct:not(.correct-done), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1.incorrect, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c.correct:not(.correct-done), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c.incorrect {
  color: white;
}

/* line 156, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a.try-again, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1.try-again, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c.try-again {
  color: #323232;
}

/* line 159, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a.zearn-input-box:not(.correct):not(.incorrect):not(.try-again), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-a.zearn-input-box.correct.correct-done, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1.zearn-input-box:not(.correct):not(.incorrect):not(.try-again), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b1.zearn-input-box.correct.correct-done, .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c.zearn-input-box:not(.correct):not(.incorrect):not(.try-again), .addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-c.zearn-input-box.correct.correct-done {
  border-color: #7a00c9;
  color: #7a00c9;
}

/* line 167, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b2.zearn-input-box:not(.zearn-input) {
  border-color: #e4e4e4;
  background-color: #e4e4e4;
}

/* line 172, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-b2.zearn-input-box.zearn-input.incorrect-done {
  border-color: black;
}

/* line 177, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-bottom-whole {
  position: relative;
  bottom: 4px;
}

/* line 181, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-bottom-whole.correct-done:not(.incorrect-done) {
  border-color: black;
}

/* line 186, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-top-whole {
  position: relative;
  top: 0px;
  -webkit-transition: top 500ms ease-in;
  -moz-transition: top 500ms ease-in;
  -ms-transition: top 500ms ease-in;
  -o-transition: top 500ms ease-in;
  transition: top 500ms ease-in;
}

/* line 190, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .nb-eq-widget .nb-eq-top-whole.bottom {
  top: 166px;
}

/* line 197, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget {
  position: absolute;
  left: 280px;
  margin: 0;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 202, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards {
  margin: auto;
  height: 194px;
  -webkit-perspective: 1300px;
  -moz-perspective: 1300px;
  -ms-perspective: 1300px;
  -o-perspective: 1300px;
  perspective: 1300px;
}

/* line 206, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards.active {
  display: inline-block;
}

/* line 210, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card {
  position: relative;
  height: 100%;
  width: 171px;
  float: left;
}

/* line 216, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card.preserve {
  transform-style: preserve-3d;
}

/* line 221, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .front, .addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .back {
  height: 100%;
  width: 100%;
  position: absolute;
  background-repeat: no-repeat;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* line 228, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .back {
  border-radius: 8px;
  border: 1px solid #cccccc;
  background-color: #f6f6f6;
}

/* line 234, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left .front {
  background: url("//webassets.zearn.org/app_assets/number_sense/addition_magician/left-card.svg") no-repeat;
}

/* line 237, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left .back {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

/* line 240, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left.flipped {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}

/* line 246, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left.flipped .back {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}

/* line 250, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left.flipped .front {
  -ms-transform: rotateY(-180deg);
  -webkit-transform: rotateY(-180deg);
}

/* line 255, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left:not(.flipped) {
  overflow: hidden;
}

/* line 258, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-left.swipe {
  -webkit-animation: curve-left 1s ease-in-out 1 forwards;
  -moz-animation: curve-left 1s ease-in-out 1 forwards;
  -ms-animation: curve-left 1s ease-in-out 1 forwards;
  -o-animation: curve-left 1s ease-in-out 1 forwards;
  animation: curve-left 1s ease-in-out 1 forwards;
}

/* line 263, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right .front {
  background: url("//webassets.zearn.org/app_assets/number_sense/addition_magician/right-card.svg") no-repeat;
}

/* line 266, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right .back {
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}

/* line 269, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right.flipped {
  -webkit-transform: rotateY(180deg) translateZ(-1px);
  -moz-transform: rotateY(180deg) translateZ(-1px);
  -ms-transform: rotateY(180deg) translateZ(-1px);
  -o-transform: rotateY(180deg) translateZ(-1px);
  transform: rotateY(180deg) translateZ(-1px);
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}

/* line 276, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right.flipped .back {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
}

/* line 280, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right.flipped .front {
  -ms-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
}

/* line 285, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right:not(.flipped) {
  overflow: hidden;
}

/* line 288, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card-right.swipe {
  -webkit-animation: curve-right 1s ease-in-out 1 forwards;
  -moz-animation: curve-right 1s ease-in-out 1 forwards;
  -ms-animation: curve-right 1s ease-in-out 1 forwards;
  -o-animation: curve-right 1s ease-in-out 1 forwards;
  animation: curve-right 1s ease-in-out 1 forwards;
}

/* line 292, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .am-task-card, .addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .front, .addition-magician.number-sense-task-group .ten-frames-widget .am-task-cards .back {
  -webkit-transition: -webkit-transform 1.5s cubic-bezier(0.22, 0.86, 0.45, 1), left 500ms, right 500ms;
  -moz-transition: -moz-transform 1.5s cubic-bezier(0.22, 0.86, 0.45, 1), left 500ms, right 500ms;
  -o-transition: -o-transform 1.5s cubic-bezier(0.22, 0.86, 0.45, 1), left 500ms, right 500ms;
  transition: transform 1.5s cubic-bezier(0.22, 0.86, 0.45, 1), left 500ms, right 500ms;
}

/* line 298, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer {
  padding: 13px 0;
}

/* line 300, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame {
  padding: 2px;
  background: #656565;
  border-radius: 0;
  border: none;
}

/* line 307, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-col:first-child {
  margin-right: 2px;
}

/* line 312, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell {
  width: 30px;
  height: 30px;
  border: none;
  background: white;
}

/* line 317, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell:not(:last-child) {
  margin-bottom: 2px;
}

/* line 320, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell.highlight {
  background: #fff265;
}

/* line 324, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot {
  border: none;
  top: 2px;
  left: 2px;
}

/* line 329, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc {
  border-radius: 28px;
  top: 0;
  left: 0;
  width: 26px;
  height: 26px;
  -webkit-transition: top 400ms ease-in, left 400ms ease-in, border 500ms;
  -moz-transition: top 400ms ease-in, left 400ms ease-in, border 500ms;
  -ms-transition: top 400ms ease-in, left 400ms ease-in, border 500ms;
  -o-transition: top 400ms ease-in, left 400ms ease-in, border 500ms;
  transition: top 400ms ease-in, left 400ms ease-in, border 500ms;
}

/* line 337, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a {
  background: #7a00c9;
}

/* line 339, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a.scale {
  -webkit-animation: pulse 800ms ease-in 1;
  -moz-animation: pulse 800ms ease-in 1;
  -ms-animation: pulse 800ms ease-in 1;
  -o-animation: pulse 800ms ease-in 1;
  animation: pulse 800ms ease-in 1;
}

/* line 344, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b {
  z-index: 1;
  background: #656565;
}

/* line 347, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.scale {
  -webkit-animation: pulse 800ms ease-in 1;
  -moz-animation: pulse 800ms ease-in 1;
  -ms-animation: pulse 800ms ease-in 1;
  -o-animation: pulse 800ms ease-in 1;
  animation: pulse 800ms ease-in 1;
}

/* line 350, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.tf-hint {
  background: none;
  border: solid 1px #656565;
}

/* line 354, app/assets/stylesheets/number_sense_activities/addition_magician.scss */
.addition-magician.number-sense-task-group .ten-frames-widget .ten-frame-outer .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.fill {
  border: solid 5px #7a00c9;
  background: #656565;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 29, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group {
  height: 440px;
  background: #136fcb;
}

/* line 35, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button .ns-video-button-image {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/teacher_images/amr.jpg");
}

/* line 39, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button:not(.expanded) .ns-video-button-image {
  background-size: 177.7419354839px 100px;
  background-position: -61px -4px;
}

/* line 44, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button.expanded {
  bottom: 18px;
  left: 285.5px;
  width: 389px;
  height: 389px;
}

/* line 50, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button.expanded .ns-video-button-image {
  bottom: 26px;
  left: 334.2661290323px;
  width: 375px;
  height: 375px;
  background-size: 666.5322580645px 375px;
  background-position: -133px 0px;
}

/* line 61, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button.expanded.rectify {
  width: 567px;
  left: 196.5px;
}

/* line 65, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-button.expanded.rectify .ns-video-button-image {
  background-position: -45px 0px;
  width: 551px;
  left: 188.5px;
}

/* line 73, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) {
  bottom: 18px;
  left: 196.5px;
}

/* line 76, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) .ns-video-x {
  left: 545px;
}

/* line 79, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) .video-player {
  width: 567px;
  height: 389px;
}

/* line 82, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) .video-player .video-wrapper {
  min-height: 310px;
}

/* line 85, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) .video-player .video-controls {
  height: 63px;
}

/* line 87, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-video .ns-video-player:not(.hidden) .video-player .video-controls #progress-area #progress-bar {
  width: 317px;
}

/* line 96, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-welcome .amr-welcome {
  width: 100%;
  height: 100%;
  margin-top: -30px;
}

/* line 100, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-welcome .amr-welcome .ns-welcome-button {
  top: 110px;
  left: 670px;
  width: 130px;
  height: 130px;
}

/* line 107, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-welcome .amr-welcome .ns-green-circle:not(.big) {
  top: 110px;
  left: 670px;
  width: 130px;
  height: 130px;
}

/* line 116, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main {
  background: white;
  transition: 1s;
}

/* line 120, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-hole-board {
  z-index: 12;
}

/* line 124, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .pick-a-card {
  z-index: 1;
  width: 30%;
  height: 20%;
  position: absolute;
  left: 35%;
  top: 30%;
  font-size: 48px;
  color: #ff5400;
  font-weight: 500;
  transition: 100ms opacity linear;
}

/* line 137, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks {
  height: 88%;
}

/* line 140, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card {
  position: absolute;
  width: 470px;
  height: 300px;
  left: 0px;
  top: 0px;
  z-index: 2;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -ms-perspective: 1000px;
  -o-perspective: 1000px;
  perspective: 1000px;
  cursor: pointer;
}

/* line 150, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.center {
  -webkit-transform-origin: center;
  -moz-transform-origin: center;
  -ms-transform-origin: center;
  -o-transform-origin: center;
  transform-origin: center;
  top: 100px;
  left: 245px;
  transition: 750ms linear;
}

/* line 156, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.center.left-spin {
  -webkit-transform: rotate(-360deg) scale(1);
  -moz-transform: rotate(-360deg) scale(1);
  -ms-transform: rotate(-360deg) scale(1);
  -o-transform: rotate(-360deg) scale(1);
  transform: rotate(-360deg) scale(1);
}

/* line 160, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.center.right-spin {
  -webkit-transform: rotate(360deg) scale(1);
  -moz-transform: rotate(360deg) scale(1);
  -ms-transform: rotate(360deg) scale(1);
  -o-transform: rotate(360deg) scale(1);
  transform: rotate(360deg) scale(1);
}

/* line 164, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.center.shrink {
  -webkit-transform: scale(0.75);
  -moz-transform: scale(0.75);
  -ms-transform: scale(0.75);
  -o-transform: scale(0.75);
  transform: scale(0.75);
  transition: 100ms linear;
}

/* line 169, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.center.disappear {
  -webkit-transform: translateY(-600px) scale(0.75);
  -moz-transform: translateY(-600px) scale(0.75);
  -ms-transform: translateY(-600px) scale(0.75);
  -o-transform: translateY(-600px) scale(0.75);
  transform: translateY(-600px) scale(0.75);
  transition: 200ms linear;
}

/* line 175, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.disabled {
  cursor: auto;
}

/* line 179, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper {
  width: 100%;
  height: 100%;
  transition: 600ms;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  position: relative;
  -webkit-transform-origin: 100% 50%;
  -moz-transform-origin: 100% 50%;
  -ms-transform-origin: 100% 50%;
  -o-transform-origin: 100% 50%;
  transform-origin: 100% 50%;
  -ms-transform-origin: initial;
}

/* line 188, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper.flipped {
  -webkit-transform: rotateX(180deg);
  -moz-transform: rotateX(180deg);
  -ms-transform: rotateX(180deg);
  -o-transform: rotateX(180deg);
  transform: rotateX(180deg);
  -ms-transform: rotateX(0deg);
}

/* line 193, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper.flipped .back {
  -ms-transform: rotateX(180deg);
}

/* line 196, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper.flipped .front {
  -ms-transform: rotateX(0deg);
}

/* line 201, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper .back, .addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper .front {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  transition: 600ms;
}

/* line 211, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper .back {
  background-repeat: no-repeat;
  background: url("//webassets.zearn.org/app_assets/number_sense/addition_magician_returns/back-of-card.svg");
  z-index: 2;
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
}

/* line 218, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card .flipper .front {
  -webkit-transform: rotateX(180deg);
  -moz-transform: rotateX(180deg);
  -ms-transform: rotateX(180deg);
  -o-transform: rotateX(180deg);
  transform: rotateX(180deg);
  background-color: white;
  border-radius: 3px;
  border: 3px solid lightgray;
  z-index: 1;
}

/* line 228, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.left {
  -webkit-transform-origin: bottom left;
  -moz-transform-origin: bottom left;
  -ms-transform-origin: bottom left;
  -o-transform-origin: bottom left;
  transform-origin: bottom left;
  left: 2px;
  top: -223px;
}

/* line 235, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .amr-task-card.right {
  left: 490px;
  top: -223px;
  -webkit-transform-origin: bottom right;
  -moz-transform-origin: bottom right;
  -ms-transform-origin: bottom right;
  -o-transform-origin: bottom right;
  transform-origin: bottom right;
}

/* line 242, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task {
  position: absolute;
  z-index: 1;
  top: 15px;
  left: 0px;
  width: 100%;
  height: 100%;
  margin: 0px;
}

/* line 254, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-wrapper .nb-eq-top {
  left: 0px;
}

/* line 257, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-wrapper .nb-eq-top .nb-eq-top-whole.zearn-input-box.inactive:not(.disabled):not(.grayed) {
  cursor: pointer;
}

/* line 261, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-wrapper .nb-eq-top .nb-eq-top-whole.zearn-input-box.inactive.grayed:not(.disabled) {
  border-color: #e4e4e4;
  background-color: #e4e4e4;
}

/* line 267, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-wrapper .nb-eq-bottom {
  top: 200px;
  left: 0px;
}

/* line 272, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-part-wrapper {
  position: absolute;
  top: 29px;
  left: 153px;
  padding: 0;
}

/* line 277, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-part-wrapper .nb-eq-parts {
  top: 15px;
}

/* line 279, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-part-wrapper .nb-eq-parts .nb-eq-b1:not(.zearn-input) {
  padding-left: 14px;
  border: 4px solid transparent;
}

/* line 283, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-part-wrapper .nb-eq-parts .nb-eq-b2:not(.zearn-input) {
  padding-right: 14px;
  border: 4px solid transparent;
}

/* line 287, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-part-wrapper .nb-eq-parts .zearn-input.inactive:not(.incorrect):not(.try-again) {
  border: 4px solid transparent;
}

/* line 292, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-arrows-left {
  -webkit-transform: scale(0.95);
  -moz-transform: scale(0.95);
  -ms-transform: scale(0.95);
  -o-transform: scale(0.95);
  transform: scale(0.95);
  left: 28px;
  top: 70px;
}

/* line 296, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-arrows-left .left-arrow-1, .addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-arrows-left .left-arrow-2 {
  fill: #323232;
}

/* line 300, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-arrow-right {
  left: 254px;
  top: 155px;
  -webkit-transform: rotate(-20deg);
  -moz-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -o-transform: rotate(-20deg);
  transform: rotate(-20deg);
}

/* line 304, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .nb-eq-arrow-right .right-arrow-1 {
  fill: #323232;
}

/* line 309, app/assets/stylesheets/number_sense_activities/addition_magician_returns.scss */
.addition-magician-returns.number-sense-task-group .ns-main .ns-main-tasks .addition-magician-returns-equation-task .task .nb-eq-widget .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(.try-again) {
  background-color: white;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes jiggleAlien {
  0% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  10% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  20% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  30% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  40% {
    -webkit-transform: translateX(5px) rotate(-5deg);
    -moz-transform: translateX(5px) rotate(-5deg);
    -ms-transform: translateX(5px) rotate(-5deg);
    -o-transform: translateX(5px) rotate(-5deg);
    transform: translateX(5px) rotate(-5deg);
  }
  50% {
    -webkit-transform: translateX(5px) rotate(5deg);
    -moz-transform: translateX(5px) rotate(5deg);
    -ms-transform: translateX(5px) rotate(5deg);
    -o-transform: translateX(5px) rotate(5deg);
    transform: translateX(5px) rotate(5deg);
  }
  60% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  70% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  80% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  90% {
    -webkit-transform: translateX(0px) rotate(0px);
    -moz-transform: translateX(0px) rotate(0px);
    -ms-transform: translateX(0px) rotate(0px);
    -o-transform: translateX(0px) rotate(0px);
    transform: translateX(0px) rotate(0px);
  }
}

@-moz-keyframes jiggleAlien {
  0% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  10% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  20% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  30% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  40% {
    -webkit-transform: translateX(5px) rotate(-5deg);
    -moz-transform: translateX(5px) rotate(-5deg);
    -ms-transform: translateX(5px) rotate(-5deg);
    -o-transform: translateX(5px) rotate(-5deg);
    transform: translateX(5px) rotate(-5deg);
  }
  50% {
    -webkit-transform: translateX(5px) rotate(5deg);
    -moz-transform: translateX(5px) rotate(5deg);
    -ms-transform: translateX(5px) rotate(5deg);
    -o-transform: translateX(5px) rotate(5deg);
    transform: translateX(5px) rotate(5deg);
  }
  60% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  70% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  80% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  90% {
    -webkit-transform: translateX(0px) rotate(0px);
    -moz-transform: translateX(0px) rotate(0px);
    -ms-transform: translateX(0px) rotate(0px);
    -o-transform: translateX(0px) rotate(0px);
    transform: translateX(0px) rotate(0px);
  }
}

@-o-keyframes jiggleAlien {
  0% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  10% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  20% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  30% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  40% {
    -webkit-transform: translateX(5px) rotate(-5deg);
    -moz-transform: translateX(5px) rotate(-5deg);
    -ms-transform: translateX(5px) rotate(-5deg);
    -o-transform: translateX(5px) rotate(-5deg);
    transform: translateX(5px) rotate(-5deg);
  }
  50% {
    -webkit-transform: translateX(5px) rotate(5deg);
    -moz-transform: translateX(5px) rotate(5deg);
    -ms-transform: translateX(5px) rotate(5deg);
    -o-transform: translateX(5px) rotate(5deg);
    transform: translateX(5px) rotate(5deg);
  }
  60% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  70% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  80% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  90% {
    -webkit-transform: translateX(0px) rotate(0px);
    -moz-transform: translateX(0px) rotate(0px);
    -ms-transform: translateX(0px) rotate(0px);
    -o-transform: translateX(0px) rotate(0px);
    transform: translateX(0px) rotate(0px);
  }
}

@keyframes jiggleAlien {
  0% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  10% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  20% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  30% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  40% {
    -webkit-transform: translateX(5px) rotate(-5deg);
    -moz-transform: translateX(5px) rotate(-5deg);
    -ms-transform: translateX(5px) rotate(-5deg);
    -o-transform: translateX(5px) rotate(-5deg);
    transform: translateX(5px) rotate(-5deg);
  }
  50% {
    -webkit-transform: translateX(5px) rotate(5deg);
    -moz-transform: translateX(5px) rotate(5deg);
    -ms-transform: translateX(5px) rotate(5deg);
    -o-transform: translateX(5px) rotate(5deg);
    transform: translateX(5px) rotate(5deg);
  }
  60% {
    -webkit-transform: translateX(0px) rotate(0deg);
    -moz-transform: translateX(0px) rotate(0deg);
    -ms-transform: translateX(0px) rotate(0deg);
    -o-transform: translateX(0px) rotate(0deg);
    transform: translateX(0px) rotate(0deg);
  }
  70% {
    -webkit-transform: translateX(-5px) rotate(-5deg);
    -moz-transform: translateX(-5px) rotate(-5deg);
    -ms-transform: translateX(-5px) rotate(-5deg);
    -o-transform: translateX(-5px) rotate(-5deg);
    transform: translateX(-5px) rotate(-5deg);
  }
  80% {
    -webkit-transform: translateX(-5px) rotate(5deg);
    -moz-transform: translateX(-5px) rotate(5deg);
    -ms-transform: translateX(-5px) rotate(5deg);
    -o-transform: translateX(-5px) rotate(5deg);
    transform: translateX(-5px) rotate(5deg);
  }
  90% {
    -webkit-transform: translateX(0px) rotate(0px);
    -moz-transform: translateX(0px) rotate(0px);
    -ms-transform: translateX(0px) rotate(0px);
    -o-transform: translateX(0px) rotate(0px);
    transform: translateX(0px) rotate(0px);
  }
}

@-webkit-keyframes shakeAlien {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  6.6% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  13.2% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  20% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  26.6% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  33.2% {
    -webkit-transform: translateX(0px) translateY(10px);
    -moz-transform: translateX(0px) translateY(10px);
    -ms-transform: translateX(0px) translateY(10px);
    -o-transform: translateX(0px) translateY(10px);
    transform: translateX(0px) translateY(10px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}

@-moz-keyframes shakeAlien {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  6.6% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  13.2% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  20% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  26.6% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  33.2% {
    -webkit-transform: translateX(0px) translateY(10px);
    -moz-transform: translateX(0px) translateY(10px);
    -ms-transform: translateX(0px) translateY(10px);
    -o-transform: translateX(0px) translateY(10px);
    transform: translateX(0px) translateY(10px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}

@-o-keyframes shakeAlien {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  6.6% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  13.2% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  20% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  26.6% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  33.2% {
    -webkit-transform: translateX(0px) translateY(10px);
    -moz-transform: translateX(0px) translateY(10px);
    -ms-transform: translateX(0px) translateY(10px);
    -o-transform: translateX(0px) translateY(10px);
    transform: translateX(0px) translateY(10px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}

@keyframes shakeAlien {
  0% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
  6.6% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  13.2% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  20% {
    -webkit-transform: translateX(-5px) translateY(10px);
    -moz-transform: translateX(-5px) translateY(10px);
    -ms-transform: translateX(-5px) translateY(10px);
    -o-transform: translateX(-5px) translateY(10px);
    transform: translateX(-5px) translateY(10px);
  }
  26.6% {
    -webkit-transform: translateX(5px) translateY(10px);
    -moz-transform: translateX(5px) translateY(10px);
    -ms-transform: translateX(5px) translateY(10px);
    -o-transform: translateX(5px) translateY(10px);
    transform: translateX(5px) translateY(10px);
  }
  33.2% {
    -webkit-transform: translateX(0px) translateY(10px);
    -moz-transform: translateX(0px) translateY(10px);
    -ms-transform: translateX(0px) translateY(10px);
    -o-transform: translateX(0px) translateY(10px);
    transform: translateX(0px) translateY(10px);
  }
  100% {
    -webkit-transform: translateX(0px) translateY(0px);
    -moz-transform: translateX(0px) translateY(0px);
    -ms-transform: translateX(0px) translateY(0px);
    -o-transform: translateX(0px) translateY(0px);
    transform: translateX(0px) translateY(0px);
  }
}

/* line 85, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group {
  background: #004080;
  height: 590px;
}

/* line 92, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .alien-1 {
  z-index: 5;
  position: absolute;
  left: 775px;
  top: 256px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Alien1.svg");
  background-size: 75px 78px;
  width: 75px;
  height: 78px;
}

/* line 100, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .alien-10 {
  z-index: 6;
  position: absolute;
  left: 416px;
  top: 204px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Alien10.svg");
  background-size: 382px 377px;
  width: 382px;
  height: 377px;
  -webkit-transform: rotate(-1deg);
  -moz-transform: rotate(-1deg);
  -ms-transform: rotate(-1deg);
  -o-transform: rotate(-1deg);
  transform: rotate(-1deg);
}

/* line 109, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .alien-10-shadow {
  z-index: 4;
  position: absolute;
  left: 441px;
  top: 531px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_10shadow.svg");
  background-size: 223px 70px;
  width: 223px;
  height: 70px;
}

/* line 117, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .alien-100 {
  z-index: 5;
  position: absolute;
  left: 83px;
  top: 309px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Alien100.svg");
  background-size: 160px 164px;
  width: 160px;
  height: 164px;
}

/* line 125, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .alien-100-shadow {
  z-index: 4;
  position: absolute;
  left: 117px;
  top: 474px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_100shadow.svg");
  background-size: 90px 30px;
  width: 90px;
  height: 30px;
}

/* line 133, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .dunes {
  z-index: 1;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Dunes.svg");
  background-size: 960px 275px;
  width: 960px;
  height: 275px;
}

/* line 141, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .ground {
  z-index: 3;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Ground.svg");
  background-size: 960px 253px;
  width: 960px;
  height: 253px;
}

/* line 149, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .jellyfish {
  position: absolute;
  left: 860px;
  top: 73px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Jellyfish.svg");
  background-size: 84px 158px;
  width: 84px;
  height: 158px;
}

/* line 156, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .octopus {
  z-index: 2;
  position: absolute;
  left: -1px;
  top: 1px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Octopus.svg");
  background-size: 960px 588px;
  width: 960px;
  height: 588px;
}

/* line 164, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .plants {
  z-index: 5;
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Plants.svg");
  background-size: 932px 230px;
  width: 932px;
  height: 230px;
}

/* line 172, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .tentacle {
  z-index: 6;
  position: absolute;
  left: 275px;
  top: 205px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Tentacle.svg");
  background-size: 25px 25px;
  width: 25px;
  height: 25px;
}

/* line 180, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .title {
  z-index: 5;
  position: absolute;
  left: 244px;
  top: 37px;
  font-family: "cubano", "Arial Black", sans-serif;
  color: #ffff73;
}

/* line 188, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .title .bundle {
  font-size: 125px;
  line-height: 151px;
}

/* line 193, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .title .the-sea {
  position: relative;
  top: -54px;
  left: 3px;
  font-size: 115px;
  line-height: 139px;
}

/* line 202, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .fish-front {
  z-index: 6;
  position: absolute;
  top: 440px;
  -webkit-animation: fishFront 21000ms linear infinite;
  -moz-animation: fishFront 21000ms linear infinite;
  -ms-animation: fishFront 21000ms linear infinite;
  -o-animation: fishFront 21000ms linear infinite;
  animation: fishFront 21000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_FishFront.svg");
  background-size: 275px 70px;
  width: 275px;
  height: 70px;
}

@-webkit-keyframes fishFront {
  0% {
    left: -300px;
  }
  43%, 100% {
    left: 970px;
  }
}

@-moz-keyframes fishFront {
  0% {
    left: -300px;
  }
  43%, 100% {
    left: 970px;
  }
}

@-o-keyframes fishFront {
  0% {
    left: -300px;
  }
  43%, 100% {
    left: 970px;
  }
}

@keyframes fishFront {
  0% {
    left: -300px;
  }
  43%, 100% {
    left: 970px;
  }
}

/* line 218, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .fish-school {
  z-index: 1;
  position: absolute;
  top: 280px;
  -webkit-animation: fishSchool 21000ms linear infinite;
  -moz-animation: fishSchool 21000ms linear infinite;
  -ms-animation: fishSchool 21000ms linear infinite;
  -o-animation: fishSchool 21000ms linear infinite;
  animation: fishSchool 21000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_FishSchool.svg");
  background-size: 110px 100px;
  width: 110px;
  height: 100px;
}

@-webkit-keyframes fishSchool {
  0% {
    left: -240px;
  }
  71%, 100% {
    left: 970px;
  }
}

@-moz-keyframes fishSchool {
  0% {
    left: -240px;
  }
  71%, 100% {
    left: 970px;
  }
}

@-o-keyframes fishSchool {
  0% {
    left: -240px;
  }
  71%, 100% {
    left: 970px;
  }
}

@keyframes fishSchool {
  0% {
    left: -240px;
  }
  71%, 100% {
    left: 970px;
  }
}

/* line 234, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .bubbles-1 {
  z-index: 0;
  position: absolute;
  left: 0px;
  opacity: 0.5;
  -webkit-animation: bubbles1 21000ms linear infinite;
  -moz-animation: bubbles1 21000ms linear infinite;
  -ms-animation: bubbles1 21000ms linear infinite;
  -o-animation: bubbles1 21000ms linear infinite;
  animation: bubbles1 21000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Bubbles1.svg");
  background-size: 960px 2360px;
  width: 960px;
  height: 2360px;
}

@-webkit-keyframes bubbles1 {
  from {
    top: 0px;
  }
  to {
    top: -2360px;
  }
}

@-moz-keyframes bubbles1 {
  from {
    top: 0px;
  }
  to {
    top: -2360px;
  }
}

@-o-keyframes bubbles1 {
  from {
    top: 0px;
  }
  to {
    top: -2360px;
  }
}

@keyframes bubbles1 {
  from {
    top: 0px;
  }
  to {
    top: -2360px;
  }
}

/* line 251, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .bubbles-2 {
  z-index: 6;
  position: absolute;
  left: 0px;
  opacity: 0.5;
  -webkit-animation: bubbles2 21000ms linear infinite;
  -moz-animation: bubbles2 21000ms linear infinite;
  -ms-animation: bubbles2 21000ms linear infinite;
  -o-animation: bubbles2 21000ms linear infinite;
  animation: bubbles2 21000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/title_Bubbles2.svg");
  background-size: 960px 1770px;
  width: 960px;
  height: 1770px;
}

@-webkit-keyframes bubbles2 {
  from {
    top: 0px;
  }
  to {
    top: -1180px;
  }
}

@-moz-keyframes bubbles2 {
  from {
    top: 0px;
  }
  to {
    top: -1180px;
  }
}

@-o-keyframes bubbles2 {
  from {
    top: 0px;
  }
  to {
    top: -1180px;
  }
}

@keyframes bubbles2 {
  from {
    top: 0px;
  }
  to {
    top: -1180px;
  }
}

/* line 268, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .ns-welcome-button {
  z-index: 6;
  position: absolute;
  left: 695px;
  top: 98px;
  width: 110px;
  height: 110px;
}

/* line 276, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome .ns-welcome-button.ready.fade-out {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  opacity: 0;
}

/* line 282, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-welcome.fade-out {
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  opacity: 0;
}

/* line 289, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main {
  display: block;
  -webkit-transition: top 500ms ease-in-out, opacity 500ms ease-in-out;
  -moz-transition: top 500ms ease-in-out, opacity 500ms ease-in-out;
  -ms-transition: top 500ms ease-in-out, opacity 500ms ease-in-out;
  -o-transition: top 500ms ease-in-out, opacity 500ms ease-in-out;
  transition: top 500ms ease-in-out, opacity 500ms ease-in-out;
}

/* line 293, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main.pan-up {
  top: 240px;
  -webkit-transition: top 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out;
  transition: top 1000ms ease-in-out;
}

/* line 298, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main.hidden {
  opacity: 0;
}

/* line 302, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .task-container {
  margin: auto;
}

/* line 306, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bundling-mat-widget {
  margin-top: 20px;
  height: 550px;
}

/* line 311, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bundling-input-widget {
  z-index: 3;
  position: absolute;
  width: 100%;
  bottom: 62px;
}

/* line 319, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 125px;
  position: relative;
  top: -2px;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 330, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button {
  z-index: 3;
  position: relative;
  left: 0px;
  top: 0px;
  -webkit-transition: left 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -moz-transition: left 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -ms-transition: left 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -o-transition: left 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: left 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* line 337, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.jiggle {
  -webkit-animation: jiggleAlien 1000ms ease-in-out;
  -moz-animation: jiggleAlien 1000ms ease-in-out;
  -ms-animation: jiggleAlien 1000ms ease-in-out;
  -o-animation: jiggleAlien 1000ms ease-in-out;
  animation: jiggleAlien 1000ms ease-in-out;
}

/* line 341, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.shake {
  -webkit-animation: shakeAlien 500ms ease-in-out;
  -moz-animation: shakeAlien 500ms ease-in-out;
  -ms-animation: shakeAlien 500ms ease-in-out;
  -o-animation: shakeAlien 500ms ease-in-out;
  animation: shakeAlien 500ms ease-in-out;
}

/* line 345, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.slide-in {
  left: 960px;
}

/* line 349, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.swim-up {
  top: -375px;
  -webkit-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -moz-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -ms-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -o-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}

/* line 354, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper {
  width: 136px;
  height: 116px;
  margin: auto;
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
}

/* line 360, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper .alien {
  -webkit-transition: background-position 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -moz-transition: background-position 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -ms-transition: background-position 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  -o-transition: background-position 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: background-position 300ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
  margin: auto;
  position: relative;
}

/* line 366, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper .button-label {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 18px;
  font-weight: bold;
  position: relative;
  top: -28px;
  left: -2px;
  padding-top: 4px;
  pointer-events: none;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/AlienBottom_Active4.svg");
  background-size: 140px 34px;
  width: 140px;
  height: 34px;
}

/* line 378, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper .hundreds-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien100_Active4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 382, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper .tens-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien10_Active5.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 386, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper .ones-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien1_Active5.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 390, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper.grayed {
  opacity: 0;
}

/* line 393, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper.grayed .hundreds-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien100_Gray4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 397, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper.grayed .tens-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien10_Gray4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 401, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper.grayed .ones-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien1_Gray4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 405, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper.grayed .button-label {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/AlienBottom_Gray4.svg");
  background-size: 140px 34px;
  width: 140px;
  height: 34px;
}

/* line 410, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .button-wrapper:not(.grayed) {
  position: relative;
  top: -116px;
  opacity: 1;
}

/* line 418, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button:not(.disabled):not(.inactive) .button-wrapper:hover {
  cursor: pointer;
}

/* line 421, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button:not(.disabled):not(.inactive) .button-wrapper:hover .hundreds-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien100_Hover4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 425, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button:not(.disabled):not(.inactive) .button-wrapper:hover .tens-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien10_Hover4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 429, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button:not(.disabled):not(.inactive) .button-wrapper:hover .ones-alien {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Alien1_Hover4.svg");
  background-size: 91px 114px;
  width: 91px;
  height: 114px;
}

/* line 433, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button:not(.disabled):not(.inactive) .button-wrapper:hover .button-label {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/AlienBottom_Hover4.svg");
  background-size: 140px 34px;
  width: 140px;
  height: 34px;
}

/* line 439, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.inactive .button-wrapper {
  cursor: auto;
}

/* line 442, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.inactive .button-wrapper .alien {
  background-position: 0px 62px;
}

/* line 446, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.inactive .button-wrapper.grayed {
  opacity: 1;
}

/* line 450, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button.inactive .button-wrapper:not(.grayed) {
  opacity: 0;
}

/* line 455, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .claw {
  position: relative;
  top: -90px;
}

/* line 459, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .claw .claw-arm, .bundling.number-sense-task-group .ns-main .buttons-area .button .claw #claw-head {
  z-index: -1;
  position: relative;
}

/* line 464, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area .button .claw #arm-path {
  stroke-dasharray: 335px;
  stroke-dashoffset: 335px;
}

/* line 471, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.no-hundreds {
  margin: 0px 180px;
}

/* line 474, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.no-hundreds .tens-button, .bundling.number-sense-task-group .ns-main .buttons-area.no-hundreds .ones-button {
  width: 50%;
}

/* line 478, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.no-hundreds .claw-arm {
  left: 114px;
  top: -99px;
}

/* line 483, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.no-hundreds #claw-head {
  left: 114px;
  top: -319px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds {
  margin: 0px 90px;
}

/* line 492, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .hundreds-button, .bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .tens-button, .bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .ones-button {
  width: 33.33%;
}

/* line 497, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .hundreds-button .claw-arm, .bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .hundreds-button #claw-head {
  width: 280px;
  height: 170px;
  left: 90px;
}

/* line 503, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .hundreds-button .claw-arm {
  top: -85px;
}

/* line 507, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .hundreds-button #claw-head {
  top: -255px;
}

/* line 513, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .tens-button .claw-arm, .bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .tens-button #claw-head {
  width: 340px;
  height: 170px;
  left: 80px;
}

/* line 519, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .tens-button .claw-arm {
  top: -95px;
}

/* line 523, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .buttons-area.with-hundreds .tens-button #claw-head {
  top: -265px;
}

/* line 532, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ground-area {
  width: 800px;
  height: 210px;
  z-index: 2;
  position: absolute;
  top: 270px;
  left: 80px;
}

/* line 543, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ground-area .leaf {
  position: absolute;
  -webkit-transition: opacity 300ms ease-in-out, background-color 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, background-color 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, background-color 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, background-color 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, background-color 300ms ease-in-out;
}

/* line 547, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ground-area .leaf.fade-in {
  opacity: 0;
}

/* line 551, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ground-area .leaf.highlight {
  background-color: #ffff73;
}

/* line 555, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ground-area .leaf.animate {
  -webkit-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out;
  -moz-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out;
  -ms-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out;
  -o-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out;
  transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out;
  -webkit-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out;
  -moz-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out;
  -ms-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out;
  -o-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out;
  transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out;
}

/* line 562, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area, .bundling.number-sense-task-group .ns-main .objects-area .tens-area, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: absolute;
  z-index: 2;
}

/* line 568, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area:not(.inactive) .leaf, .bundling.number-sense-task-group .ns-main .objects-area .tens-area:not(.inactive) .leaf, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area:not(.inactive) .leaf {
  cursor: pointer;
}

/* line 572, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf {
  position: relative;
  visibility: visible;
  top: 0px;
  -webkit-transition: opacity 34ms ease-in-out 466ms, left 500ms ease-in-out, top 500ms ease-in-out, background-color 500ms ease-in-out;
  -moz-transition: opacity 34ms ease-in-out 466ms, left 500ms ease-in-out, top 500ms ease-in-out, background-color 500ms ease-in-out;
  -ms-transition: opacity 34ms ease-in-out 466ms, left 500ms ease-in-out, top 500ms ease-in-out, background-color 500ms ease-in-out;
  -o-transition: opacity 34ms ease-in-out 466ms, left 500ms ease-in-out, top 500ms ease-in-out, background-color 500ms ease-in-out;
  transition: opacity 34ms ease-in-out 466ms, left 500ms ease-in-out, top 500ms ease-in-out, background-color 500ms ease-in-out;
}

/* line 578, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf > .leaf, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf > .leaf, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf > .leaf {
  position: absolute;
}

/* line 582, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.animate, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.animate, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.animate {
  -webkit-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -moz-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -ms-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -o-transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  transition: left 500ms ease-in-out, top 500ms ease-in-out, -webkit-transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -webkit-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -moz-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -ms-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  -o-transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
  transition: left 500ms ease-in-out, top 500ms ease-in-out, transform 500ms ease-in-out, opacity 34ms ease-in-out 466ms;
}

/* line 587, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.slow, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.slow, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.slow {
  -webkit-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, -webkit-transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -moz-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, -webkit-transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -ms-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, -webkit-transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -o-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, -webkit-transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  transition: left 1000ms ease-in-out, top 1000ms ease-in-out, -webkit-transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -webkit-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -moz-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -ms-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  -o-transition: left 1000ms ease-in-out, top 1000ms ease-in-out, transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
  transition: left 1000ms ease-in-out, top 1000ms ease-in-out, transform 1000ms ease-in-out, opacity 34ms ease-in-out 966ms;
}

/* line 592, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.hidden, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.hidden, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.hidden {
  -webkit-transition: opacity 34ms ease-in-out;
  -moz-transition: opacity 34ms ease-in-out;
  -ms-transition: opacity 34ms ease-in-out;
  -o-transition: opacity 34ms ease-in-out;
  transition: opacity 34ms ease-in-out;
  opacity: 0;
}

/* line 597, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.display, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.display, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.display {
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 601, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.highlight, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.highlight, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.highlight {
  -webkit-transition: background-color 300ms ease-in-out;
  -moz-transition: background-color 300ms ease-in-out;
  -ms-transition: background-color 300ms ease-in-out;
  -o-transition: background-color 300ms ease-in-out;
  transition: background-color 300ms ease-in-out;
  background-color: #ffff73;
}

/* line 606, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.fade-out-end, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.fade-out-end, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.fade-out-end {
  -webkit-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  top: 12px;
  opacity: 0;
}

/* line 614, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .leaf.no-animation, .bundling.number-sense-task-group .ns-main .objects-area .ones-area .bubble.no-animation, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .leaf.no-animation, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .bubble.no-animation, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .leaf.no-animation, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .bubble.no-animation {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 619, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .ghost, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .ghost, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .ghost {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 622, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .ones-area .ghost.hidden, .bundling.number-sense-task-group .ns-main .objects-area .tens-area .ghost.hidden, .bundling.number-sense-task-group .ns-main .objects-area .hundreds-area .ghost.hidden {
  opacity: 0;
}

/* line 629, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .tens-area, .bundling.number-sense-task-group .ns-main .objects-area .mat-area .hundreds-area {
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

/* line 633, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .ones-area {
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 637, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .flag {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/AutocorrectFlag.svg");
  background-size: 60px 72px;
  width: 72px;
  height: 72px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 24px;
  font-weight: bold;
  padding-top: 14px;
  position: absolute;
  z-index: 3;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 647, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .flag.hidden {
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  opacity: 0;
}

/* line 652, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .flag .flag-num {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 657, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area .mat-area .reset-area {
  z-index: 10;
  position: absolute;
  cursor: pointer;
  height: calc(100% + 20px);
  width: calc(100% + 20px);
  top: -10px;
  left: -10px;
}

/* line 671, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.one {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf1.svg");
  background-size: 20px 20px;
  width: 28px;
  height: 28px;
  border-radius: 8px;
}

/* line 675, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.one.ghost {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf1_Ghost.svg");
  background-size: 20px 20px;
  width: 28px;
  height: 28px;
}

/* line 679, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.one.ghost.hidden {
  opacity: 0;
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 686, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.ten {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10.svg");
  background-size: 40px 92px;
  width: 44px;
  height: 98px;
  border-radius: 8px;
}

/* line 690, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.ten.ghost {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10_Ghost.svg");
  background-size: 40px 92px;
  width: 44px;
  height: 98px;
}

/* line 694, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.ten.forming {
  background-image: none;
}

/* line 699, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .leaf.ten.stem {
  position: absolute;
  left: 20px;
  top: 14px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10_Stem.svg");
  background-size: 6px 81px;
  width: 6px;
  height: 81px;
}

/* line 707, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .bubble {
  z-index: 2;
}

/* line 710, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .bubble.one {
  width: 35px;
  height: 35px;
  margin-bottom: 5px;
  margin-right: 4px;
  border-radius: 50%;
  left: -3px;
  top: -3px;
}

/* line 720, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .bubble.ten {
  width: 45px;
  height: 98px;
  margin-bottom: 4px;
  margin-right: 5px;
  border-radius: 8px;
  left: 0px;
  top: 0px;
}

/* line 731, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .tens-area {
  left: 207px;
  top: 143px;
  width: 250px;
  height: 194px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .tens-area .leaf {
  margin-bottom: 4px;
  margin-right: 6px;
}

/* line 743, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .ones-area {
  left: 596px;
  top: 142px;
  width: 68px;
  height: 200px;
}

/* line 749, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.no-hundreds .ones-area .leaf {
  margin-bottom: 12px;
  margin-right: 12px;
}

/* line 759, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.one {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf1.svg");
  background-size: 12px 12px;
  width: 16px;
  height: 16px;
  border-radius: 5px;
}

/* line 763, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.one.ghost {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf1_Ghost.svg");
  background-size: 12px 12px;
  width: 16px;
  height: 16px;
}

/* line 767, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.one.ghost.hidden {
  opacity: 0;
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 774, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.ten {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10.svg");
  background-size: 24px 56px;
  width: 30px;
  height: 62px;
  border-radius: 5px;
}

/* line 778, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.ten.ghost {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10_Ghost.svg");
  background-size: 24px 56px;
  width: 30px;
  height: 62px;
}

/* line 782, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.ten.forming {
  background-image: none;
}

/* line 787, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.ten.stem {
  position: absolute;
  left: 14px;
  top: 9px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf10_Stem.svg");
  background-size: 4px 50px;
  width: 4px;
  height: 50px;
}

/* line 794, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.hundred {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf100_2.svg");
  background-size: 73px 105px;
  width: 77px;
  height: 107px;
  border-radius: 7px;
}

/* line 798, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.hundred.ghost {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf100_Ghost.svg");
  background-size: 73px 105px;
  width: 77px;
  height: 107px;
}

/* line 802, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.hundred.forming {
  background-image: none;
}

/* line 807, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.hundred.stem:not(.full) {
  position: absolute;
  left: 35px;
  top: 19px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf100_Stem.svg");
  background-size: 9px 86px;
  width: 9px;
  height: 86px;
}

/* line 814, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .leaf.hundred.stem.full {
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Leaf100_StemFull.svg");
  background-size: 73px 105px;
  width: 77px;
  height: 107px;
}

/* line 820, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .bubble {
  z-index: 2;
}

/* line 823, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .bubble.one {
  width: 20px;
  height: 20px;
  margin-bottom: 4px;
  margin-right: 4px;
  border-radius: 50%;
  top: -3px;
  left: -2px;
}

/* line 833, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .bubble.ten {
  width: 29px;
  height: 62px;
  margin-bottom: 4px;
  margin-right: 5px;
  border-radius: 5px;
  left: 1px;
  top: 0px;
}

/* line 843, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .bubble.hundred {
  width: 77px;
  height: 108px;
  border-radius: 5px;
  left: 0px;
  top: -1px;
}

/* line 852, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area {
  left: 100px;
  top: 144px;
  width: 243px;
  height: 219px;
}

/* line 858, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .leaf, .bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .bubble {
  margin-bottom: 5px;
  margin-right: 4px;
}

/* line 862, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .leaf.hundred:nth-child(4), .bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .leaf.bubble:nth-child(4), .bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .bubble.hundred:nth-child(4), .bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .hundreds-area .bubble.bubble:nth-child(4) {
  margin-left: 41px;
}

/* line 868, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .tens-area {
  left: 397px;
  top: 144px;
  width: 170px;
  height: 128px;
}

/* line 874, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .tens-area .leaf {
  margin-bottom: 4px;
  margin-right: 4px;
}

/* line 880, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .ones-area {
  left: 720px;
  top: 144px;
  width: 40px;
  height: 120px;
}

/* line 886, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .objects-area.with-hundreds .ones-area .leaf {
  margin-bottom: 8px;
  margin-right: 8px;
}

/* line 895, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area {
  position: relative;
  top: 0px;
  font-size: 30px;
  font-weight: bold;
  -webkit-transition: opacity 100ms ease-in-out, top 600ms ease-in-out;
  -moz-transition: opacity 100ms ease-in-out, top 600ms ease-in-out;
  -ms-transition: opacity 100ms ease-in-out, top 600ms ease-in-out;
  -o-transition: opacity 100ms ease-in-out, top 600ms ease-in-out;
  transition: opacity 100ms ease-in-out, top 600ms ease-in-out;
}

/* line 902, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area.hidden {
  opacity: 0;
}

/* line 906, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area.over-card {
  top: -133px;
}

/* line 910, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area.fade-out-end {
  -webkit-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  opacity: 0;
  top: 12px;
}

/* line 917, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .label span {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 920, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .label span.highlight {
  background-color: #ffff73;
  box-shadow: 0px 1px 0px 5px #ffff73;
  border-radius: 5px;
}

/* line 928, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .zearn-input {
  min-width: 66px;
  height: 58px;
  font-size: 30px;
  font-weight: bold;
  padding-top: 5px;
}

/* line 938, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .zearn-input:not(.correct):not(.correct-done):not(.try-again):not(.incorrect):not(.incorrect-done):not(.unknown) {
  background-color: white;
}

/* line 943, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 10px;
}

/* line 947, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .zearn-input.correct, .bundling.number-sense-task-group .ns-main .input-area .zearn-input.try-again, .bundling.number-sense-task-group .ns-main .input-area .zearn-input.incorrect, .bundling.number-sense-task-group .ns-main .input-area .zearn-input.highlight, .bundling.number-sense-task-group .ns-main .input-area .zearn-input.unknown {
  -webkit-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -moz-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -ms-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -o-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
}

/* line 951, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .input-area .zearn-input.highlight {
  background-color: #ffff73;
}

/* line 958, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .octopus-card {
  position: relative;
  top: 56px;
  left: 142px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/OctopusCard.svg");
  background-size: 638px 440px;
  width: 638px;
  height: 440px;
  -webkit-transition: opacity 500ms ease-in-out, top 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out, top 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out, top 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out, top 500ms ease-in-out;
  transition: opacity 500ms ease-in-out, top 500ms ease-in-out;
}

/* line 968, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .octopus-card.hidden {
  opacity: 0;
}

/* line 972, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .octopus-card.slide-down {
  top: 590px;
  -webkit-transition: opacity 300ms ease-in-out, top 1000ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, top 1000ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, top 1000ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, top 1000ms ease-in-out;
  transition: opacity 300ms ease-in-out, top 1000ms ease-in-out;
}

/* line 979, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .meter-wrapper {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  position: absolute;
  left: 10px;
  top: 20px;
  z-index: 2;
  -webkit-transition: left 300ms ease-in-out;
  -moz-transition: left 300ms ease-in-out;
  -ms-transition: left 300ms ease-in-out;
  -o-transition: left 300ms ease-in-out;
  transition: left 300ms ease-in-out;
}

/* line 988, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .meter-wrapper.slide-off {
  left: -60px;
}

/* line 993, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .meter {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 105px;
  max-height: 415px;
}

/* line 998, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .meter .apparatus {
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Apparatus.svg");
  background-size: 54px 34px;
  width: 60px;
  height: 34px;
}

/* line 1003, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .meter .tank {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  z-index: -1;
  background-color: #032640;
  position: relative;
  top: 20px;
  width: 60px;
  border-radius: 91px;
  padding: 30px 10px 25px 10px;
}

/* line 1019, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble {
  background-color: white;
  border: 0px solid white;
  width: 15px;
  height: 15px;
  border-radius: 100%;
  margin-bottom: 5px;
}

/* line 1027, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.animate {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 1031, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.delayed {
  -webkit-transition: all 0ms ease-in-out 500ms;
  -moz-transition: all 0ms ease-in-out 500ms;
  -ms-transition: all 0ms ease-in-out 500ms;
  -o-transition: all 0ms ease-in-out 500ms;
  transition: all 0ms ease-in-out 500ms;
}

/* line 1035, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.empty {
  background-color: #b3b3b3;
  opacity: 0.4;
}

/* line 1040, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.filled {
  background-color: rgba(241, 217, 255, 0.2);
  border: 1px solid #f1d9ff;
}

/* line 1044, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.filled.wrong {
  -webkit-transition: all 100ms ease-in-out;
  -moz-transition: all 100ms ease-in-out;
  -ms-transition: all 100ms ease-in-out;
  -o-transition: all 100ms ease-in-out;
  transition: all 100ms ease-in-out;
  background-color: rgba(255, 77, 118, 0.3);
  border: 2px solid #ff4d76;
}

/* line 1045, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.filled.wrong.flashing {
  -webkit-animation: flashBubbles 4000ms ease-in-out infinite;
  -moz-animation: flashBubbles 4000ms ease-in-out infinite;
  -ms-animation: flashBubbles 4000ms ease-in-out infinite;
  -o-animation: flashBubbles 4000ms ease-in-out infinite;
  animation: flashBubbles 4000ms ease-in-out infinite;
}

@-webkit-keyframes flashBubbles {
  0%, 75% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  81.25% {
    background-color: #ff4d76;
  }
  87.5% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  93.75% {
    background-color: #ff4d76;
  }
  100% {
    background-color: rgba(255, 77, 118, 0.3);
  }
}

@-moz-keyframes flashBubbles {
  0%, 75% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  81.25% {
    background-color: #ff4d76;
  }
  87.5% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  93.75% {
    background-color: #ff4d76;
  }
  100% {
    background-color: rgba(255, 77, 118, 0.3);
  }
}

@-o-keyframes flashBubbles {
  0%, 75% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  81.25% {
    background-color: #ff4d76;
  }
  87.5% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  93.75% {
    background-color: #ff4d76;
  }
  100% {
    background-color: rgba(255, 77, 118, 0.3);
  }
}

@keyframes flashBubbles {
  0%, 75% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  81.25% {
    background-color: #ff4d76;
  }
  87.5% {
    background-color: rgba(255, 77, 118, 0.3);
  }
  93.75% {
    background-color: #ff4d76;
  }
  100% {
    background-color: rgba(255, 77, 118, 0.3);
  }
}

/* line 1071, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.filled.no-animation {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 1075, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .bubble.filled.fade-out {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  opacity: 0;
}

/* line 1083, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 2;
  position: absolute;
  width: 100%;
  top: -190px;
}

/* line 1091, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area.start {
  top: 10px;
}

/* line 1095, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area.swim-up {
  top: -450px;
  -webkit-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -moz-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -ms-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  -o-transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
  transition: top 1000ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}

/* line 1100, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Jellyfish.svg");
  background-size: 55px 100px;
  width: 55px;
  height: 100px;
  margin: 0px 15px;
  position: relative;
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='0'] {
  -webkit-animation: floatJellyfish13 4s ease-in-out 130ms infinite;
  -moz-animation: floatJellyfish13 4s ease-in-out 130ms infinite;
  -ms-animation: floatJellyfish13 4s ease-in-out 130ms infinite;
  -o-animation: floatJellyfish13 4s ease-in-out 130ms infinite;
  animation: floatJellyfish13 4s ease-in-out 130ms infinite;
  top: 18px;
}

@-webkit-keyframes floatJellyfish13 {
  0% {
    top: 8px;
  }
  50% {
    top: 18px;
  }
  100% {
    top: 8px;
  }
}

@-moz-keyframes floatJellyfish13 {
  0% {
    top: 8px;
  }
  50% {
    top: 18px;
  }
  100% {
    top: 8px;
  }
}

@-o-keyframes floatJellyfish13 {
  0% {
    top: 8px;
  }
  50% {
    top: 18px;
  }
  100% {
    top: 8px;
  }
}

@keyframes floatJellyfish13 {
  0% {
    top: 8px;
  }
  50% {
    top: 18px;
  }
  100% {
    top: 8px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='1'] {
  -webkit-animation: floatJellyfish12 4s ease-in-out 120ms infinite;
  -moz-animation: floatJellyfish12 4s ease-in-out 120ms infinite;
  -ms-animation: floatJellyfish12 4s ease-in-out 120ms infinite;
  -o-animation: floatJellyfish12 4s ease-in-out 120ms infinite;
  animation: floatJellyfish12 4s ease-in-out 120ms infinite;
  top: 17px;
}

@-webkit-keyframes floatJellyfish12 {
  0% {
    top: 7px;
  }
  50% {
    top: 17px;
  }
  100% {
    top: 7px;
  }
}

@-moz-keyframes floatJellyfish12 {
  0% {
    top: 7px;
  }
  50% {
    top: 17px;
  }
  100% {
    top: 7px;
  }
}

@-o-keyframes floatJellyfish12 {
  0% {
    top: 7px;
  }
  50% {
    top: 17px;
  }
  100% {
    top: 7px;
  }
}

@keyframes floatJellyfish12 {
  0% {
    top: 7px;
  }
  50% {
    top: 17px;
  }
  100% {
    top: 7px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='2'] {
  -webkit-animation: floatJellyfish35 4s ease-in-out 350ms infinite;
  -moz-animation: floatJellyfish35 4s ease-in-out 350ms infinite;
  -ms-animation: floatJellyfish35 4s ease-in-out 350ms infinite;
  -o-animation: floatJellyfish35 4s ease-in-out 350ms infinite;
  animation: floatJellyfish35 4s ease-in-out 350ms infinite;
  top: 40px;
}

@-webkit-keyframes floatJellyfish35 {
  0% {
    top: 30px;
  }
  50% {
    top: 40px;
  }
  100% {
    top: 30px;
  }
}

@-moz-keyframes floatJellyfish35 {
  0% {
    top: 30px;
  }
  50% {
    top: 40px;
  }
  100% {
    top: 30px;
  }
}

@-o-keyframes floatJellyfish35 {
  0% {
    top: 30px;
  }
  50% {
    top: 40px;
  }
  100% {
    top: 30px;
  }
}

@keyframes floatJellyfish35 {
  0% {
    top: 30px;
  }
  50% {
    top: 40px;
  }
  100% {
    top: 30px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='3'] {
  -webkit-animation: floatJellyfish18 4s ease-in-out 180ms infinite;
  -moz-animation: floatJellyfish18 4s ease-in-out 180ms infinite;
  -ms-animation: floatJellyfish18 4s ease-in-out 180ms infinite;
  -o-animation: floatJellyfish18 4s ease-in-out 180ms infinite;
  animation: floatJellyfish18 4s ease-in-out 180ms infinite;
  top: 23px;
}

@-webkit-keyframes floatJellyfish18 {
  0% {
    top: 13px;
  }
  50% {
    top: 23px;
  }
  100% {
    top: 13px;
  }
}

@-moz-keyframes floatJellyfish18 {
  0% {
    top: 13px;
  }
  50% {
    top: 23px;
  }
  100% {
    top: 13px;
  }
}

@-o-keyframes floatJellyfish18 {
  0% {
    top: 13px;
  }
  50% {
    top: 23px;
  }
  100% {
    top: 13px;
  }
}

@keyframes floatJellyfish18 {
  0% {
    top: 13px;
  }
  50% {
    top: 23px;
  }
  100% {
    top: 13px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='4'] {
  -webkit-animation: floatJellyfish11 4s ease-in-out 110ms infinite;
  -moz-animation: floatJellyfish11 4s ease-in-out 110ms infinite;
  -ms-animation: floatJellyfish11 4s ease-in-out 110ms infinite;
  -o-animation: floatJellyfish11 4s ease-in-out 110ms infinite;
  animation: floatJellyfish11 4s ease-in-out 110ms infinite;
  top: 16px;
}

@-webkit-keyframes floatJellyfish11 {
  0% {
    top: 6px;
  }
  50% {
    top: 16px;
  }
  100% {
    top: 6px;
  }
}

@-moz-keyframes floatJellyfish11 {
  0% {
    top: 6px;
  }
  50% {
    top: 16px;
  }
  100% {
    top: 6px;
  }
}

@-o-keyframes floatJellyfish11 {
  0% {
    top: 6px;
  }
  50% {
    top: 16px;
  }
  100% {
    top: 6px;
  }
}

@keyframes floatJellyfish11 {
  0% {
    top: 6px;
  }
  50% {
    top: 16px;
  }
  100% {
    top: 6px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='5'] {
  -webkit-animation: floatJellyfish34 4s ease-in-out 340ms infinite;
  -moz-animation: floatJellyfish34 4s ease-in-out 340ms infinite;
  -ms-animation: floatJellyfish34 4s ease-in-out 340ms infinite;
  -o-animation: floatJellyfish34 4s ease-in-out 340ms infinite;
  animation: floatJellyfish34 4s ease-in-out 340ms infinite;
  top: 39px;
}

@-webkit-keyframes floatJellyfish34 {
  0% {
    top: 29px;
  }
  50% {
    top: 39px;
  }
  100% {
    top: 29px;
  }
}

@-moz-keyframes floatJellyfish34 {
  0% {
    top: 29px;
  }
  50% {
    top: 39px;
  }
  100% {
    top: 29px;
  }
}

@-o-keyframes floatJellyfish34 {
  0% {
    top: 29px;
  }
  50% {
    top: 39px;
  }
  100% {
    top: 29px;
  }
}

@keyframes floatJellyfish34 {
  0% {
    top: 29px;
  }
  50% {
    top: 39px;
  }
  100% {
    top: 29px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='6'] {
  -webkit-animation: floatJellyfish20 4s ease-in-out 200ms infinite;
  -moz-animation: floatJellyfish20 4s ease-in-out 200ms infinite;
  -ms-animation: floatJellyfish20 4s ease-in-out 200ms infinite;
  -o-animation: floatJellyfish20 4s ease-in-out 200ms infinite;
  animation: floatJellyfish20 4s ease-in-out 200ms infinite;
  top: 25px;
}

@-webkit-keyframes floatJellyfish20 {
  0% {
    top: 15px;
  }
  50% {
    top: 25px;
  }
  100% {
    top: 15px;
  }
}

@-moz-keyframes floatJellyfish20 {
  0% {
    top: 15px;
  }
  50% {
    top: 25px;
  }
  100% {
    top: 15px;
  }
}

@-o-keyframes floatJellyfish20 {
  0% {
    top: 15px;
  }
  50% {
    top: 25px;
  }
  100% {
    top: 15px;
  }
}

@keyframes floatJellyfish20 {
  0% {
    top: 15px;
  }
  50% {
    top: 25px;
  }
  100% {
    top: 15px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='7'] {
  -webkit-animation: floatJellyfish37 4s ease-in-out 370ms infinite;
  -moz-animation: floatJellyfish37 4s ease-in-out 370ms infinite;
  -ms-animation: floatJellyfish37 4s ease-in-out 370ms infinite;
  -o-animation: floatJellyfish37 4s ease-in-out 370ms infinite;
  animation: floatJellyfish37 4s ease-in-out 370ms infinite;
  top: 42px;
}

@-webkit-keyframes floatJellyfish37 {
  0% {
    top: 32px;
  }
  50% {
    top: 42px;
  }
  100% {
    top: 32px;
  }
}

@-moz-keyframes floatJellyfish37 {
  0% {
    top: 32px;
  }
  50% {
    top: 42px;
  }
  100% {
    top: 32px;
  }
}

@-o-keyframes floatJellyfish37 {
  0% {
    top: 32px;
  }
  50% {
    top: 42px;
  }
  100% {
    top: 32px;
  }
}

@keyframes floatJellyfish37 {
  0% {
    top: 32px;
  }
  50% {
    top: 42px;
  }
  100% {
    top: 32px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='8'] {
  -webkit-animation: floatJellyfish21 4s ease-in-out 210ms infinite;
  -moz-animation: floatJellyfish21 4s ease-in-out 210ms infinite;
  -ms-animation: floatJellyfish21 4s ease-in-out 210ms infinite;
  -o-animation: floatJellyfish21 4s ease-in-out 210ms infinite;
  animation: floatJellyfish21 4s ease-in-out 210ms infinite;
  top: 26px;
}

@-webkit-keyframes floatJellyfish21 {
  0% {
    top: 16px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 16px;
  }
}

@-moz-keyframes floatJellyfish21 {
  0% {
    top: 16px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 16px;
  }
}

@-o-keyframes floatJellyfish21 {
  0% {
    top: 16px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 16px;
  }
}

@keyframes floatJellyfish21 {
  0% {
    top: 16px;
  }
  50% {
    top: 26px;
  }
  100% {
    top: 16px;
  }
}

/* line 1106, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish[data-num='9'] {
  -webkit-animation: floatJellyfish29 4s ease-in-out 290ms infinite;
  -moz-animation: floatJellyfish29 4s ease-in-out 290ms infinite;
  -ms-animation: floatJellyfish29 4s ease-in-out 290ms infinite;
  -o-animation: floatJellyfish29 4s ease-in-out 290ms infinite;
  animation: floatJellyfish29 4s ease-in-out 290ms infinite;
  top: 34px;
}

@-webkit-keyframes floatJellyfish29 {
  0% {
    top: 24px;
  }
  50% {
    top: 34px;
  }
  100% {
    top: 24px;
  }
}

@-moz-keyframes floatJellyfish29 {
  0% {
    top: 24px;
  }
  50% {
    top: 34px;
  }
  100% {
    top: 24px;
  }
}

@-o-keyframes floatJellyfish29 {
  0% {
    top: 24px;
  }
  50% {
    top: 34px;
  }
  100% {
    top: 24px;
  }
}

@keyframes floatJellyfish29 {
  0% {
    top: 24px;
  }
  50% {
    top: 34px;
  }
  100% {
    top: 24px;
  }
}

/* line 1112, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish.swim-up {
  -webkit-transition: -webkit-transform 500ms ease-in-out;
  -moz-transition: -webkit-transform 500ms ease-in-out;
  -ms-transition: -webkit-transform 500ms ease-in-out;
  -o-transition: -webkit-transform 500ms ease-in-out;
  transition: -webkit-transform 500ms ease-in-out;
  -webkit-transition: transform 500ms ease-in-out;
  -moz-transition: transform 500ms ease-in-out;
  -ms-transition: transform 500ms ease-in-out;
  -o-transition: transform 500ms ease-in-out;
  transition: transform 500ms ease-in-out;
  -webkit-transform: translateY(-240px);
  -moz-transform: translateY(-240px);
  -ms-transform: translateY(-240px);
  -o-transform: translateY(-240px);
  transform: translateY(-240px);
}

/* line 1118, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish .highlight {
  z-index: -1;
  background-color: white;
  position: relative;
  top: -54px;
  left: -48px;
  width: 150px;
  height: 150px;
  border-radius: 100%;
  -webkit-transform: scale(0.0067);
  -moz-transform: scale(0.0067);
  -ms-transform: scale(0.0067);
  -o-transform: scale(0.0067);
  transform: scale(0.0067);
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 1130, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish .highlight.active {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  opacity: 0;
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
}

/* line 1137, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .jellyfish-area .jellyfish.done {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/Jellyfish_Done.svg");
  background-size: 55px 100px;
  width: 55px;
  height: 100px;
}

/* line 1143, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .hills {
  position: absolute;
  left: 0px;
  bottom: 0px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/bg_Hills2.svg");
  background-size: 960px 365px;
  width: 960px;
  height: 365px;
  -webkit-transition: all 500ms ease-in-out, bottom 1000ms ease-in-out;
  -moz-transition: all 500ms ease-in-out, bottom 1000ms ease-in-out;
  -ms-transition: all 500ms ease-in-out, bottom 1000ms ease-in-out;
  -o-transition: all 500ms ease-in-out, bottom 1000ms ease-in-out;
  transition: all 500ms ease-in-out, bottom 1000ms ease-in-out;
}

/* line 1150, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .hills.slide-down {
  bottom: -125px;
}

/* line 1155, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .ns-main .ground {
  position: absolute;
  z-index: 2;
  left: -20px;
  bottom: -20px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/bg_Ground5.svg");
  background-size: 1000px 245px;
  width: 1000px;
  height: 245px;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 1167, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .blur-layer {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  opacity: 0;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 1177, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group.remediating .blur-layer {
  z-index: 1;
  background-color: black;
  opacity: 0.3;
}

/* line 1184, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group.remediating .hills {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 1190, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group.blurred .blur-layer {
  z-index: 3;
  background-color: #f3fdff;
  opacity: 0.1;
}

/* line 1197, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group.blurred .hills, .bundling.number-sense-task-group.blurred .ground {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 1201, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group.blurred .buttons-area {
  opacity: 0.5;
  -webkit-filter: blur(7px);
  -moz-filter: blur(7px);
  -ms-filter: blur(7px);
  -o-filter: blur(7px);
  filter: blur(7px);
}

/* line 1208, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish {
  display: none;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background: none;
  -webkit-transition: opacity 1000ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out;
  -o-transition: opacity 1000ms ease-in-out;
  transition: opacity 1000ms ease-in-out;
}

/* line 1218, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish.hidden {
  opacity: 0;
}

/* line 1222, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .fluency-complete-buttons {
  z-index: 3;
  display: block;
  position: relative;
  top: 163px;
}

/* line 1228, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area {
  width: 450px;
}

/* line 1231, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  color: #ffff73;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 90px;
  font-weight: lighter;
  position: relative;
  top: -257px;
}

/* line 1242, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .alien {
  z-index: 3;
  position: absolute;
  left: 375px;
  -webkit-animation: alienBobs 2000ms ease-in-out infinite;
  -moz-animation: alienBobs 2000ms ease-in-out infinite;
  -ms-animation: alienBobs 2000ms ease-in-out infinite;
  -o-animation: alienBobs 2000ms ease-in-out infinite;
  animation: alienBobs 2000ms ease-in-out infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/end_Alien.svg");
  background-size: 215px 219px;
  width: 215px;
  height: 219px;
}

@-webkit-keyframes alienBobs {
  0% {
    top: 170px;
  }
  50% {
    top: 190px;
  }
  100% {
    top: 170px;
  }
}

@-moz-keyframes alienBobs {
  0% {
    top: 170px;
  }
  50% {
    top: 190px;
  }
  100% {
    top: 170px;
  }
}

@-o-keyframes alienBobs {
  0% {
    top: 170px;
  }
  50% {
    top: 190px;
  }
  100% {
    top: 170px;
  }
}

@keyframes alienBobs {
  0% {
    top: 170px;
  }
  50% {
    top: 190px;
  }
  100% {
    top: 170px;
  }
}

/* line 1261, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .ground {
  z-index: 2;
  position: absolute;
  bottom: -4px;
  -webkit-animation: groundSlides 12000ms linear infinite;
  -moz-animation: groundSlides 12000ms linear infinite;
  -ms-animation: groundSlides 12000ms linear infinite;
  -o-animation: groundSlides 12000ms linear infinite;
  animation: groundSlides 12000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/end_Ground2.svg");
  background-size: 3840px 590px;
  width: 3840px;
  height: 590px;
}

@-webkit-keyframes groundSlides {
  from {
    left: -2880px;
  }
  to {
    left: 0px;
  }
}

@-moz-keyframes groundSlides {
  from {
    left: -2880px;
  }
  to {
    left: 0px;
  }
}

@-o-keyframes groundSlides {
  from {
    left: -2880px;
  }
  to {
    left: 0px;
  }
}

@keyframes groundSlides {
  from {
    left: -2880px;
  }
  to {
    left: 0px;
  }
}

/* line 1277, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .hills {
  z-index: 1;
  position: absolute;
  bottom: -3px;
  -webkit-animation: hillSlides 12000ms linear infinite;
  -moz-animation: hillSlides 12000ms linear infinite;
  -ms-animation: hillSlides 12000ms linear infinite;
  -o-animation: hillSlides 12000ms linear infinite;
  animation: hillSlides 12000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/end_Hills3.svg");
  background-size: 1918px 233px;
  width: 1918px;
  height: 233px;
}

@-webkit-keyframes hillSlides {
  from {
    left: -958px;
  }
  to {
    left: 0px;
  }
}

@-moz-keyframes hillSlides {
  from {
    left: -958px;
  }
  to {
    left: 0px;
  }
}

@-o-keyframes hillSlides {
  from {
    left: -958px;
  }
  to {
    left: 0px;
  }
}

@keyframes hillSlides {
  from {
    left: -958px;
  }
  to {
    left: 0px;
  }
}

/* line 1293, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .peaks {
  z-index: 0;
  position: absolute;
  left: 0px;
  bottom: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/end_Peaks.svg");
  background-size: 960px 235px;
  width: 960px;
  height: 235px;
}

/* line 1301, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .fish {
  position: absolute;
  top: 0;
  -webkit-animation: fishSlides 14000ms linear infinite;
  -moz-animation: fishSlides 14000ms linear infinite;
  -ms-animation: fishSlides 14000ms linear infinite;
  -o-animation: fishSlides 14000ms linear infinite;
  animation: fishSlides 14000ms linear infinite;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/bundling/end_Fish.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

@-webkit-keyframes fishSlides {
  from {
    left: -960px;
  }
  to {
    left: 960px;
  }
}

@-moz-keyframes fishSlides {
  from {
    left: -960px;
  }
  to {
    left: 960px;
  }
}

@-o-keyframes fishSlides {
  from {
    left: -960px;
  }
  to {
    left: 960px;
  }
}

@keyframes fishSlides {
  from {
    left: -960px;
  }
  to {
    left: 960px;
  }
}

/* line 1316, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .bubble {
  border: 1px #ccffff solid;
  position: absolute;
}

@-webkit-keyframes bubbleFloat {
  0% {
    opacity: 0;
    border-width: 1px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    left: 600px;
    top: 350px;
  }
  20% {
    opacity: 1;
  }
  60%, 100% {
    opacity: 0;
    border-width: 3px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    left: 740px;
    top: 300px;
  }
}

@-moz-keyframes bubbleFloat {
  0% {
    opacity: 0;
    border-width: 1px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    left: 600px;
    top: 350px;
  }
  20% {
    opacity: 1;
  }
  60%, 100% {
    opacity: 0;
    border-width: 3px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    left: 740px;
    top: 300px;
  }
}

@-o-keyframes bubbleFloat {
  0% {
    opacity: 0;
    border-width: 1px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    left: 600px;
    top: 350px;
  }
  20% {
    opacity: 1;
  }
  60%, 100% {
    opacity: 0;
    border-width: 3px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    left: 740px;
    top: 300px;
  }
}

@keyframes bubbleFloat {
  0% {
    opacity: 0;
    border-width: 1px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    left: 600px;
    top: 350px;
  }
  20% {
    opacity: 1;
  }
  60%, 100% {
    opacity: 0;
    border-width: 3px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    left: 740px;
    top: 300px;
  }
}

/* line 1343, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .bubble.bubble-1 {
  -webkit-animation: bubbleFloat 5000ms linear 0ms infinite;
  -moz-animation: bubbleFloat 5000ms linear 0ms infinite;
  -ms-animation: bubbleFloat 5000ms linear 0ms infinite;
  -o-animation: bubbleFloat 5000ms linear 0ms infinite;
  animation: bubbleFloat 5000ms linear 0ms infinite;
}

/* line 1347, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .bubble.bubble-2 {
  -webkit-animation: bubbleFloat 5000ms linear 1000ms infinite;
  -moz-animation: bubbleFloat 5000ms linear 1000ms infinite;
  -ms-animation: bubbleFloat 5000ms linear 1000ms infinite;
  -o-animation: bubbleFloat 5000ms linear 1000ms infinite;
  animation: bubbleFloat 5000ms linear 1000ms infinite;
}

/* line 1351, app/assets/stylesheets/number_sense_activities/bundling.scss */
.bundling.number-sense-task-group .number-sense-finish .bubble.bubble-3 {
  -webkit-animation: bubbleFloat 5000ms linear 2000ms infinite;
  -moz-animation: bubbleFloat 5000ms linear 2000ms infinite;
  -ms-animation: bubbleFloat 5000ms linear 2000ms infinite;
  -o-animation: bubbleFloat 5000ms linear 2000ms infinite;
  animation: bubbleFloat 5000ms linear 2000ms infinite;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 20, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group {
  height: 590px;
}

/* line 23, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .task-container {
  margin: auto;
}

/* line 29, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .title {
  font-family: "cubano", "Arial Black", sans-serif;
  color: #003e4d;
  position: absolute;
  left: 310px;
  top: 90px;
}

/* line 36, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .title .title-polar-place {
  font-size: 120px;
  line-height: 100px;
}

/* line 41, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .title .title-values {
  line-height: 90px;
  font-size: 100px;
}

/* line 47, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .ns-welcome-button {
  position: absolute;
  left: 431px;
  top: 395px;
  width: 98px;
  height: 98px;
}

/* line 55, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .sky {
  position: absolute;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_Sky.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 60, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .mountains {
  position: absolute;
  top: 198px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_Mountains.svg");
  background-size: 960px 392px;
  width: 960px;
  height: 392px;
}

/* line 66, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .slope {
  position: absolute;
  top: 12px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_Slope3.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 72, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .moose {
  position: absolute;
  left: 96px;
  top: 213px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_Moose.svg");
  background-size: 170px 223px;
  width: 170px;
  height: 223px;
}

/* line 79, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .snow {
  position: absolute;
  top: 0px;
  left: 0px;
}

@-webkit-keyframes snowFalling {
  0% {
    top: -590px;
  }
  100% {
    top: 0px;
  }
}

@-moz-keyframes snowFalling {
  0% {
    top: -590px;
  }
  100% {
    top: 0px;
  }
}

@-o-keyframes snowFalling {
  0% {
    top: -590px;
  }
  100% {
    top: 0px;
  }
}

@keyframes snowFalling {
  0% {
    top: -590px;
  }
  100% {
    top: 0px;
  }
}

/* line 92, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .snow.snow-back {
  -webkit-animation: snowFalling 10000ms linear infinite;
  -moz-animation: snowFalling 10000ms linear infinite;
  -ms-animation: snowFalling 10000ms linear infinite;
  -o-animation: snowFalling 10000ms linear infinite;
  animation: snowFalling 10000ms linear infinite;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_SnowBack.svg");
  background-size: 960px 1180px;
  width: 960px;
  height: 1180px;
}

/* line 97, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .snow.snow-front {
  -webkit-animation: snowFalling 16000ms linear infinite;
  -moz-animation: snowFalling 16000ms linear infinite;
  -ms-animation: snowFalling 16000ms linear infinite;
  -o-animation: snowFalling 16000ms linear infinite;
  animation: snowFalling 16000ms linear infinite;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_SnowFront.svg");
  background-size: 960px 1180px;
  width: 960px;
  height: 1180px;
}

/* line 103, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .ice-cubes {
  position: absolute;
  left: 309px;
  top: 29px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_IceCubes3.svg");
  background-size: 651px 207px;
  width: 651px;
  height: 207px;
}

/* line 110, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .foreground {
  position: absolute;
  left: 0;
  top: 0;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_Foreground2.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 117, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome .seal-fin {
  position: absolute;
  top: 300px;
  left: 630px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/title_SealFin2.svg");
  background-size: 328px 174px;
  width: 328px;
  height: 174px;
}

/* line 124, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade {
  opacity: 0;
  -webkit-transition: opacity 1000ms ease-in-out 1000ms;
  -moz-transition: opacity 1000ms ease-in-out 1000ms;
  -ms-transition: opacity 1000ms ease-in-out 1000ms;
  -o-transition: opacity 1000ms ease-in-out 1000ms;
  transition: opacity 1000ms ease-in-out 1000ms;
}

/* line 125, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .ns-welcome-button {
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 130, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .title {
  opacity: 0;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
  -webkit-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -o-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
}

/* line 136, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .mountains {
  top: 258px;
}

/* line 140, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .slope {
  top: 112px;
}

/* line 144, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .moose {
  top: 363px;
}

/* line 148, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .ice-cubes {
  top: 99px;
}

/* line 152, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .foreground {
  top: 63px;
}

/* line 156, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .seal-fin {
  top: 363px;
}

/* line 160, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .mountains, .compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .slope, .compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .moose, .compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .ice-cubes, .compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .foreground, .compare-by-place-value.number-sense-task-group .ns-welcome.slide-and-fade .seal-fin {
  -webkit-transition: top 2000ms ease-in-out;
  -moz-transition: top 2000ms ease-in-out;
  -ms-transition: top 2000ms ease-in-out;
  -o-transition: top 2000ms ease-in-out;
  transition: top 2000ms ease-in-out;
}

/* line 172, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .background .sky {
  position: absolute;
  width: 960px;
  height: 590px;
  background-image: linear-gradient(24deg, #ffdfd9, #f3dcf8 38%, #efe9f7 51%, #e9fdf6 63%, #c5ebf8 100%, #49abff);
}

/* line 180, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main {
  display: block;
  margin-top: 10px;
  -webkit-transition: opacity 1000ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out;
  -o-transition: opacity 1000ms ease-in-out;
  transition: opacity 1000ms ease-in-out;
}

/* line 185, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main.hidden {
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  opacity: 0;
}

/* line 190, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .aurora {
  position: absolute;
  top: 0px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/bg_Aurora.svg");
  background-size: 960px 344px;
  width: 960px;
  height: 344px;
}

/* line 196, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .slope {
  position: absolute;
  left: -1921px;
  top: -1058px;
  -webkit-transition: all 2000ms ease-in-out;
  -moz-transition: all 2000ms ease-in-out;
  -ms-transition: all 2000ms ease-in-out;
  -o-transition: all 2000ms ease-in-out;
  transition: all 2000ms ease-in-out;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/bg_Slope2.svg");
  background-size: 2881px 1640px;
  width: 2881px;
  height: 1640px;
}

/* line 203, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .slope.begin {
  left: 0px;
  top: 131px;
}

/* line 209, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled {
  position: absolute;
  z-index: 1;
}

/* line 213, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.seal {
  left: 25px;
  top: 76px;
}

/* line 217, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.seal .character {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/SealSled.svg");
  background-size: 125px 125px;
  width: 125px;
  height: 125px;
}

/* line 221, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.seal.abstract {
  left: 132px;
  top: 240px;
}

/* line 225, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.seal.abstract.animate {
  -webkit-animation: moveSealToAbstract 1000ms ease-in-out;
  -moz-animation: moveSealToAbstract 1000ms ease-in-out;
  -ms-animation: moveSealToAbstract 1000ms ease-in-out;
  -o-animation: moveSealToAbstract 1000ms ease-in-out;
  animation: moveSealToAbstract 1000ms ease-in-out;
}

@-webkit-keyframes moveSealToAbstract {
  0%, 20% {
    left: 25px;
    top: 76px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 132px;
    top: 240px;
  }
}

@-moz-keyframes moveSealToAbstract {
  0%, 20% {
    left: 25px;
    top: 76px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 132px;
    top: 240px;
  }
}

@-o-keyframes moveSealToAbstract {
  0%, 20% {
    left: 25px;
    top: 76px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 132px;
    top: 240px;
  }
}

@keyframes moveSealToAbstract {
  0%, 20% {
    left: 25px;
    top: 76px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 132px;
    top: 240px;
  }
}

/* line 245, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.seal.concrete {
  -webkit-animation: moveSealToConcrete 1000ms linear forwards;
  -moz-animation: moveSealToConcrete 1000ms linear forwards;
  -ms-animation: moveSealToConcrete 1000ms linear forwards;
  -o-animation: moveSealToConcrete 1000ms linear forwards;
  animation: moveSealToConcrete 1000ms linear forwards;
}

@-webkit-keyframes moveSealToConcrete {
  0% {
    left: 132px;
    top: 240px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  40% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 25px;
    top: 76px;
  }
}

@-moz-keyframes moveSealToConcrete {
  0% {
    left: 132px;
    top: 240px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  40% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 25px;
    top: 76px;
  }
}

@-o-keyframes moveSealToConcrete {
  0% {
    left: 132px;
    top: 240px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  40% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 25px;
    top: 76px;
  }
}

@keyframes moveSealToConcrete {
  0% {
    left: 132px;
    top: 240px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  40% {
    -webkit-transform: rotate(30deg);
    -moz-transform: rotate(30deg);
    -ms-transform: rotate(30deg);
    -o-transform: rotate(30deg);
    transform: rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    left: 25px;
    top: 76px;
  }
}

/* line 265, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose {
  left: 25px;
  top: 236px;
}

/* line 269, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose .character {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/MooseSled.svg");
  background-size: 125px 125px;
  width: 125px;
  height: 125px;
}

/* line 273, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose.abstract {
  left: 678px;
  top: 240px;
  -webkit-transform: scaleX(-1);
  -moz-transform: scaleX(-1);
  -ms-transform: scaleX(-1);
  -o-transform: scaleX(-1);
  transform: scaleX(-1);
  -webkit-transform-origin: 62% center;
  -moz-transform-origin: 62% center;
  -ms-transform-origin: 62% center;
  -o-transform-origin: 62% center;
  transform-origin: 62% center;
}

/* line 279, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose.abstract .shadow {
  left: 52px;
}

/* line 283, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose.abstract.animate {
  -webkit-animation: moveMooseToAbstract 1000ms ease-in-out both;
  -moz-animation: moveMooseToAbstract 1000ms ease-in-out both;
  -ms-animation: moveMooseToAbstract 1000ms ease-in-out both;
  -o-animation: moveMooseToAbstract 1000ms ease-in-out both;
  animation: moveMooseToAbstract 1000ms ease-in-out both;
}

@-webkit-keyframes moveMooseToAbstract {
  0% {
    left: 25px;
    top: 236px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  99% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  100% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
}

@-moz-keyframes moveMooseToAbstract {
  0% {
    left: 25px;
    top: 236px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  99% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  100% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
}

@-o-keyframes moveMooseToAbstract {
  0% {
    left: 25px;
    top: 236px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  99% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  100% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
}

@keyframes moveMooseToAbstract {
  0% {
    left: 25px;
    top: 236px;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  99% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
  }
  100% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
}

/* line 302, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose.abstract.animate .shadow {
  -webkit-transition: left 0ms ease-in-out 1000ms;
  -moz-transition: left 0ms ease-in-out 1000ms;
  -ms-transition: left 0ms ease-in-out 1000ms;
  -o-transition: left 0ms ease-in-out 1000ms;
  transition: left 0ms ease-in-out 1000ms;
}

/* line 308, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.moose.concrete {
  -webkit-animation: moveMooseToConcrete 1000ms ease-in-out forwards;
  -moz-animation: moveMooseToConcrete 1000ms ease-in-out forwards;
  -ms-animation: moveMooseToConcrete 1000ms ease-in-out forwards;
  -o-animation: moveMooseToConcrete 1000ms ease-in-out forwards;
  animation: moveMooseToConcrete 1000ms ease-in-out forwards;
}

@-webkit-keyframes moveMooseToConcrete {
  0% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
  99% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
  }
  100% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    left: 25px;
    top: 236px;
  }
}

@-moz-keyframes moveMooseToConcrete {
  0% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
  99% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
  }
  100% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    left: 25px;
    top: 236px;
  }
}

@-o-keyframes moveMooseToConcrete {
  0% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
  99% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
  }
  100% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    left: 25px;
    top: 236px;
  }
}

@keyframes moveMooseToConcrete {
  0% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    left: 678px;
    top: 240px;
  }
  99% {
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
  }
  100% {
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    left: 25px;
    top: 236px;
  }
}

/* line 329, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled .snow {
  position: absolute;
  left: 40px;
  top: 80px;
  opacity: 0;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/SledSnow.svg");
  background-size: 102px 62px;
  width: 102px;
  height: 62px;
}

/* line 337, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled .shadow {
  position: absolute;
  z-index: -1;
  left: 5px;
  top: 116px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/SledShadow.svg");
  background-size: 95px 9px;
  width: 95px;
  height: 9px;
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 345, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled .shadow.hidden {
  opacity: 0;
}

/* line 350, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.off-screen {
  left: -150px;
}

@-webkit-keyframes sealOnscreen {
  from {
    left: -150px;
    top: 46px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 46px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes sealOnscreen {
  from {
    left: -150px;
    top: 46px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 46px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes sealOnscreen {
  from {
    left: -150px;
    top: 46px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 46px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes sealOnscreen {
  from {
    left: -150px;
    top: 46px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 46px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-webkit-keyframes mooseOnscreen {
  from {
    left: -150px;
    top: 206px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 206px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes mooseOnscreen {
  from {
    left: -150px;
    top: 206px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 206px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes mooseOnscreen {
  from {
    left: -150px;
    top: 206px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 206px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes mooseOnscreen {
  from {
    left: -150px;
    top: 206px;
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  to {
    left: 150px;
    top: 206px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 416, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.concrete-start.seal {
  -webkit-animation: sealOnscreen 500ms ease-out, sealrotateSled 2000ms ease-in-out 500ms, sealslideBack 500ms ease-in-out 500ms, sealfinalPos 1500ms ease-in-out 1000ms;
  -moz-animation: sealOnscreen 500ms ease-out, sealrotateSled 2000ms ease-in-out 500ms, sealslideBack 500ms ease-in-out 500ms, sealfinalPos 1500ms ease-in-out 1000ms;
  -ms-animation: sealOnscreen 500ms ease-out, sealrotateSled 2000ms ease-in-out 500ms, sealslideBack 500ms ease-in-out 500ms, sealfinalPos 1500ms ease-in-out 1000ms;
  -o-animation: sealOnscreen 500ms ease-out, sealrotateSled 2000ms ease-in-out 500ms, sealslideBack 500ms ease-in-out 500ms, sealfinalPos 1500ms ease-in-out 1000ms;
  animation: sealOnscreen 500ms ease-out, sealrotateSled 2000ms ease-in-out 500ms, sealslideBack 500ms ease-in-out 500ms, sealfinalPos 1500ms ease-in-out 1000ms;
}

@-webkit-keyframes sealslideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 110px;
    top: 56px;
  }
}

@-moz-keyframes sealslideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 110px;
    top: 56px;
  }
}

@-o-keyframes sealslideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 110px;
    top: 56px;
  }
}

@keyframes sealslideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 110px;
    top: 56px;
  }
}

@-webkit-keyframes sealfinalPos {
  from {
    left: 110px;
    top: 56px;
  }
  to {
    left: 25px;
    top: 76px;
  }
}

@-moz-keyframes sealfinalPos {
  from {
    left: 110px;
    top: 56px;
  }
  to {
    left: 25px;
    top: 76px;
  }
}

@-o-keyframes sealfinalPos {
  from {
    left: 110px;
    top: 56px;
  }
  to {
    left: 25px;
    top: 76px;
  }
}

@keyframes sealfinalPos {
  from {
    left: 110px;
    top: 56px;
  }
  to {
    left: 25px;
    top: 76px;
  }
}

@-webkit-keyframes sealrotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes sealrotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes sealrotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes sealrotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 420, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.concrete-start.moose {
  -webkit-animation: mooseOnscreen 500ms ease-out, mooserotateSled 2000ms ease-in-out 500ms, mooseslideBack 500ms ease-in-out 500ms, moosefinalPos 1500ms ease-in-out 1000ms;
  -moz-animation: mooseOnscreen 500ms ease-out, mooserotateSled 2000ms ease-in-out 500ms, mooseslideBack 500ms ease-in-out 500ms, moosefinalPos 1500ms ease-in-out 1000ms;
  -ms-animation: mooseOnscreen 500ms ease-out, mooserotateSled 2000ms ease-in-out 500ms, mooseslideBack 500ms ease-in-out 500ms, moosefinalPos 1500ms ease-in-out 1000ms;
  -o-animation: mooseOnscreen 500ms ease-out, mooserotateSled 2000ms ease-in-out 500ms, mooseslideBack 500ms ease-in-out 500ms, moosefinalPos 1500ms ease-in-out 1000ms;
  animation: mooseOnscreen 500ms ease-out, mooserotateSled 2000ms ease-in-out 500ms, mooseslideBack 500ms ease-in-out 500ms, moosefinalPos 1500ms ease-in-out 1000ms;
}

@-webkit-keyframes mooseslideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 110px;
    top: 216px;
  }
}

@-moz-keyframes mooseslideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 110px;
    top: 216px;
  }
}

@-o-keyframes mooseslideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 110px;
    top: 216px;
  }
}

@keyframes mooseslideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 110px;
    top: 216px;
  }
}

@-webkit-keyframes moosefinalPos {
  from {
    left: 110px;
    top: 216px;
  }
  to {
    left: 25px;
    top: 236px;
  }
}

@-moz-keyframes moosefinalPos {
  from {
    left: 110px;
    top: 216px;
  }
  to {
    left: 25px;
    top: 236px;
  }
}

@-o-keyframes moosefinalPos {
  from {
    left: 110px;
    top: 216px;
  }
  to {
    left: 25px;
    top: 236px;
  }
}

@keyframes moosefinalPos {
  from {
    left: 110px;
    top: 216px;
  }
  to {
    left: 25px;
    top: 236px;
  }
}

@-webkit-keyframes mooserotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes mooserotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes mooserotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes mooserotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 424, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.concrete-start .shadow {
  -webkit-animation: fadeSledShadow 2500ms linear;
  -moz-animation: fadeSledShadow 2500ms linear;
  -ms-animation: fadeSledShadow 2500ms linear;
  -o-animation: fadeSledShadow 2500ms linear;
  animation: fadeSledShadow 2500ms linear;
}

@-webkit-keyframes fadeSledShadow {
  0%, 88% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes fadeSledShadow {
  0%, 88% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes fadeSledShadow {
  0%, 88% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeSledShadow {
  0%, 88% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 435, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.abstract-start.seal {
  -webkit-animation: sealOnscreen 500ms ease-out, abstractSealRotateSled 2500ms ease-in-out 500ms, abstractSealSlideBack 1500ms ease-in-out 500ms, abstractSealFinalPos 1000ms ease-in-out 2000ms;
  -moz-animation: sealOnscreen 500ms ease-out, abstractSealRotateSled 2500ms ease-in-out 500ms, abstractSealSlideBack 1500ms ease-in-out 500ms, abstractSealFinalPos 1000ms ease-in-out 2000ms;
  -ms-animation: sealOnscreen 500ms ease-out, abstractSealRotateSled 2500ms ease-in-out 500ms, abstractSealSlideBack 1500ms ease-in-out 500ms, abstractSealFinalPos 1000ms ease-in-out 2000ms;
  -o-animation: sealOnscreen 500ms ease-out, abstractSealRotateSled 2500ms ease-in-out 500ms, abstractSealSlideBack 1500ms ease-in-out 500ms, abstractSealFinalPos 1000ms ease-in-out 2000ms;
  animation: sealOnscreen 500ms ease-out, abstractSealRotateSled 2500ms ease-in-out 500ms, abstractSealSlideBack 1500ms ease-in-out 500ms, abstractSealFinalPos 1000ms ease-in-out 2000ms;
}

@-webkit-keyframes abstractSealSlideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 132px;
    top: 170px;
  }
}

@-moz-keyframes abstractSealSlideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 132px;
    top: 170px;
  }
}

@-o-keyframes abstractSealSlideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 132px;
    top: 170px;
  }
}

@keyframes abstractSealSlideBack {
  from {
    left: 150px;
    top: 46px;
  }
  to {
    left: 132px;
    top: 170px;
  }
}

@-webkit-keyframes abstractSealFinalPos {
  from {
    left: 132px;
    top: 170px;
  }
  to {
    left: 132px;
    top: 240px;
  }
}

@-moz-keyframes abstractSealFinalPos {
  from {
    left: 132px;
    top: 170px;
  }
  to {
    left: 132px;
    top: 240px;
  }
}

@-o-keyframes abstractSealFinalPos {
  from {
    left: 132px;
    top: 170px;
  }
  to {
    left: 132px;
    top: 240px;
  }
}

@keyframes abstractSealFinalPos {
  from {
    left: 132px;
    top: 170px;
  }
  to {
    left: 132px;
    top: 240px;
  }
}

@-webkit-keyframes abstractSealRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes abstractSealRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes abstractSealRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes abstractSealRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  60% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 468, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.abstract-start.moose {
  -webkit-animation: mooseOnscreen 500ms ease-out, abstractMooseRotateSled 2000ms ease-in-out 500ms, abstractMooseSlideBack 1500ms ease-in-out 500ms, abstractMooseFinalPos 1000ms ease-in-out 2000ms;
  -moz-animation: mooseOnscreen 500ms ease-out, abstractMooseRotateSled 2000ms ease-in-out 500ms, abstractMooseSlideBack 1500ms ease-in-out 500ms, abstractMooseFinalPos 1000ms ease-in-out 2000ms;
  -ms-animation: mooseOnscreen 500ms ease-out, abstractMooseRotateSled 2000ms ease-in-out 500ms, abstractMooseSlideBack 1500ms ease-in-out 500ms, abstractMooseFinalPos 1000ms ease-in-out 2000ms;
  -o-animation: mooseOnscreen 500ms ease-out, abstractMooseRotateSled 2000ms ease-in-out 500ms, abstractMooseSlideBack 1500ms ease-in-out 500ms, abstractMooseFinalPos 1000ms ease-in-out 2000ms;
  animation: mooseOnscreen 500ms ease-out, abstractMooseRotateSled 2000ms ease-in-out 500ms, abstractMooseSlideBack 1500ms ease-in-out 500ms, abstractMooseFinalPos 1000ms ease-in-out 2000ms;
}

@-webkit-keyframes abstractMooseSlideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 28px;
    top: 245px;
  }
}

@-moz-keyframes abstractMooseSlideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 28px;
    top: 245px;
  }
}

@-o-keyframes abstractMooseSlideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 28px;
    top: 245px;
  }
}

@keyframes abstractMooseSlideBack {
  from {
    left: 150px;
    top: 206px;
  }
  to {
    left: 28px;
    top: 245px;
  }
}

@-webkit-keyframes abstractMooseFinalPos {
  from {
    left: 28px;
    top: 245px;
  }
  to {
    left: 678px;
    top: 240px;
  }
}

@-moz-keyframes abstractMooseFinalPos {
  from {
    left: 28px;
    top: 245px;
  }
  to {
    left: 678px;
    top: 240px;
  }
}

@-o-keyframes abstractMooseFinalPos {
  from {
    left: 28px;
    top: 245px;
  }
  to {
    left: 678px;
    top: 240px;
  }
}

@keyframes abstractMooseFinalPos {
  from {
    left: 28px;
    top: 245px;
  }
  to {
    left: 678px;
    top: 240px;
  }
}

@-webkit-keyframes abstractMooseRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes abstractMooseRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes abstractMooseRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes abstractMooseRotateSled {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(50deg);
    -moz-transform: rotate(50deg);
    -ms-transform: rotate(50deg);
    -o-transform: rotate(50deg);
    transform: rotate(50deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 501, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding.abstract-start .shadow {
  -webkit-animation: abstractFadeSledShadow 3000ms linear;
  -moz-animation: abstractFadeSledShadow 3000ms linear;
  -ms-animation: abstractFadeSledShadow 3000ms linear;
  -o-animation: abstractFadeSledShadow 3000ms linear;
  animation: abstractFadeSledShadow 3000ms linear;
}

@-webkit-keyframes abstractFadeSledShadow {
  0%, 93% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes abstractFadeSledShadow {
  0%, 93% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes abstractFadeSledShadow {
  0%, 93% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes abstractFadeSledShadow {
  0%, 93% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 510, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .sled.sledding .snow {
  -webkit-animation: blinkSledSnow 2500ms linear;
  -moz-animation: blinkSledSnow 2500ms linear;
  -ms-animation: blinkSledSnow 2500ms linear;
  -o-animation: blinkSledSnow 2500ms linear;
  animation: blinkSledSnow 2500ms linear;
}

@-webkit-keyframes blinkSledSnow {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 0.5;
  }
  40% {
    opacity: 1;
  }
  60% {
    opacity: 0.5;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes blinkSledSnow {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 0.5;
  }
  40% {
    opacity: 1;
  }
  60% {
    opacity: 0.5;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes blinkSledSnow {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 0.5;
  }
  40% {
    opacity: 1;
  }
  60% {
    opacity: 0.5;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes blinkSledSnow {
  0% {
    opacity: 0;
  }
  20% {
    opacity: 0.5;
  }
  40% {
    opacity: 1;
  }
  60% {
    opacity: 0.5;
  }
  80% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* line 524, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  position: absolute;
  left: 805px;
  top: 65px;
  width: 120px;
  height: 425px;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 534, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.off-screen {
  left: 960px;
  top: 150px;
}

/* line 540, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-cube {
  top: 18px;
}

/* line 543, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-cube:nth-child(even) {
  left: 31px;
  margin-top: -14px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IcePurpleLarge.svg");
  background-size: 78px 78px;
  width: 78px;
  height: 78px;
}

/* line 549, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-cube:nth-child(odd) {
  left: 33px;
  margin-top: -17px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IceBlueLarge.svg");
  background-size: 86px 78px;
  width: 86px;
  height: 78px;
}

/* line 556, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IceShadow.svg");
  background-size: 107px 17px;
  width: 107px;
  height: 17px;
}

/* line 562, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-cube {
  top: 6px;
}

/* line 565, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-cube:nth-child(even) {
  left: 41px;
  margin-top: -11px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IcePurpleSmall.svg");
  background-size: 50px 50px;
  width: 50px;
  height: 50px;
}

/* line 571, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-cube:nth-child(odd) {
  left: 43px;
  margin-top: -9px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IceBlueSmall.svg");
  background-size: 56px 50px;
  width: 56px;
  height: 50px;
}

/* line 578, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-shadow {
  position: relative;
  left: 22px;
  top: -4px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/IceShadow.svg");
  background-size: 66px 10px;
  width: 66px;
  height: 10px;
}

/* line 587, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-cube, .compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-cube {
  position: relative;
  -webkit-transition: -webkit-transform 200ms;
  -moz-transition: -moz-transform 200ms;
  -o-transition: -o-transform 200ms;
  transition: transform 200ms;
}

/* line 591, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-cube.off-screen, .compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-cube.off-screen {
  -webkit-transition: all 200ms ease-in-out;
  -moz-transition: all 200ms ease-in-out;
  -ms-transition: all 200ms ease-in-out;
  -o-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
  left: 170px;
  top: 100px;
  opacity: 0;
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  transform: rotate(10deg);
}

/* line 600, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-shadow, .compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-shadow {
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 603, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.larger .ice-shadow.hidden, .compare-by-place-value.number-sense-task-group .ns-main .ice-cubes.smaller .ice-shadow.hidden {
  opacity: 0;
}

/* line 610, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .snowball {
  position: absolute;
  top: -80px;
  left: -120px;
  z-index: 5;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/Snowball2.svg");
  background-size: 100px 100px;
  width: 100px;
  height: 100px;
}

/* line 618, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete.hidden, .compare-by-place-value.number-sense-task-group .ns-main .cpv-abstract.hidden {
  opacity: 0;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 624, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat {
  margin-top: 10px;
  position: relative;
  z-index: 1;
}

/* line 629, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract {
  visibility: hidden;
}

/* line 635, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract .label.under-choice {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(227px, 129px);
  -moz-transform: translate(227px, 129px);
  -ms-transform: translate(227px, 129px);
  -o-transform: translate(227px, 129px);
  transform: translate(227px, 129px);
  color: black;
}

/* line 641, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract .label.under-choice.on-sled {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
  -webkit-transform: translate(107px, 164px);
  -moz-transform: translate(107px, 164px);
  -ms-transform: translate(107px, 164px);
  -o-transform: translate(107px, 164px);
  transform: translate(107px, 164px);
  color: white;
}

/* line 646, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract .label.under-choice.on-sled.back-to-start {
  -webkit-animation: moveSealLabelToConcrete 1000ms linear forwards;
  -moz-animation: moveSealLabelToConcrete 1000ms linear forwards;
  -ms-animation: moveSealLabelToConcrete 1000ms linear forwards;
  -o-animation: moveSealLabelToConcrete 1000ms linear forwards;
  animation: moveSealLabelToConcrete 1000ms linear forwards;
}

@-webkit-keyframes moveSealLabelToConcrete {
  0% {
    -webkit-transform: translate(107px, 164px) rotate(0deg);
    -moz-transform: translate(107px, 164px) rotate(0deg);
    -ms-transform: translate(107px, 164px) rotate(0deg);
    -o-transform: translate(107px, 164px) rotate(0deg);
    transform: translate(107px, 164px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(32px, 86px) rotate(30deg);
    -moz-transform: translate(32px, 86px) rotate(30deg);
    -ms-transform: translate(32px, 86px) rotate(30deg);
    -o-transform: translate(32px, 86px) rotate(30deg);
    transform: translate(32px, 86px) rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@-moz-keyframes moveSealLabelToConcrete {
  0% {
    -webkit-transform: translate(107px, 164px) rotate(0deg);
    -moz-transform: translate(107px, 164px) rotate(0deg);
    -ms-transform: translate(107px, 164px) rotate(0deg);
    -o-transform: translate(107px, 164px) rotate(0deg);
    transform: translate(107px, 164px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(32px, 86px) rotate(30deg);
    -moz-transform: translate(32px, 86px) rotate(30deg);
    -ms-transform: translate(32px, 86px) rotate(30deg);
    -o-transform: translate(32px, 86px) rotate(30deg);
    transform: translate(32px, 86px) rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@-o-keyframes moveSealLabelToConcrete {
  0% {
    -webkit-transform: translate(107px, 164px) rotate(0deg);
    -moz-transform: translate(107px, 164px) rotate(0deg);
    -ms-transform: translate(107px, 164px) rotate(0deg);
    -o-transform: translate(107px, 164px) rotate(0deg);
    transform: translate(107px, 164px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(32px, 86px) rotate(30deg);
    -moz-transform: translate(32px, 86px) rotate(30deg);
    -ms-transform: translate(32px, 86px) rotate(30deg);
    -o-transform: translate(32px, 86px) rotate(30deg);
    transform: translate(32px, 86px) rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@keyframes moveSealLabelToConcrete {
  0% {
    -webkit-transform: translate(107px, 164px) rotate(0deg);
    -moz-transform: translate(107px, 164px) rotate(0deg);
    -ms-transform: translate(107px, 164px) rotate(0deg);
    -o-transform: translate(107px, 164px) rotate(0deg);
    transform: translate(107px, 164px) rotate(0deg);
  }
  40% {
    -webkit-transform: translate(32px, 86px) rotate(30deg);
    -moz-transform: translate(32px, 86px) rotate(30deg);
    -ms-transform: translate(32px, 86px) rotate(30deg);
    -o-transform: translate(32px, 86px) rotate(30deg);
    transform: translate(32px, 86px) rotate(30deg);
  }
  80%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

/* line 667, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-ten-rod-cell, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-one-unit {
  background: #a96dd2;
}

/* line 671, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-ten-rod, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-hundred-flat {
  background-color: #7029a5;
}

/* line 674, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-ten-rod .ns-hundred-flat-cell, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat:nth-child(2) .ns-hundred-flat .ns-hundred-flat-cell {
  background-color: #a96dd2;
}

/* line 680, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract:nth-child(2) .label.under-choice {
  -webkit-transform: translate(527px, -31px);
  -moz-transform: translate(527px, -31px);
  -ms-transform: translate(527px, -31px);
  -o-transform: translate(527px, -31px);
  transform: translate(527px, -31px);
}

/* line 683, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract:nth-child(2) .label.under-choice.on-sled {
  -webkit-transform: translate(653px, 4px);
  -moz-transform: translate(653px, 4px);
  -ms-transform: translate(653px, 4px);
  -o-transform: translate(653px, 4px);
  transform: translate(653px, 4px);
}

/* line 686, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat.abstract:nth-child(2) .label.under-choice.on-sled.back-to-start {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
  -webkit-transition: all 970ms ease-in-out;
  -moz-transition: all 970ms ease-in-out;
  -ms-transition: all 970ms ease-in-out;
  -o-transition: all 970ms ease-in-out;
  transition: all 970ms ease-in-out;
  -webkit-transform: translate(0px, 0px);
  -moz-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  -o-transform: translate(0px, 0px);
  transform: translate(0px, 0px);
}

/* line 696, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .label {
  font-size: 30px;
  font-weight: bold;
  color: white;
  position: absolute;
  width: 92px;
  left: 57px;
  top: 101px;
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 707, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .label.fade-in {
  opacity: 1;
}

/* line 712, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat {
  width: 620px;
  height: 150px;
  background: none;
  margin-top: 0px;
  border-radius: 10px;
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 721, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat.fade-in {
  opacity: 1;
}

/* line 725, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box {
  width: 100%;
  height: 100%;
  top: 0px;
}

/* line 730, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box.inactive {
  background-color: white;
  border-color: #cccccc;
}

/* line 735, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box.activate, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box.correct {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 740, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box:not(.with-hundreds) .f2f-concrete-tens-area {
  width: 308px;
  text-align: left;
  padding: 12px 10px;
}

/* line 746, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box:not(.with-hundreds) .f2f-concrete-ones-area {
  width: 308px;
  text-align: left;
  padding: 13px 11px;
}

/* line 753, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area {
  padding: 12px 0px 12px 10px;
  width: 427px;
  text-align: left;
}

/* line 758, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot {
  margin-left: 0px;
  margin-right: 10px;
  width: 129px;
  height: 122px;
  top: 0px;
  left: 0px;
  position: inherit;
  display: inline-block;
}

/* line 770, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area {
  padding: 12px 0px 12px 5px;
  width: 158px;
}

/* line 774, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area .f2f-concrete-ten-slot {
  margin-left: 0px;
  margin-right: 5px;
  width: 12px;
  height: 122px;
}

/* line 782, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area {
  padding: 13px 0px 13px 10px;
  width: 31px;
}

/* line 786, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area .f2f-concrete-one-slot {
  margin: 1px 1px 2px 1px;
  width: 10px;
  height: 10px;
}

/* line 791, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area .f2f-concrete-one-slot.slot-4 {
  margin-bottom: 2px;
}

/* line 800, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat.condensed .f2f-concrete-box .f2f-concrete-hundreds-area, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat.condensed .f2f-concrete-box .f2f-concrete-tens-area, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat.condensed .f2f-concrete-box .f2f-concrete-ones-area {
  -webkit-transition: margin-left 500ms ease-in-out;
  -moz-transition: margin-left 500ms ease-in-out;
  -ms-transition: margin-left 500ms ease-in-out;
  -o-transition: margin-left 500ms ease-in-out;
  transition: margin-left 500ms ease-in-out;
}

/* line 804, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-mat.condensed .f2f-concrete-box .f2f-concrete-ten-slot {
  -webkit-transition: margin-right 500ms ease-in-out;
  -moz-transition: margin-right 500ms ease-in-out;
  -ms-transition: margin-right 500ms ease-in-out;
  -o-transition: margin-right 500ms ease-in-out;
  transition: margin-right 500ms ease-in-out;
  margin-right: 1px;
}

/* line 813, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-ten-rod-cell, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-one-unit {
  background: #eb731c;
  border: none;
  width: 10px;
  height: 10px;
}

/* line 820, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-ten-rod {
  background-color: #cd1424;
  border: none;
  width: 12px;
  height: 122px;
  padding-top: 1px;
}

/* line 827, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-ten-rod .ns-ten-rod-cell {
  margin: 1px 1px 2px 1px;
}

/* line 832, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat {
  background-color: #cd1424;
  border: none;
  width: 129px;
  height: 122px;
}

/* line 838, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat .ns-hundred-flat-cell {
  background: #eb731c;
  border: 0px solid transparent;
  border-width: 2px 1px 0px 2px;
  width: 13px;
  height: 12px;
  background-clip: padding-box;
}

/* line 846, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat .ns-hundred-flat-cell:first-child {
  border-left-width: 1px;
  width: 12px;
}

/* line 852, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat .ns-hundred-flat-row:last-child .ns-hundred-flat-cell {
  border-bottom-width: 2px;
  height: 14px;
}

/* line 859, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat.pre-animate, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-ten-rod.pre-animate, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-one-unit.pre-animate {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8);
  -webkit-transition: opacity 300ms;
  -moz-transition: opacity 300ms;
  -ms-transition: opacity 300ms;
  -o-transition: opacity 300ms;
  transition: opacity 300ms;
}

/* line 863, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-hundred-flat.pre-animate.animate, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-ten-rod.pre-animate.animate, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .ns-one-unit.pre-animate.animate {
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

/* line 871, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons {
  border: none;
  margin-top: 10px;
  opacity: 0;
  -webkit-transition: -webkit-transform 300ms ease-in-out;
  -moz-transition: -moz-transform 300ms ease-in-out;
  -o-transition: -o-transform 300ms ease-in-out;
  transition: transform 300ms ease-in-out;
}

/* line 877, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons:not(.show) {
  -webkit-transform: translateY(200px);
  -moz-transform: translateY(200px);
  -ms-transform: translateY(200px);
  -o-transform: translateY(200px);
  transform: translateY(200px);
}

/* line 881, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons.fade-in {
  opacity: 1;
}

/* line 885, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-hundreds-buttons, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-tens-buttons, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-ones-buttons {
  margin: 0px 20px;
}

/* line 888, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-hundreds-buttons .plus-button, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-hundreds-buttons .minus-button, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-tens-buttons .plus-button, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-tens-buttons .minus-button, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-ones-buttons .plus-button, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-ones-buttons .minus-button {
  width: 30px;
  height: 30px;
}

/* line 894, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-hundreds-buttons {
  width: 189px;
}

/* line 898, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-tens-buttons {
  width: 92px;
}

/* line 902, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .f2f-concrete-ones-buttons {
  width: 90px;
}

/* line 906, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .ns-hundred-flat {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8);
  margin: 0px;
}

/* line 911, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .ns-ten-rod, .compare-by-place-value.number-sense-task-group .ns-main .cpv-concrete-mat .f2f-concrete-buttons .ns-one-unit {
  -webkit-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -ms-transform: scale(0.8);
  -o-transform: scale(0.8);
  transform: scale(0.8);
  margin: 0px 10px;
}

/* line 919, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget {
  margin-top: 15px;
}

/* line 922, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 926, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  z-index: 1;
  background-color: white;
  border: 2px solid #0097b6;
  padding: 1px;
  margin: 0px 15px;
  overflow: hidden;
  -webkit-transform: translateY(330px);
  -moz-transform: translateY(330px);
  -ms-transform: translateY(330px);
  -o-transform: translateY(330px);
  transform: translateY(330px);
  -webkit-transition: -webkit-transform 500ms ease-in-out;
  -moz-transition: -moz-transform 500ms ease-in-out;
  -o-transition: -o-transform 500ms ease-in-out;
  transition: transform 500ms ease-in-out;
}

/* line 939, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .label {
  position: absolute;
  text-align: center;
  width: 116px;
  margin-top: 20px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 30px;
  font-weight: bold;
}

/* line 949, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .seal, .compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .same, .compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .moose {
  position: relative;
  margin-top: -1px;
  left: 0px;
  top: 0px;
}

/* line 956, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .seal {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/button_Seal.svg");
  background-size: 116px 116px;
  width: 116px;
  height: 116px;
}

/* line 960, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .same {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/button_Same.svg");
  background-size: 116px 116px;
  width: 116px;
  height: 116px;
}

/* line 964, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice .moose {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/button_Moose.svg");
  background-size: 116px 116px;
  width: 116px;
  height: 116px;
}

/* line 968, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.show {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}

/* line 972, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice:hover:not(.disabled):not(.correct):not(.incorrect):not(.selected) {
  cursor: pointer;
  border: 3px solid #007b94;
  padding: 0px;
}

/* line 978, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.selected {
  border: 3px solid #0097b6;
  padding: 0px;
  background-color: #ccffff;
}

/* line 984, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.disabled:not(.correct):not(.incorrect) {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  border: 2px solid rgba(93, 111, 120, 0.25);
  background-color: white;
}

/* line 989, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.disabled:not(.correct):not(.incorrect) * {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  opacity: 0.25;
}

/* line 995, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.correct {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  border: 3px solid #00c372;
  padding: 0px;
  background-color: #ccffd9;
}

/* line 1001, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.correct.disabled {
  border: 3px solid #5d6f78;
  background-color: white;
}

/* line 1007, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.incorrect {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  border: 3px solid #ff4d76;
  padding: 0px;
  background-color: #ffe6ee;
}

/* line 1013, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget .cpv-multiple-choice .choice.incorrect.disabled.final {
  background-color: white;
}

/* line 1020, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract {
  margin-top: -243px;
}

/* line 1024, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract .choice .seal, .compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract .choice .same, .compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract .choice .moose {
  display: none;
}

/* line 1028, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract .choice .label {
  position: relative;
  margin-top: 38px;
}

/* line 1033, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract .choice.disabled.final .label {
  opacity: 1;
}

/* line 1038, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .ns-main .cpv-multiple-choice-widget.abstract.fade-out {
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  opacity: 0;
}

/* line 1047, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .remediation-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: white;
  opacity: 0;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 1057, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group.remediating .remediation-layer {
  opacity: 0.6;
  z-index: 1;
}

/* line 1062, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group.remediating .slope, .compare-by-place-value.number-sense-task-group.remediating .ice-cubes {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 1068, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish {
  display: none;
  position: absolute;
  left: 0px;
  top: 0px;
  border-radius: 0px;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/end_Sky.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 1077, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish.hidden {
  opacity: 0;
}

/* line 1081, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .aurora-2 {
  -webkit-animation: animateAurora2 12000ms ease-in-out infinite;
  -moz-animation: animateAurora2 12000ms ease-in-out infinite;
  -ms-animation: animateAurora2 12000ms ease-in-out infinite;
  -o-animation: animateAurora2 12000ms ease-in-out infinite;
  animation: animateAurora2 12000ms ease-in-out infinite;
  position: absolute;
  left: -110px;
  top: -100px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/end_Aurora2-2.svg");
  background-size: 1308px 542px;
  width: 1308px;
  height: 542px;
}

@-webkit-keyframes animateAurora2 {
  0%, 100% {
    opacity: 1;
  }
  17%, 83% {
    opacity: 0.75;
  }
  33%, 67% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.25;
  }
}

@-moz-keyframes animateAurora2 {
  0%, 100% {
    opacity: 1;
  }
  17%, 83% {
    opacity: 0.75;
  }
  33%, 67% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.25;
  }
}

@-o-keyframes animateAurora2 {
  0%, 100% {
    opacity: 1;
  }
  17%, 83% {
    opacity: 0.75;
  }
  33%, 67% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.25;
  }
}

@keyframes animateAurora2 {
  0%, 100% {
    opacity: 1;
  }
  17%, 83% {
    opacity: 0.75;
  }
  33%, 67% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.25;
  }
}

/* line 1105, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .aurora-1 {
  -webkit-animation: animateAurora1 12000ms ease-in-out infinite;
  -moz-animation: animateAurora1 12000ms ease-in-out infinite;
  -ms-animation: animateAurora1 12000ms ease-in-out infinite;
  -o-animation: animateAurora1 12000ms ease-in-out infinite;
  animation: animateAurora1 12000ms ease-in-out infinite;
  position: absolute;
  left: -110px;
  top: -100px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/end_Aurora1-2.svg");
  background-size: 1596px 585px;
  width: 1596px;
  height: 585px;
}

@-webkit-keyframes animateAurora1 {
  0%, 100% {
    opacity: 0.25;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  17%, 83% {
    opacity: 0.5;
  }
  33%, 67% {
    opacity: 0.75;
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@-moz-keyframes animateAurora1 {
  0%, 100% {
    opacity: 0.25;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  17%, 83% {
    opacity: 0.5;
  }
  33%, 67% {
    opacity: 0.75;
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@-o-keyframes animateAurora1 {
  0%, 100% {
    opacity: 0.25;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  17%, 83% {
    opacity: 0.5;
  }
  33%, 67% {
    opacity: 0.75;
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

@keyframes animateAurora1 {
  0%, 100% {
    opacity: 0.25;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  17%, 83% {
    opacity: 0.5;
  }
  33%, 67% {
    opacity: 0.75;
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(-2deg);
    -moz-transform: rotate(-2deg);
    -ms-transform: rotate(-2deg);
    -o-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
}

/* line 1131, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .background {
  position: absolute;
  top: 6px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/end_Background.svg");
  background-size: 960px 584px;
  width: 960px;
  height: 584px;
}

/* line 1137, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .foreground {
  position: absolute;
  top: 240px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/compare_by_place_value/end_Foreground.svg");
  background-size: 960px 352px;
  width: 960px;
  height: 352px;
}

/* line 1143, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .fluency-complete-buttons {
  z-index: 3;
  display: block;
  position: relative;
  top: 170px;
}

/* line 1149, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area {
  width: 450px;
}

/* line 1152, app/assets/stylesheets/number_sense_activities/compare_by_place_value.scss */
.compare-by-place-value.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  color: #f3fdff;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 90px;
  font-weight: lighter;
  position: relative;
  top: -219px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes moveRight {
  0% {
    right: 0px;
  }
  100% {
    right: -1143px;
  }
}

@-moz-keyframes moveRight {
  0% {
    right: 0px;
  }
  100% {
    right: -1143px;
  }
}

@-o-keyframes moveRight {
  0% {
    right: 0px;
  }
  100% {
    right: -1143px;
  }
}

@keyframes moveRight {
  0% {
    right: 0px;
  }
  100% {
    right: -1143px;
  }
}

@-webkit-keyframes smokeRelease {
  0% {
    left: -20px;
    top: -80px;
  }
  33% {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
  50% {
    top: -150px;
    left: 28px;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -ms-filter: blur(12px);
    -o-filter: blur(12px);
    filter: blur(12px);
    top: -170px;
    left: 38px;
  }
}

@-moz-keyframes smokeRelease {
  0% {
    left: -20px;
    top: -80px;
  }
  33% {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
  50% {
    top: -150px;
    left: 28px;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -ms-filter: blur(12px);
    -o-filter: blur(12px);
    filter: blur(12px);
    top: -170px;
    left: 38px;
  }
}

@-o-keyframes smokeRelease {
  0% {
    left: -20px;
    top: -80px;
  }
  33% {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
  50% {
    top: -150px;
    left: 28px;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -ms-filter: blur(12px);
    -o-filter: blur(12px);
    filter: blur(12px);
    top: -170px;
    left: 38px;
  }
}

@keyframes smokeRelease {
  0% {
    left: -20px;
    top: -80px;
  }
  33% {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -ms-filter: blur(0px);
    -o-filter: blur(0px);
    filter: blur(0px);
  }
  50% {
    top: -150px;
    left: 28px;
  }
  60% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    -webkit-filter: blur(12px);
    -moz-filter: blur(12px);
    -ms-filter: blur(12px);
    -o-filter: blur(12px);
    filter: blur(12px);
    top: -170px;
    left: 38px;
  }
}

@-webkit-keyframes tilt {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  85% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-moz-keyframes tilt {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  85% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@-o-keyframes tilt {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  85% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes tilt {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  85% {
    -webkit-transform: rotate(-10deg);
    -moz-transform: rotate(-10deg);
    -ms-transform: rotate(-10deg);
    -o-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  100% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

/* line 68, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group {
  height: 590px;
  overflow: hidden;
}

/* line 72, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-welcome {
  z-index: 4;
}

/* line 76, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene {
  background-color: #c4edf6;
  height: 922px;
  width: 100%;
  position: absolute;
  top: 0px;
  -webkit-transition: top 1500ms ease-in-out;
  -moz-transition: top 1500ms ease-in-out;
  -ms-transition: top 1500ms ease-in-out;
  -o-transition: top 1500ms ease-in-out;
  transition: top 1500ms ease-in-out;
}

/* line 84, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene.pan-down {
  top: -332px;
}

/* line 87, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene.pan-down .sky {
  top: -600px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene {
  background-color: #004080;
}

/* line 96, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky {
  position: relative;
  top: 0;
  height: 100%;
  -webkit-transition: top 1500ms ease-in-out;
  -moz-transition: top 1500ms ease-in-out;
  -ms-transition: top 1500ms ease-in-out;
  -o-transition: top 1500ms ease-in-out;
  transition: top 1500ms ease-in-out;
}

/* line 102, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .title-1, .counting.number-sense-task-group .scene .sky .title-2 {
  position: absolute;
  z-index: 2;
  opacity: 1;
  -webkit-filter: blur(0px);
  -moz-filter: blur(0px);
  -ms-filter: blur(0px);
  -o-filter: blur(0px);
  filter: blur(0px);
  -webkit-transition: all 1000ms ease-in-out 300ms;
  -moz-transition: all 1000ms ease-in-out 300ms;
  -ms-transition: all 1000ms ease-in-out 300ms;
  -o-transition: all 1000ms ease-in-out 300ms;
  transition: all 1000ms ease-in-out 300ms;
}

/* line 108, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .title-1.fade-out, .counting.number-sense-task-group .scene .sky .title-2.fade-out {
  opacity: 0;
  -webkit-filter: blur(10px);
  -moz-filter: blur(10px);
  -ms-filter: blur(10px);
  -o-filter: blur(10px);
  filter: blur(10px);
}

/* line 114, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .title-1 {
  top: 50px;
  left: 115px;
  width: 712.3px;
  height: 227.8px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/title_1.svg");
  background-size: 712.3px 227.8px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .title-1 {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/title_1_dark.svg");
  background-size: 712.3px 227.8px;
}

/* line 128, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .title-2 {
  top: 460px;
  left: 308px;
  width: 341.1px;
  height: 83.4px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/title_2.svg");
  background-size: 341.1px 83.4px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .title-2 {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/title_2_dark.svg");
  background-size: 341.1px 83.4px;
}

/* line 142, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon {
  position: absolute;
}

/* line 144, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon .front, .counting.number-sense-task-group .scene .sky .intro-balloon .shadow {
  position: absolute;
}

/* line 147, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon .front {
  z-index: 3;
}

/* line 150, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon .shadow {
  opacity: 0.25;
  z-index: 2;
}

/* line 154, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon.fly-up {
  margin-top: -500px;
  -webkit-transition: margin-top 1000ms ease-in-out;
  -moz-transition: margin-top 1000ms ease-in-out;
  -ms-transition: margin-top 1000ms ease-in-out;
  -o-transition: margin-top 1000ms ease-in-out;
  transition: margin-top 1000ms ease-in-out;
}

/* line 159, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] {
  top: 205px;
  left: 320px;
  -webkit-animation: left-float 2s ease-in-out -700ms infinite;
  -moz-animation: left-float 2s ease-in-out -700ms infinite;
  -ms-animation: left-float 2s ease-in-out -700ms infinite;
  -o-animation: left-float 2s ease-in-out -700ms infinite;
  animation: left-float 2s ease-in-out -700ms infinite;
}

@-webkit-keyframes left-float {
  0% {
    top: 200px;
  }
  50% {
    top: 210px;
  }
  100% {
    top: 200px;
  }
}

@-moz-keyframes left-float {
  0% {
    top: 200px;
  }
  50% {
    top: 210px;
  }
  100% {
    top: 200px;
  }
}

@-o-keyframes left-float {
  0% {
    top: 200px;
  }
  50% {
    top: 210px;
  }
  100% {
    top: 200px;
  }
}

@keyframes left-float {
  0% {
    top: 200px;
  }
  50% {
    top: 210px;
  }
  100% {
    top: 200px;
  }
}

/* line 165, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] .front, .counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] .shadow {
  width: 88.6px;
  height: 188px;
}

/* line 169, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/left_balloon.svg");
  background-size: 88.6px 188px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/left_balloon_dark.svg");
  background-size: 88.6px 188px;
}

/* line 176, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='left'] .shadow {
  margin-top: 5px;
  margin-left: 6px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/left_balloon_shadow.svg");
  background-size: 88.6px 188px;
}

/* line 181, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon.fly-up[data='left'] {
  -webkit-transition-delay: 700ms;
  -moz-transition-delay: 700ms;
  -ms-transition-delay: 700ms;
  -o-transition-delay: 700ms;
  transition-delay: 700ms;
}

/* line 186, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] {
  top: 225px;
  left: 555px;
  -webkit-animation: right-float 2s ease-in-out -300ms infinite;
  -moz-animation: right-float 2s ease-in-out -300ms infinite;
  -ms-animation: right-float 2s ease-in-out -300ms infinite;
  -o-animation: right-float 2s ease-in-out -300ms infinite;
  animation: right-float 2s ease-in-out -300ms infinite;
}

@-webkit-keyframes right-float {
  0% {
    top: 220px;
  }
  50% {
    top: 230px;
  }
  100% {
    top: 220px;
  }
}

@-moz-keyframes right-float {
  0% {
    top: 220px;
  }
  50% {
    top: 230px;
  }
  100% {
    top: 220px;
  }
}

@-o-keyframes right-float {
  0% {
    top: 220px;
  }
  50% {
    top: 230px;
  }
  100% {
    top: 220px;
  }
}

@keyframes right-float {
  0% {
    top: 220px;
  }
  50% {
    top: 230px;
  }
  100% {
    top: 220px;
  }
}

/* line 192, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] .front, .counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] .shadow {
  width: 81.5px;
  height: 173.4px;
}

/* line 196, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/right_balloon.svg");
  background-size: 81.5px 173.4px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/right_balloon_dark.svg");
  background-size: 81.5px 173.4px;
}

/* line 203, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='right'] .shadow {
  margin-top: 4px;
  margin-left: 5px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/right_balloon_shadow.svg");
  background-size: 81.5px 173.4px;
}

/* line 208, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon.fly-up[data='right'] {
  -webkit-transition-delay: 800ms;
  -moz-transition-delay: 800ms;
  -ms-transition-delay: 800ms;
  -o-transition-delay: 800ms;
  transition-delay: 800ms;
}

/* line 213, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] {
  top: 155px;
  left: 414px;
  -webkit-animation: center-float 2s ease-in-out -1000ms infinite;
  -moz-animation: center-float 2s ease-in-out -1000ms infinite;
  -ms-animation: center-float 2s ease-in-out -1000ms infinite;
  -o-animation: center-float 2s ease-in-out -1000ms infinite;
  animation: center-float 2s ease-in-out -1000ms infinite;
}

@-webkit-keyframes center-float {
  0% {
    top: 150px;
  }
  50% {
    top: 160px;
  }
  100% {
    top: 150px;
  }
}

@-moz-keyframes center-float {
  0% {
    top: 150px;
  }
  50% {
    top: 160px;
  }
  100% {
    top: 150px;
  }
}

@-o-keyframes center-float {
  0% {
    top: 150px;
  }
  50% {
    top: 160px;
  }
  100% {
    top: 150px;
  }
}

@keyframes center-float {
  0% {
    top: 150px;
  }
  50% {
    top: 160px;
  }
  100% {
    top: 150px;
  }
}

/* line 219, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .front, .counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .shadow {
  width: 132.8px;
  height: 282.6px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/center_balloon2.svg");
  background-size: 132.8px 282.6px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/center_balloon_dark2.svg");
  background-size: 132.8px 282.6px;
}

/* line 230, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .shadow {
  margin-top: 6px;
  margin-left: 7px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/center_balloon_shadow.svg");
  background-size: 132.8px 282.6px;
}

/* line 235, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon.fly-up[data='center'] {
  -webkit-transition-delay: 500ms;
  -moz-transition-delay: 500ms;
  -ms-transition-delay: 500ms;
  -o-transition-delay: 500ms;
  transition-delay: 500ms;
}

/* line 239, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .ns-welcome-button {
  position: absolute;
  top: 18px;
  left: 21px;
  height: 90px;
  width: 90px;
  border: 2px solid #eff8ec;
  z-index: 4;
}

/* line 248, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .intro-balloon[data='center'] .ns-welcome-button.ready.fade-out {
  -webkit-transition: all 200ms ease-in-out 100ms;
  -moz-transition: all 200ms ease-in-out 100ms;
  -ms-transition: all 200ms ease-in-out 100ms;
  -o-transition: all 200ms ease-in-out 100ms;
  transition: all 200ms ease-in-out 100ms;
  border-color: transparent;
  opacity: 0;
}

/* line 257, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon {
  width: 81px;
  height: 164px;
  position: relative;
  display: inline-block;
  margin: 20px 7px;
  opacity: 0;
  top: 1000px;
}

/* line 266, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show {
  opacity: 1;
  cursor: pointer;
  z-index: 3;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='0'] {
  top: 81px;
  -webkit-transition: top 1000ms ease-in-out 369ms;
  -moz-transition: top 1000ms ease-in-out 369ms;
  -ms-transition: top 1000ms ease-in-out 369ms;
  -o-transition: top 1000ms ease-in-out 369ms;
  transition: top 1000ms ease-in-out 369ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='0'] {
  -webkit-animation: float0 2s ease-in-out -631ms infinite;
  -moz-animation: float0 2s ease-in-out -631ms infinite;
  -ms-animation: float0 2s ease-in-out -631ms infinite;
  -o-animation: float0 2s ease-in-out -631ms infinite;
  animation: float0 2s ease-in-out -631ms infinite;
}

@-webkit-keyframes float0 {
  0% {
    top: 71px;
  }
  50% {
    top: 81px;
  }
  100% {
    top: 71px;
  }
}

@-moz-keyframes float0 {
  0% {
    top: 71px;
  }
  50% {
    top: 81px;
  }
  100% {
    top: 71px;
  }
}

@-o-keyframes float0 {
  0% {
    top: 71px;
  }
  50% {
    top: 81px;
  }
  100% {
    top: 71px;
  }
}

@keyframes float0 {
  0% {
    top: 71px;
  }
  50% {
    top: 81px;
  }
  100% {
    top: 71px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='0'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='0'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='1'] {
  top: 70px;
  -webkit-transition: top 1000ms ease-in-out 483ms;
  -moz-transition: top 1000ms ease-in-out 483ms;
  -ms-transition: top 1000ms ease-in-out 483ms;
  -o-transition: top 1000ms ease-in-out 483ms;
  transition: top 1000ms ease-in-out 483ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='1'] {
  -webkit-animation: float1 2s ease-in-out -517ms infinite;
  -moz-animation: float1 2s ease-in-out -517ms infinite;
  -ms-animation: float1 2s ease-in-out -517ms infinite;
  -o-animation: float1 2s ease-in-out -517ms infinite;
  animation: float1 2s ease-in-out -517ms infinite;
}

@-webkit-keyframes float1 {
  0% {
    top: 60px;
  }
  50% {
    top: 70px;
  }
  100% {
    top: 60px;
  }
}

@-moz-keyframes float1 {
  0% {
    top: 60px;
  }
  50% {
    top: 70px;
  }
  100% {
    top: 60px;
  }
}

@-o-keyframes float1 {
  0% {
    top: 60px;
  }
  50% {
    top: 70px;
  }
  100% {
    top: 60px;
  }
}

@keyframes float1 {
  0% {
    top: 60px;
  }
  50% {
    top: 70px;
  }
  100% {
    top: 60px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='1'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='1'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='2'] {
  top: 8px;
  -webkit-transition: top 1000ms ease-in-out 257ms;
  -moz-transition: top 1000ms ease-in-out 257ms;
  -ms-transition: top 1000ms ease-in-out 257ms;
  -o-transition: top 1000ms ease-in-out 257ms;
  transition: top 1000ms ease-in-out 257ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='2'] {
  -webkit-animation: float2 2s ease-in-out -743ms infinite;
  -moz-animation: float2 2s ease-in-out -743ms infinite;
  -ms-animation: float2 2s ease-in-out -743ms infinite;
  -o-animation: float2 2s ease-in-out -743ms infinite;
  animation: float2 2s ease-in-out -743ms infinite;
}

@-webkit-keyframes float2 {
  0% {
    top: -2px;
  }
  50% {
    top: 8px;
  }
  100% {
    top: -2px;
  }
}

@-moz-keyframes float2 {
  0% {
    top: -2px;
  }
  50% {
    top: 8px;
  }
  100% {
    top: -2px;
  }
}

@-o-keyframes float2 {
  0% {
    top: -2px;
  }
  50% {
    top: 8px;
  }
  100% {
    top: -2px;
  }
}

@keyframes float2 {
  0% {
    top: -2px;
  }
  50% {
    top: 8px;
  }
  100% {
    top: -2px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='2'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='2'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='3'] {
  top: 15px;
  -webkit-transition: top 1000ms ease-in-out 280ms;
  -moz-transition: top 1000ms ease-in-out 280ms;
  -ms-transition: top 1000ms ease-in-out 280ms;
  -o-transition: top 1000ms ease-in-out 280ms;
  transition: top 1000ms ease-in-out 280ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='3'] {
  -webkit-animation: float3 2s ease-in-out -720ms infinite;
  -moz-animation: float3 2s ease-in-out -720ms infinite;
  -ms-animation: float3 2s ease-in-out -720ms infinite;
  -o-animation: float3 2s ease-in-out -720ms infinite;
  animation: float3 2s ease-in-out -720ms infinite;
}

@-webkit-keyframes float3 {
  0% {
    top: 5px;
  }
  50% {
    top: 15px;
  }
  100% {
    top: 5px;
  }
}

@-moz-keyframes float3 {
  0% {
    top: 5px;
  }
  50% {
    top: 15px;
  }
  100% {
    top: 5px;
  }
}

@-o-keyframes float3 {
  0% {
    top: 5px;
  }
  50% {
    top: 15px;
  }
  100% {
    top: 5px;
  }
}

@keyframes float3 {
  0% {
    top: 5px;
  }
  50% {
    top: 15px;
  }
  100% {
    top: 5px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='3'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='3'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='4'] {
  top: 85px;
  -webkit-transition: top 1000ms ease-in-out 220ms;
  -moz-transition: top 1000ms ease-in-out 220ms;
  -ms-transition: top 1000ms ease-in-out 220ms;
  -o-transition: top 1000ms ease-in-out 220ms;
  transition: top 1000ms ease-in-out 220ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='4'] {
  -webkit-animation: float4 2s ease-in-out -780ms infinite;
  -moz-animation: float4 2s ease-in-out -780ms infinite;
  -ms-animation: float4 2s ease-in-out -780ms infinite;
  -o-animation: float4 2s ease-in-out -780ms infinite;
  animation: float4 2s ease-in-out -780ms infinite;
}

@-webkit-keyframes float4 {
  0% {
    top: 75px;
  }
  50% {
    top: 85px;
  }
  100% {
    top: 75px;
  }
}

@-moz-keyframes float4 {
  0% {
    top: 75px;
  }
  50% {
    top: 85px;
  }
  100% {
    top: 75px;
  }
}

@-o-keyframes float4 {
  0% {
    top: 75px;
  }
  50% {
    top: 85px;
  }
  100% {
    top: 75px;
  }
}

@keyframes float4 {
  0% {
    top: 75px;
  }
  50% {
    top: 85px;
  }
  100% {
    top: 75px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='4'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='4'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='5'] {
  top: 10px;
  -webkit-transition: top 1000ms ease-in-out 439ms;
  -moz-transition: top 1000ms ease-in-out 439ms;
  -ms-transition: top 1000ms ease-in-out 439ms;
  -o-transition: top 1000ms ease-in-out 439ms;
  transition: top 1000ms ease-in-out 439ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='5'] {
  -webkit-animation: float5 2s ease-in-out -561ms infinite;
  -moz-animation: float5 2s ease-in-out -561ms infinite;
  -ms-animation: float5 2s ease-in-out -561ms infinite;
  -o-animation: float5 2s ease-in-out -561ms infinite;
  animation: float5 2s ease-in-out -561ms infinite;
}

@-webkit-keyframes float5 {
  0% {
    top: 0px;
  }
  50% {
    top: 10px;
  }
  100% {
    top: 0px;
  }
}

@-moz-keyframes float5 {
  0% {
    top: 0px;
  }
  50% {
    top: 10px;
  }
  100% {
    top: 0px;
  }
}

@-o-keyframes float5 {
  0% {
    top: 0px;
  }
  50% {
    top: 10px;
  }
  100% {
    top: 0px;
  }
}

@keyframes float5 {
  0% {
    top: 0px;
  }
  50% {
    top: 10px;
  }
  100% {
    top: 0px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='5'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='5'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='6'] {
  top: 82px;
  -webkit-transition: top 1000ms ease-in-out 236ms;
  -moz-transition: top 1000ms ease-in-out 236ms;
  -ms-transition: top 1000ms ease-in-out 236ms;
  -o-transition: top 1000ms ease-in-out 236ms;
  transition: top 1000ms ease-in-out 236ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='6'] {
  -webkit-animation: float6 2s ease-in-out -764ms infinite;
  -moz-animation: float6 2s ease-in-out -764ms infinite;
  -ms-animation: float6 2s ease-in-out -764ms infinite;
  -o-animation: float6 2s ease-in-out -764ms infinite;
  animation: float6 2s ease-in-out -764ms infinite;
}

@-webkit-keyframes float6 {
  0% {
    top: 72px;
  }
  50% {
    top: 82px;
  }
  100% {
    top: 72px;
  }
}

@-moz-keyframes float6 {
  0% {
    top: 72px;
  }
  50% {
    top: 82px;
  }
  100% {
    top: 72px;
  }
}

@-o-keyframes float6 {
  0% {
    top: 72px;
  }
  50% {
    top: 82px;
  }
  100% {
    top: 72px;
  }
}

@keyframes float6 {
  0% {
    top: 72px;
  }
  50% {
    top: 82px;
  }
  100% {
    top: 72px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='6'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='6'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='7'] {
  top: 67px;
  -webkit-transition: top 1000ms ease-in-out 164ms;
  -moz-transition: top 1000ms ease-in-out 164ms;
  -ms-transition: top 1000ms ease-in-out 164ms;
  -o-transition: top 1000ms ease-in-out 164ms;
  transition: top 1000ms ease-in-out 164ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='7'] {
  -webkit-animation: float7 2s ease-in-out -836ms infinite;
  -moz-animation: float7 2s ease-in-out -836ms infinite;
  -ms-animation: float7 2s ease-in-out -836ms infinite;
  -o-animation: float7 2s ease-in-out -836ms infinite;
  animation: float7 2s ease-in-out -836ms infinite;
}

@-webkit-keyframes float7 {
  0% {
    top: 57px;
  }
  50% {
    top: 67px;
  }
  100% {
    top: 57px;
  }
}

@-moz-keyframes float7 {
  0% {
    top: 57px;
  }
  50% {
    top: 67px;
  }
  100% {
    top: 57px;
  }
}

@-o-keyframes float7 {
  0% {
    top: 57px;
  }
  50% {
    top: 67px;
  }
  100% {
    top: 57px;
  }
}

@keyframes float7 {
  0% {
    top: 57px;
  }
  50% {
    top: 67px;
  }
  100% {
    top: 57px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='7'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='7'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='8'] {
  top: 63px;
  -webkit-transition: top 1000ms ease-in-out 345ms;
  -moz-transition: top 1000ms ease-in-out 345ms;
  -ms-transition: top 1000ms ease-in-out 345ms;
  -o-transition: top 1000ms ease-in-out 345ms;
  transition: top 1000ms ease-in-out 345ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='8'] {
  -webkit-animation: float8 2s ease-in-out -655ms infinite;
  -moz-animation: float8 2s ease-in-out -655ms infinite;
  -ms-animation: float8 2s ease-in-out -655ms infinite;
  -o-animation: float8 2s ease-in-out -655ms infinite;
  animation: float8 2s ease-in-out -655ms infinite;
}

@-webkit-keyframes float8 {
  0% {
    top: 53px;
  }
  50% {
    top: 63px;
  }
  100% {
    top: 53px;
  }
}

@-moz-keyframes float8 {
  0% {
    top: 53px;
  }
  50% {
    top: 63px;
  }
  100% {
    top: 53px;
  }
}

@-o-keyframes float8 {
  0% {
    top: 53px;
  }
  50% {
    top: 63px;
  }
  100% {
    top: 53px;
  }
}

@keyframes float8 {
  0% {
    top: 53px;
  }
  50% {
    top: 63px;
  }
  100% {
    top: 53px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='8'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='8'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 272, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show[data-num='9'] {
  top: 73px;
  -webkit-transition: top 1000ms ease-in-out 297ms;
  -moz-transition: top 1000ms ease-in-out 297ms;
  -ms-transition: top 1000ms ease-in-out 297ms;
  -o-transition: top 1000ms ease-in-out 297ms;
  transition: top 1000ms ease-in-out 297ms;
}

/* line 278, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.floating[data-num='9'] {
  -webkit-animation: float9 2s ease-in-out -703ms infinite;
  -moz-animation: float9 2s ease-in-out -703ms infinite;
  -ms-animation: float9 2s ease-in-out -703ms infinite;
  -o-animation: float9 2s ease-in-out -703ms infinite;
  animation: float9 2s ease-in-out -703ms infinite;
}

@-webkit-keyframes float9 {
  0% {
    top: 63px;
  }
  50% {
    top: 73px;
  }
  100% {
    top: 63px;
  }
}

@-moz-keyframes float9 {
  0% {
    top: 63px;
  }
  50% {
    top: 73px;
  }
  100% {
    top: 63px;
  }
}

@-o-keyframes float9 {
  0% {
    top: 63px;
  }
  50% {
    top: 73px;
  }
  100% {
    top: 63px;
  }
}

@keyframes float9 {
  0% {
    top: 63px;
  }
  50% {
    top: 73px;
  }
  100% {
    top: 63px;
  }
}

/* line 282, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.open[data-num='9'] {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 286, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.show.fly-up[data-num='9'] {
  top: -200px;
  -webkit-transition-delay: 0ms;
  -moz-transition-delay: 0ms;
  -ms-transition-delay: 0ms;
  -o-transition-delay: 0ms;
  transition-delay: 0ms;
}

/* line 293, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon .front, .counting.number-sense-task-group .scene .sky .balloon .shadow {
  position: absolute;
}

/* line 296, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon .front {
  z-index: 3;
}

/* line 299, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon .shadow {
  opacity: 0.25;
  margin-top: 6px;
  margin-left: 7px;
  z-index: 2;
}

/* line 308, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon:not(.open) .front, .counting.number-sense-task-group .scene .sky .balloon:not(.open) .shadow {
  width: 73.4px;
  height: 156.3px;
}

/* line 312, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon:not(.open) .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_closed.svg");
  background-size: 73.4px 156.3px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .balloon:not(.open) .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_closed_dark.svg");
  background-size: 73.4px 156.3px;
}

/* line 319, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon:not(.open) .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_closed_shadow.svg");
  background-size: 73.4px 156.3px;
}

/* line 326, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.open .front, .counting.number-sense-task-group .scene .sky .balloon.open .shadow {
  width: 79.4px;
  height: 168.3px;
  left: -4px;
}

/* line 331, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.open .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_open.svg");
  background-size: 79.4px 168.3px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .sky .balloon.open .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_open_dark.svg");
  background-size: 79.4px 168.3px;
}

/* line 338, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.open .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/balloon_open_shadow.svg");
  background-size: 79.4px 168.3px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .balloon.disabled {
  cursor: default;
}

/* line 347, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .clouds {
  width: 2286px;
  height: 1177.4px;
  position: absolute;
  top: 5px;
  z-index: 1;
}

/* line 353, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .clouds .cloud-1, .counting.number-sense-task-group .scene .sky .clouds .cloud-2 {
  position: absolute;
  width: 1143px;
  height: 1177.4px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/clouds.svg");
  background-size: 1143px 1177.4px;
}

/* line 360, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .clouds .cloud-1.cloud-2, .counting.number-sense-task-group .scene .sky .clouds .cloud-2.cloud-2 {
  left: 1143px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .sky .clouds.moving {
  -webkit-animation: moveRight 50s linear infinite;
  -moz-animation: moveRight 50s linear infinite;
  -ms-animation: moveRight 50s linear infinite;
  -o-animation: moveRight 50s linear infinite;
  animation: moveRight 50s linear infinite;
}

/* line 369, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .mountains {
  position: absolute;
  bottom: 0px;
  width: 962px;
  height: 323.9px;
}

/* line 376, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .mountains .front, .counting.number-sense-task-group .scene .mountains .shadow {
  width: 962px;
  height: 323.9px;
  position: absolute;
}

/* line 381, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .mountains .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/mountains.svg");
  background-size: 962px 323.9px;
  z-index: 2;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .mountains .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/mountains_dark.svg");
  background-size: 962px 323.9px;
}

/* line 389, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .mountains .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/mountains_shadow.svg");
  background-size: 962px 323.9px;
  opacity: 0.6;
  margin-left: 5px;
  margin-top: -1px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .mountains .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/mountains_shadow_dark.svg");
  background-size: 962px 323.9px;
}

/* line 400, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .track {
  position: absolute;
  bottom: 30px;
  width: 976px;
  height: 20px;
}

/* line 407, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .track .front, .counting.number-sense-task-group .scene .track .shadow {
  width: 976px;
  height: 20px;
  left: -4px;
  position: absolute;
}

/* line 413, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .track .front {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/tracks.svg");
  background-size: 976px 20px;
  z-index: 4;
}

/* line 417, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .track .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/tracks_shadow.svg");
  background-size: 976px 20px;
  opacity: 1;
  margin-top: 1px;
  margin-left: 1px;
  z-index: 3;
}

/* line 425, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .ground {
  background-color: #c69c6d;
  width: 960px;
  height: 31px;
  bottom: 0px;
  position: absolute;
  z-index: 3;
}

/* line 434, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .fluency-complete-buttons {
  top: 302px;
  left: 950px;
  position: absolute;
  z-index: 3;
  -webkit-transition: left 500ms ease-in-out 100ms;
  -moz-transition: left 500ms ease-in-out 100ms;
  -ms-transition: left 500ms ease-in-out 100ms;
  -o-transition: left 500ms ease-in-out 100ms;
  transition: left 500ms ease-in-out 100ms;
  -webkit-transform-origin: 0% 100%;
  -moz-transform-origin: 0% 100%;
  -ms-transform-origin: 0% 100%;
  -o-transform-origin: 0% 100%;
  transform-origin: 0% 100%;
}

/* line 441, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene .fluency-complete-buttons.enter {
  left: 260px;
  -webkit-animation: tilt 800ms linear;
  -moz-animation: tilt 800ms linear;
  -ms-animation: tilt 800ms linear;
  -o-animation: tilt 800ms linear;
  animation: tilt 800ms linear;
}

/* line 37, app/assets/stylesheets/number_sense_activities/counting.scss */
.dark.counting.number-sense-task-group .scene .fluency-complete-buttons {
  color: #ffe919;
}

/* line 451, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 {
  position: absolute;
  top: 0px;
  left: 0px;
  font-weight: bold;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='black_bear'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/black_bear.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='brown_bear'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/brown_bear.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='dog'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/dog.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='fox'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/fox.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='frog'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/frog.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='koala'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/koala.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='lion'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/lion.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='monkey'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/monkey.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='pig'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/pig.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='rabbit'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/rabbit.svg");
  background-size: 38.6px 44px;
}

/* line 464, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object[data-img='tiger'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/tiger.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='apple'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='broccoli'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='carrot'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='orange'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='pear'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='radish'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish.svg");
  background-size: 38.6px 44px;
}

/* line 472, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object[data-img='strawberry'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry.svg");
  background-size: 38.6px 44px;
}

/* line 478, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables {
  top: 0px;
  left: -10px;
  position: relative;
}

/* line 483, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container, .counting.number-sense-task-group .task-container.grid-12 .countables .basket {
  display: inline-block;
  position: relative;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-1 {
  width: 38.6px;
  height: 44px;
  top: -13.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-2 {
  width: 107.2px;
  height: 44px;
  top: -13.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-3 {
  width: 175.8px;
  height: 44px;
  top: -13.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-4 {
  width: 244.4px;
  height: 44px;
  top: -13.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-5 {
  width: 175.8px;
  height: 132px;
  top: 30.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-6 {
  width: 304.4px;
  height: 118px;
  top: 23.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-7 {
  width: 304.4px;
  height: 118px;
  top: 23.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-8 {
  width: 304.4px;
  height: 118px;
  top: 23.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-9 {
  width: 304.4px;
  height: 118px;
  top: 23.5px;
}

/* line 489, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container.object-container-10 {
  width: 304.4px;
  height: 118px;
  top: 23.5px;
}

/* line 508, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .object-container .object {
  position: absolute;
  z-index: 2;
}

/* line 513, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .basket {
  margin-right: 30px;
  z-index: 2;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
}

/* line 517, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables .basket.drop {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 400ms ease-in-out, top 500ms ease-in-out, left 500ms ease-in-out;
  -moz-transition: -moz-transform 400ms ease-in-out, top 500ms ease-in-out, left 500ms ease-in-out;
  -o-transition: -o-transform 400ms ease-in-out, top 500ms ease-in-out, left 500ms ease-in-out;
  transition: transform 400ms ease-in-out, top 500ms ease-in-out, left 500ms ease-in-out;
}

/* line 522, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread {
  top: 450px;
  -webkit-transition: top 800ms ease-in-out;
  -moz-transition: top 800ms ease-in-out;
  -ms-transition: top 800ms ease-in-out;
  -o-transition: top 800ms ease-in-out;
  transition: top 800ms ease-in-out;
}

/* line 526, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object, .counting.number-sense-task-group .task-container.grid-12 .countables.spread .basket {
  -webkit-transition: top 800ms ease-in-out, left 800ms ease-in-out;
  -moz-transition: top 800ms ease-in-out, left 800ms ease-in-out;
  -ms-transition: top 800ms ease-in-out, left 800ms ease-in-out;
  -o-transition: top 800ms ease-in-out, left 800ms ease-in-out;
  transition: top 800ms ease-in-out, left 800ms ease-in-out;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='1'] {
  top: 28px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='2'] {
  top: 7px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='3'] {
  top: 38px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='4'] {
  top: -39px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='5'] {
  top: -3px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='6'] {
  top: 17px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='7'] {
  top: -18px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='8'] {
  top: 3px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='9'] {
  top: -21px;
}

/* line 530, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.spread .object[data-num='10'] {
  top: -15px;
}

/* line 535, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation {
  top: 150px;
  -webkit-transition: top 1500ms ease-in-out;
  -moz-transition: top 1500ms ease-in-out;
  -ms-transition: top 1500ms ease-in-out;
  -o-transition: top 1500ms ease-in-out;
  transition: top 1500ms ease-in-out;
}

/* line 539, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object, .counting.number-sense-task-group .task-container.grid-12 .countables.formation .basket {
  -webkit-transition: top 1500ms ease-in-out, left 1500ms ease-in-out;
  -moz-transition: top 1500ms ease-in-out, left 1500ms ease-in-out;
  -ms-transition: top 1500ms ease-in-out, left 1500ms ease-in-out;
  -o-transition: top 1500ms ease-in-out, left 1500ms ease-in-out;
  transition: top 1500ms ease-in-out, left 1500ms ease-in-out;
}

/* line 544, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='1'] {
  top: 0px;
}

/* line 547, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='1'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='6'] {
  left: 0px;
}

/* line 544, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='2'] {
  top: 0px;
}

/* line 547, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='2'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='7'] {
  left: 68.6px;
}

/* line 544, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='3'] {
  top: 0px;
}

/* line 547, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='3'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='8'] {
  left: 137.2px;
}

/* line 544, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='4'] {
  top: 0px;
}

/* line 547, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='4'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='9'] {
  left: 205.8px;
}

/* line 544, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='5'] {
  top: 0px;
}

/* line 547, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='5'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='10'] {
  left: 274.4px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='6'] {
  top: 74px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='7'] {
  top: 74px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='8'] {
  top: 74px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='9'] {
  top: 74px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object[data-num='10'] {
  top: 74px;
}

/* line 558, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='1'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='2'] {
  top: 0px;
}

/* line 561, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='4'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='5'] {
  top: 88px;
}

/* line 564, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='1'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='4'] {
  left: 0px;
}

/* line 567, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='2'], .counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='5'] {
  left: 137.2px;
}

/* line 570, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .countables.formation .object-container-5 .object[data-num='3'] {
  top: 44px;
  left: 68.6px;
}

/* line 578, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train {
  bottom: 59px;
  position: absolute;
  height: 87px;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -o-inline-flex;
  display: inline-flex;
  left: 1000px;
  -webkit-transition: left 1000ms ease-in-out, bottom 1000ms ease-in-out;
  -moz-transition: left 1000ms ease-in-out, bottom 1000ms ease-in-out;
  -ms-transition: left 1000ms ease-in-out, bottom 1000ms ease-in-out;
  -o-transition: left 1000ms ease-in-out, bottom 1000ms ease-in-out;
  transition: left 1000ms ease-in-out, bottom 1000ms ease-in-out;
  font-size: 40px;
  z-index: 5;
}

/* line 587, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train.enter {
  left: 0px;
}

/* line 590, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train.exit {
  left: -1200px;
}

/* line 594, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train.choo-choo .smoke {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 500ms linear;
  -moz-transition: -moz-transform 500ms linear;
  -o-transition: -o-transform 500ms linear;
  transition: transform 500ms linear;
  -webkit-animation: smokeRelease 1000ms linear;
  -moz-animation: smokeRelease 1000ms linear;
  -ms-animation: smokeRelease 1000ms linear;
  -o-animation: smokeRelease 1000ms linear;
  animation: smokeRelease 1000ms linear;
}

/* line 600, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .smoke {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/smoke.svg");
  background-size: 112.7px 144.6px;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  top: -150px;
  left: 28px;
  width: 112.7px;
  height: 144.6px;
  opacity: 0;
  position: absolute;
}

/* line 616, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front, .counting.number-sense-task-group .task-container.grid-12 .train .engine .shadow {
  background-repeat: no-repeat;
  background-color: transparent;
  position: relative;
  top: -4px;
  height: 106.1px;
}

/* line 623, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front {
  width: 156.1px;
  z-index: 3;
}

/* line 625, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front .train-engine {
  position: absolute;
  top: 0;
  left: 0;
}

/* line 631, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front .number {
  position: absolute;
  top: 35px;
  right: 22px;
  width: 30px;
}

/* line 638, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front .st6 {
  fill: #00b7ff;
}

/* line 643, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st3, .counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st4, .counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st5, .counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st6 {
  -webkit-transition: fill 500ms ease-in-out;
  -moz-transition: fill 500ms ease-in-out;
  -ms-transition: fill 500ms ease-in-out;
  -o-transition: fill 500ms ease-in-out;
  transition: fill 500ms ease-in-out;
}

/* line 646, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st3, .counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st5, .counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st6 {
  fill: #666666;
}

/* line 649, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .front.remediating .st4 {
  fill: #333333;
}

/* line 654, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .engine .shadow {
  width: 143.7px;
  left: 12.4px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/engine_shadow.svg");
  background-size: 143.7px 106.1px;
  margin-left: 4px;
  margin-right: 12.4px;
  opacity: 0.8;
  top: -109px;
}

/* line 665, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car {
  top: 26px;
  position: relative;
}

/* line 666, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car[data-num="1"] {
  margin-left: 3px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car:not([data-num="1"]) {
  margin-left: 7px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .body {
  background-color: #00b7ff;
  width: 70px;
  height: 60px;
  border-radius: 0px 0px 10px 10px;
  -webkit-box-shadow: 4px 2px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 4px 2px rgba(0, 0, 0, 0.7);
  -ms-box-shadow: 4px 2px rgba(0, 0, 0, 0.7);
  -o-box-shadow: 4px 2px rgba(0, 0, 0, 0.7);
  box-shadow: 4px 2px rgba(0, 0, 0, 0.7);
}

/* line 680, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .body .number {
  position: relative;
  top: 5px;
  -webkit-transition: color 1000ms ease-out;
  -moz-transition: color 1000ms ease-out;
  -ms-transition: color 1000ms ease-out;
  -o-transition: color 1000ms ease-out;
  transition: color 1000ms ease-out;
}

/* line 686, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .base {
  width: 50px;
  height: 5px;
  background-color: #323232;
  left: 10px;
  position: relative;
  border-radius: 0px 0px 2px 2px;
  -webkit-box-shadow: 3px 1px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 3px 1px rgba(0, 0, 0, 0.7);
  -ms-box-shadow: 3px 1px rgba(0, 0, 0, 0.7);
  -o-box-shadow: 3px 1px rgba(0, 0, 0, 0.7);
  box-shadow: 3px 1px rgba(0, 0, 0, 0.7);
}

/* line 695, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .wheel {
  width: 12px;
  height: 12px;
  background-color: #b3b3b3;
  border-radius: 6px;
  position: relative;
  border: 1px solid #808080;
  -webkit-box-shadow: 2px 0px rgba(0, 0, 0, 0.7);
  -moz-box-shadow: 2px 0px rgba(0, 0, 0, 0.7);
  -ms-box-shadow: 2px 0px rgba(0, 0, 0, 0.7);
  -o-box-shadow: 2px 0px rgba(0, 0, 0, 0.7);
  box-shadow: 2px 0px rgba(0, 0, 0, 0.7);
}

/* line 703, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .wheel[data-num='0'] {
  top: -2px;
  left: 15px;
}

/* line 707, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .wheel[data-num='1'] {
  top: -14px;
  left: 43px;
}

/* line 711, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .wheel .axel {
  background-color: #808080;
  width: 4px;
  height: 4px;
  border-radius: 2px;
  position: relative;
  top: 3px;
  left: 3px;
}

/* line 722, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car:not(.disabled) .body:hover {
  cursor: pointer;
  background-color: #76d6ff;
}

/* line 728, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.correct .body, .counting.number-sense-task-group .task-container.grid-12 .train .car.incorrect .body, .counting.number-sense-task-group .task-container.grid-12 .train .car.faded .body {
  -webkit-transition: background-color 250ms ease-in-out;
  -moz-transition: background-color 250ms ease-in-out;
  -ms-transition: background-color 250ms ease-in-out;
  -o-transition: background-color 250ms ease-in-out;
  transition: background-color 250ms ease-in-out;
}

/* line 732, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.correct .body {
  background-color: #50cb13;
}

/* line 735, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.incorrect .body {
  background-color: #ff005b;
}

/* line 738, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.faded .body {
  background-color: #ff9ab1;
}

/* line 742, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.remediating.correct .body {
  -webkit-transition: background-color 500ms ease-in-out 500ms;
  -moz-transition: background-color 500ms ease-in-out 500ms;
  -ms-transition: background-color 500ms ease-in-out 500ms;
  -o-transition: background-color 500ms ease-in-out 500ms;
  transition: background-color 500ms ease-in-out 500ms;
}

/* line 745, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.remediating:not(.correct) .body {
  background-color: #666666;
  -webkit-transition: background-color 500ms ease-in-out;
  -moz-transition: background-color 500ms ease-in-out;
  -ms-transition: background-color 500ms ease-in-out;
  -o-transition: background-color 500ms ease-in-out;
  transition: background-color 500ms ease-in-out;
}

/* line 750, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car.highlight-num .body .number {
  -webkit-transition: color 500ms ease-in 500ms;
  -moz-transition: color 500ms ease-in 500ms;
  -ms-transition: color 500ms ease-in 500ms;
  -o-transition: color 500ms ease-in 500ms;
  transition: color 500ms ease-in 500ms;
  color: #f6f6f6;
}

/* line 754, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .object-slot {
  width: 70px;
  height: 44px;
  position: absolute;
}

/* line 758, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .object-slot .object {
  position: relative;
  margin: auto;
  top: 0px;
  left: 0px;
}

/* line 763, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .train .car .object-slot .object.moving {
  z-index: 3;
  -webkit-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
}

/* line 771, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .object {
  width: 38.6px;
  height: 44px;
  position: absolute;
  opacity: 1;
  z-index: 1;
}

/* line 778, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .object.hidden {
  opacity: 0;
}

/* line 782, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .basket {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/basket.svg");
  background-size: 80.6px 71px;
  width: 80.6px;
  height: 71px;
  z-index: 1;
  opacity: 1;
  top: 0px;
  left: 0px;
}

/* line 791, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .basket .card {
  background-color: white;
  width: 45px;
  height: 37px;
  top: 22px;
  left: 20px;
  position: absolute;
  border-radius: 2px;
  font-size: 30px;
}

/* line 801, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .basket.hidden {
  opacity: 0;
}

/* line 805, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .basket-object {
  position: absolute;
}

/* line 807, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12 .basket-object.moving {
  z-index: 1;
  -webkit-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -moz-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -ms-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -o-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  transition: top 500ms ease-in-out, left 500ms ease-in-out;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='1'] {
  top: -46px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='2'] {
  top: -92px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='3'] {
  top: -138px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='4'] {
  top: -184px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='5'] {
  top: -230px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='6'] {
  top: -276px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='7'] {
  top: -322px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='8'] {
  top: -368px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='9'] {
  top: -414px;
}

/* line 816, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-all .object-slot[data-num='10'] {
  top: -460px;
}

/* line 823, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .basket-slot {
  width: 80.6px;
  height: 71px;
  position: absolute;
  top: -73px;
  left: -8px;
}

/* line 830, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .basket-slot .basket {
  margin: auto;
  position: relative;
}

/* line 833, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .basket-slot .basket.moving {
  z-index: 3;
  -webkit-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='1'] {
  top: -119px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='2'] {
  top: -165px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='3'] {
  top: -211px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='4'] {
  top: -257px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='5'] {
  top: -303px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='6'] {
  top: -349px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='7'] {
  top: -395px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='8'] {
  top: -441px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='9'] {
  top: -487px;
}

/* line 841, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .task-container.grid-12.count-on .object-slot[data-num='10'] {
  top: -533px;
}

/* line 851, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .scene:not(.pan-down) ~ .task-container .train.exit {
  bottom: -110px;
}

/* line 858, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-button .ns-video-button-image {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/teacher_images/counting_train.jpg");
}

/* line 862, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-button:not(.expanded) .ns-video-button-image {
  background-position: -60px -2px;
}

/* line 866, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-button.expanded {
  bottom: 63px;
}

/* line 869, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-button.expanded .ns-video-button-image {
  bottom: 71px;
  background-position: -168px 0px;
}

/* line 874, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-button.expanded.rectify .ns-video-button-image {
  background-position: -60px 0px;
}

/* line 879, app/assets/stylesheets/number_sense_activities/counting.scss */
.counting.number-sense-task-group .ns-video .ns-video-player {
  bottom: 63px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 34, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group {
  background: #fff4ce;
  height: 590px;
}

/* line 39, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene {
  background-color: #ccffff;
  top: -899px;
  width: 100%;
  height: 100%;
  position: relative;
  -webkit-transition: top 1300ms ease-in-out;
  -moz-transition: top 1300ms ease-in-out;
  -ms-transition: top 1300ms ease-in-out;
  -o-transition: top 1300ms ease-in-out;
  transition: top 1300ms ease-in-out;
}

/* line 47, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene .ground {
  position: absolute;
  bottom: 0px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Ground.svg");
  background-size: 960px 60px;
  width: 960px;
  height: 60px;
}

/* line 53, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene .bushes {
  position: absolute;
  bottom: 0px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Bushes.svg");
  background-size: 960px 157px;
  width: 960px;
  height: 157px;
}

/* line 59, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene.welcome {
  top: 0px;
}

/* line 63, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene.finish {
  -webkit-transition: top 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out;
  transition: top 1000ms ease-in-out;
  top: -309px;
}

/* line 69, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome {
  position: absolute;
  top: 0px;
}

/* line 73, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title {
  position: relative;
  font-family: "cubano", "Arial Black", sans-serif;
  color: #052f3c;
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
}

/* line 79, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title.fade-out {
  opacity: 0;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 84, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title .sum {
  font-size: 225px;
  line-height: 243px;
}

/* line 89, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title .snacks {
  font-size: 121.4px;
  line-height: 145px;
  top: -60px;
  position: relative;
}

/* line 96, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title .bite {
  width: 100px;
  height: 100px;
  position: absolute;
  top: 10px;
  left: 635px;
  background: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Bite2.svg") no-repeat;
}

/* line 106, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .ns-welcome-button {
  position: absolute;
  left: 710px;
  top: 140px;
  width: 110px;
  height: 110px;
}

/* line 112, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .ns-welcome-button.ready.fade-out {
  -webkit-transition: all 300ms ease-in-out 300ms;
  -moz-transition: all 300ms ease-in-out 300ms;
  -ms-transition: all 300ms ease-in-out 300ms;
  -o-transition: all 300ms ease-in-out 300ms;
  transition: all 300ms ease-in-out 300ms;
  opacity: 0;
}

/* line 118, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .welcome-animals {
  position: absolute;
  width: 738px;
  height: 293px;
  left: 111px;
  bottom: 10px;
  background: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Group.svg") no-repeat;
}

/* line 128, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main {
  background: #fff4ce;
  display: block;
  -webkit-transition: top 1300ms ease-in-out;
  -moz-transition: top 1300ms ease-in-out;
  -ms-transition: top 1300ms ease-in-out;
  -o-transition: top 1300ms ease-in-out;
  transition: top 1300ms ease-in-out;
  top: 0px;
}

/* line 134, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main.welcome {
  top: 899px;
}

/* line 138, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main.finish {
  -webkit-transition: top 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out;
  transition: top 1000ms ease-in-out;
  top: 309px;
}

/* line 143, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .grass {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 960px;
  height: 110px;
  background: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Grass2.svg") no-repeat;
  -webkit-transition: filter 300ms ease-in-out;
  -moz-transition: filter 300ms ease-in-out;
  -ms-transition: filter 300ms ease-in-out;
  -o-transition: filter 300ms ease-in-out;
  transition: filter 300ms ease-in-out;
}

/* line 153, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label, .counting-out.number-sense-task-group .ns-main .zearn-input, .counting-out.number-sense-task-group .ns-main .rem-num {
  font-size: 30px;
  font-weight: bold;
}

/* line 157, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.fade-out, .counting-out.number-sense-task-group .ns-main .zearn-input.fade-out, .counting-out.number-sense-task-group .ns-main .rem-num.fade-out {
  opacity: 0;
}

/* line 161, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.hidden, .counting-out.number-sense-task-group .ns-main .zearn-input.hidden, .counting-out.number-sense-task-group .ns-main .rem-num.hidden {
  visibility: hidden;
}

/* line 165, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.fade-out-end, .counting-out.number-sense-task-group .ns-main .zearn-input.fade-out-end, .counting-out.number-sense-task-group .ns-main .rem-num.fade-out-end {
  opacity: 0;
  -webkit-transition: opacity 100ms ease-in-out;
  -moz-transition: opacity 100ms ease-in-out;
  -ms-transition: opacity 100ms ease-in-out;
  -o-transition: opacity 100ms ease-in-out;
  transition: opacity 100ms ease-in-out;
}

/* line 170, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.fade-out-close-the-loop, .counting-out.number-sense-task-group .ns-main .zearn-input.fade-out-close-the-loop, .counting-out.number-sense-task-group .ns-main .rem-num.fade-out-close-the-loop {
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 176, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label {
  position: relative;
  margin-top: 15px;
  -webkit-transition: all 500ms ease-in-out, opacity 300ms ease-in-out;
  -moz-transition: all 500ms ease-in-out, opacity 300ms ease-in-out;
  -ms-transition: all 500ms ease-in-out, opacity 300ms ease-in-out;
  -o-transition: all 500ms ease-in-out, opacity 300ms ease-in-out;
  transition: all 500ms ease-in-out, opacity 300ms ease-in-out;
}

/* line 181, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label[data-pv='0'] {
  width: 30px;
  margin-left: 40px;
}

/* line 185, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.pocket[data-pv='0'] {
  width: 70px;
  margin-left: 10px;
}

/* line 191, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label[data-pv='1'] {
  width: 80px;
  margin-left: 30px;
}

/* line 195, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .label.pocket[data-pv='1'] {
  width: 100px;
  margin-left: 10px;
}

/* line 202, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-input-box {
  position: relative;
}

/* line 205, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-input-box[data-pv='0'] {
  margin-left: 22px;
  margin-right: -18px;
}

/* line 211, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-input-box[data-pv='1'] {
  margin-left: 37px;
  margin-right: 7px;
}

/* line 218, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .zearn-input {
  min-width: 66px;
  height: 58px;
  margin-top: 6px;
  padding-top: 5px;
  position: relative;
}

/* line 225, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .zearn-input:not(.fade-out-end):not(.fade-out-close-the-loop) {
  -webkit-transition: opacity 300ms ease-in-out 700ms, background-color 100ms ease-in-out, border 100ms ease-in-out, color 100ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out 700ms, background-color 100ms ease-in-out, border 100ms ease-in-out, color 100ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out 700ms, background-color 100ms ease-in-out, border 100ms ease-in-out, color 100ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out 700ms, background-color 100ms ease-in-out, border 100ms ease-in-out, color 100ms ease-in-out;
  transition: opacity 300ms ease-in-out 700ms, background-color 100ms ease-in-out, border 100ms ease-in-out, color 100ms ease-in-out;
}

/* line 227, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .zearn-input.correct:not(.fade-out-end):not(.fade-out-close-the-loop), .counting-out.number-sense-task-group .ns-main .zearn-input.try-again:not(.fade-out-end):not(.fade-out-close-the-loop), .counting-out.number-sense-task-group .ns-main .zearn-input.incorrect:not(.fade-out-end):not(.fade-out-close-the-loop) {
  -webkit-transition: opacity 300ms ease-in-out 700ms, background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out 700ms, background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out 700ms, background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out 700ms, background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  transition: opacity 300ms ease-in-out 700ms, background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
}

/* line 232, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .zearn-input:not(.grayed):not(.correct):not(.correct-done):not(.try-again):not(.incorrect):not(.incorrect-done) {
  background-color: white;
}

/* line 237, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 10px;
}

/* line 242, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow {
  position: absolute;
  top: -48px;
  left: 33px;
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
}

/* line 249, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow figure {
  margin: 0;
}

/* line 252, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow figure path:not(:last-child) {
  fill: none;
  stroke: black;
  stroke-width: 2px;
}

/* line 259, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow .arrow-label {
  font-size: 20px;
  font-weight: bold;
  color: #323232;
  width: 80px;
  height: 80px;
  line-height: 60px;
  border-radius: 40px;
  margin: auto;
  top: -95px;
  position: relative;
  -webkit-transition: background-color 100ms ease-in-out, font-size 500ms ease-in-out;
  -moz-transition: background-color 100ms ease-in-out, font-size 500ms ease-in-out;
  -ms-transition: background-color 100ms ease-in-out, font-size 500ms ease-in-out;
  -o-transition: background-color 100ms ease-in-out, font-size 500ms ease-in-out;
  transition: background-color 100ms ease-in-out, font-size 500ms ease-in-out;
}

/* line 274, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow .arrow-label.highlight {
  background-color: #ffe919;
}

/* line 279, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-out-arrow.fade-out {
  opacity: 0;
  -webkit-transition: opacity 100ms ease-in-out;
  -moz-transition: opacity 100ms ease-in-out;
  -ms-transition: opacity 100ms ease-in-out;
  -o-transition: opacity 100ms ease-in-out;
  transition: opacity 100ms ease-in-out;
}

/* line 285, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .task-container {
  margin: auto;
}

/* line 289, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget {
  width: 100%;
  margin-top: 20px;
}

/* line 294, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .mat {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 200px;
  min-width: 100%;
  padding: 0px 60px;
  position: absolute;
  margin-left: 0px;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 304, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .mat.hidden .given-mat-container, .counting-out.number-sense-task-group .ns-main .mat.hidden .given-mat-objects .given-grouping, .counting-out.number-sense-task-group .ns-main .mat.hidden .counting-mat-container, .counting-out.number-sense-task-group .ns-main .mat.hidden .counting-mat-objects .food-row {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  opacity: 0;
}

/* line 310, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .mat.hidden.fade-in .given-mat-container, .counting-out.number-sense-task-group .ns-main .mat.hidden.fade-in .given-mat-objects .given-grouping, .counting-out.number-sense-task-group .ns-main .mat.hidden.fade-in .counting-mat-container, .counting-out.number-sense-task-group .ns-main .mat.hidden.fade-in .counting-mat-objects .food-row {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  opacity: 1;
}

/* line 318, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .scroll-left, .counting-out.number-sense-task-group .ns-main .scroll-right {
  margin: -110px 10px 0 10px;
}

/* line 321, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .scroll-left.disabled, .counting-out.number-sense-task-group .ns-main .scroll-right.disabled {
  cursor: default;
}

/* line 325, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .scroll-left.fade-out, .counting-out.number-sense-task-group .ns-main .scroll-right.fade-out {
  opacity: 0;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 331, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food {
  position: relative;
  left: 0px;
  top: 0px;
}

/* line 336, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.hidden {
  visibility: hidden;
}

/* line 340, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.on-start {
  opacity: 0;
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
}

/* line 345, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.fly-out {
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
}

/* line 348, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.fly-out[data-pv='0'] {
  -webkit-transform: scale(0.5);
  -moz-transform: scale(0.5);
  -ms-transform: scale(0.5);
  -o-transform: scale(0.5);
  transform: scale(0.5);
}

/* line 352, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.fly-out[data-pv='1'] {
  -webkit-transform: scale(0.25);
  -moz-transform: scale(0.25);
  -ms-transform: scale(0.25);
  -o-transform: scale(0.25);
  transform: scale(0.25);
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='apple'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='apple'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='broccoli'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='broccoli'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='carrot'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='carrot'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='orange'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='orange'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='pear'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='pear'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='radish'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='radish'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='strawberry'][data-pv='0'] {
  min-width: 30px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry1.svg");
  background-size: 30px 30px;
  width: 30px;
  height: 30px;
}

/* line 364, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food[data-img='strawberry'][data-pv='1'] {
  min-width: 80px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry10_noborder.svg");
  background-size: 80px 80px;
  width: 80px;
  height: 80px;
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='apple'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='broccoli'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='carrot'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='orange'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='pear'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='radish'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish10.svg");
}

/* line 373, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.with-border[data-pv='1'][data-img='strawberry'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry10.svg");
}

/* line 379, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.slid-down {
  top: 500px;
}

/* line 383, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food.slide-up:not(.rem-food) {
  -webkit-animation: slideUp 1000ms ease-in-out;
  -moz-animation: slideUp 1000ms ease-in-out;
  -ms-animation: slideUp 1000ms ease-in-out;
  -o-animation: slideUp 1000ms ease-in-out;
  animation: slideUp 1000ms ease-in-out;
  top: 0px;
}

@keyframes slideUp {
  0% {
    top: 500px;
  }
  100% {
    top: 0px;
  }
}

/* line 394, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-container {
  border-radius: 10px;
  background-color: #ffffff;
  border: solid 2px #cccccc;
  position: relative;
  margin-right: 4px;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 402, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-container.fade-out {
  opacity: 0;
}

/* line 407, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  min-width: 120px;
  height: 200px;
  position: absolute;
  padding: 0px 3px;
}

/* line 416, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .given-grouping {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 422, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .given-column {
  height: 100%;
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0px 3px;
}

/* line 433, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .given-column[data-pv='0'] ~ .given-column[data-pv='0'] {
  -webkit-box-align: end;
  -webkit-align-self: flex-end;
  -ms-flex-align: end;
  align-self: flex-end;
}

/* line 437, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .food.fly-in {
  opacity: 1;
  transform: none;
  -webkit-transition: all 700ms ease-in-out, opacity 33ms;
  -moz-transition: all 700ms ease-in-out, opacity 33ms;
  -ms-transition: all 700ms ease-in-out, opacity 33ms;
  -o-transition: all 700ms ease-in-out, opacity 33ms;
  transition: all 700ms ease-in-out, opacity 33ms;
}

/* line 443, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='0'] {
  margin-bottom: 3.5px;
  margin-top: 3.5px;
}

/* line 447, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='0']:first-child, .counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='0']:nth-child(5n+1) {
  margin-top: 10px;
}

/* line 450, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='0']:nth-child(5n), .counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='0']:last-child {
  margin-bottom: 10px;
}

/* line 456, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .food[data-pv='1']:first-child:nth-last-child(3) ~ .food[data-pv='1'] {
  margin-top: -25px;
}

/* line 461, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .given-column[data-pv='1']:nth-last-child(3) ~ .given-column[data-pv='1'] {
  margin-left: -20px;
}

/* line 465, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .label {
  position: absolute;
  top: 200px;
}

/* line 470, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .counting-out-input-box {
  position: absolute;
  top: 200px;
  right: -10px;
}

/* line 476, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .given-mat-objects .counting-out-input-box .zearn-input:not(.fade-out-end) {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 483, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic) .counting-mat-container {
  background-color: white;
  border: solid 2px #cccccc;
}

/* line 488, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.incorrect .counting-mat-container {
  border: solid 2px #ff4d76;
  background-color: #ffe6ee;
  cursor: pointer;
}

/* line 494, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.correct .counting-mat-container {
  border: solid 2px #00c372;
  background-color: #ccffd9;
}

/* line 499, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.inefficient .counting-mat-container {
  border: solid 2px #f3cd84;
  background-color: #f9e5b6;
  cursor: pointer;
}

/* line 504, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.inefficient .counting-mat-container:hover {
  background-color: #f6d99b;
}

/* line 509, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-container {
  position: relative;
  border-radius: 10px;
  background-color: #f3fdff;
  border: solid 2px #0097b6;
  padding-right: 20px;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -webkit-transition: opacity 300ms ease-in-out, all 500ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, all 500ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, all 500ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, all 500ms ease-in-out;
  transition: opacity 300ms ease-in-out, all 500ms ease-in-out;
}

/* line 518, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-container.fade-out {
  opacity: 0;
}

/* line 522, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-container.highlight-hint {
  -webkit-animation: highlightMat 667ms linear 3;
  -moz-animation: highlightMat 667ms linear 3;
  -ms-animation: highlightMat 667ms linear 3;
  -o-animation: highlightMat 667ms linear 3;
  animation: highlightMat 667ms linear 3;
}

@-webkit-keyframes highlightMat {
  50% {
    background-color: #ffff73;
    border-color: #ffe919;
  }
}

@-moz-keyframes highlightMat {
  50% {
    background-color: #ffff73;
    border-color: #ffe919;
  }
}

@-o-keyframes highlightMat {
  50% {
    background-color: #ffff73;
    border-color: #ffe919;
  }
}

@keyframes highlightMat {
  50% {
    background-color: #ffff73;
    border-color: #ffe919;
  }
}

/* line 533, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects {
  position: absolute;
  padding-right: 20px;
}

/* line 537, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food {
  opacity: 1;
  position: relative;
}

/* line 541, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food.preanimate {
  opacity: 0;
}

/* line 545, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food.animate {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 549, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food.fade-out {
  opacity: 0;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
  -webkit-transition: all 300ms ease-in-out 100ms;
  -moz-transition: all 300ms ease-in-out 100ms;
  -ms-transition: all 300ms ease-in-out 100ms;
  -o-transition: all 300ms ease-in-out 100ms;
  transition: all 300ms ease-in-out 100ms;
}

/* line 555, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food[data-pv='0'] {
  margin-left: 40px;
}

/* line 558, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food[data-pv='1'] {
  margin-left: 30px;
}

/* line 563, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food-row, .counting-out.number-sense-task-group .ns-main .counting-mat-objects .label-row, .counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 568, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food-row {
  position: relative;
}

/* line 572, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .label-row {
  position: absolute;
  top: 200px;
}

/* line 577, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .food-row, .counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row, .counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row {
  height: 200px;
}

/* line 581, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row {
  position: relative;
  top: -200px;
}

/* line 585, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row.hidden {
  display: none;
}

/* line 589, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  opacity: 0;
  border: solid 1px #99dcff;
  border-radius: 10px;
  margin-left: 10px;
  width: 50px;
  height: calc(100% - 2 * 10px);
  -webkit-transition: all 300ms ease-in-out 100ms;
  -moz-transition: all 300ms ease-in-out 100ms;
  -ms-transition: all 300ms ease-in-out 100ms;
  -o-transition: all 300ms ease-in-out 100ms;
  transition: all 300ms ease-in-out 100ms;
}

/* line 600, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket .food {
  margin: 0;
}

/* line 605, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.filled[data-pv='0'] {
  width: 70px;
  padding-left: 20px;
}

/* line 610, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.filled[data-pv='1'] {
  width: 100px;
  padding-left: 10px;
}

/* line 616, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.active {
  opacity: 1;
}

/* line 620, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.incorrect {
  border: solid 1px #ff4d76;
}

/* line 624, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.correct {
  border: solid 1px #00c372;
}

/* line 628, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.fade-out {
  opacity: 0;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
  -webkit-transition: all 300ms ease-in-out 100ms;
  -moz-transition: all 300ms ease-in-out 100ms;
  -ms-transition: all 300ms ease-in-out 100ms;
  -o-transition: all 300ms ease-in-out 100ms;
  transition: all 300ms ease-in-out 100ms;
}

/* line 634, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .pocket-row .pocket.fade-out-end {
  border-color: transparent;
}

/* line 640, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  min-width: calc(100% - 20px);
  left: 0px;
  top: 0px;
}

/* line 648, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost {
  opacity: 0;
}

/* line 651, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.active {
  opacity: 1;
  -webkit-transition: all 300ms ease-in-out 100ms;
  -moz-transition: all 300ms ease-in-out 100ms;
  -ms-transition: all 300ms ease-in-out 100ms;
  -o-transition: all 300ms ease-in-out 100ms;
  transition: all 300ms ease-in-out 100ms;
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='apple'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='apple'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/apple_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='broccoli'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='broccoli'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/broccoli_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='carrot'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='carrot'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/carrot_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='orange'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='orange'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/orange_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='pear'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='pear'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/pear_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='radish'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='radish'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/radish_ghost.svg");
}

/* line 659, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='strawberry'][data-pv='1'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry10_ghost.svg");
}

/* line 663, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects .ghost-row .ghost.food[data-img='strawberry'][data-pv='0'] {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/foods/strawberry_ghost.svg");
}

/* line 673, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects.spaced-out .food {
  width: 100px;
  min-width: 100px;
  margin-left: 10px;
}

/* line 679, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects.spaced-out .counting-out-input-box {
  width: 100px;
  min-width: 100px;
  margin-left: 10px;
  margin-right: 0px;
}

/* line 685, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-objects.spaced-out .counting-out-input-box .counting-out-arrow {
  left: 50px;
}

/* line 692, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .bank {
  position: relative;
  margin-top: 275px;
  -webkit-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 600ms;
  -moz-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 600ms;
  -ms-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 600ms;
  -o-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 600ms;
  transition: top 600ms ease-in-out, z-index 0ms ease-in-out 600ms;
  top: 0px;
}

/* line 699, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .bank.slide-down {
  -webkit-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 200ms;
  -moz-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 200ms;
  -ms-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 200ms;
  -o-transition: top 600ms ease-in-out, z-index 0ms ease-in-out 200ms;
  transition: top 600ms ease-in-out, z-index 0ms ease-in-out 200ms;
  top: 250px;
}

/* line 706, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .bank .qty-wrap {
  display: inline-block;
  margin: 0px 27px;
}

/* line 710, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .bank .qty-wrap.ones .food {
  margin: 25px 0px;
}

/* line 715, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .bank .plus-button, .counting-out.number-sense-task-group .ns-main .bank .minus-button {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

/* line 720, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal {
  display: inline-block;
  position: absolute;
  top: 0px;
  -webkit-transition: left 1000ms ease-in-out;
  -moz-transition: left 1000ms ease-in-out;
  -ms-transition: left 1000ms ease-in-out;
  -o-transition: left 1000ms ease-in-out;
  transition: left 1000ms ease-in-out;
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='black_bear'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/black_bear.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='black_bear'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/black_bear_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='brown_bear'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/brown_bear.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='brown_bear'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/brown_bear_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='dog'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/dog.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='dog'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/dog_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='fox'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/fox.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='fox'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/fox_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='frog'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/frog.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='frog'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/frog_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='koala'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/koala.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='koala'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/koala_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='lion'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/lion.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='lion'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/lion_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='monkey'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/monkey.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='monkey'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/monkey_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='pig'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/pig.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='pig'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/pig_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='rabbit'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/rabbit.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='rabbit'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/rabbit_eating.svg");
}

/* line 727, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-img='tiger'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/tiger.svg");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 729, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.eating[data-img='tiger'] {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/animals/tiger_eating.svg");
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='1'] {
  left: 160px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='2'] {
  left: 255px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='3'] {
  left: 350px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='4'] {
  left: 445px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='5'] {
  left: 540px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='6'] {
  left: 635px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='7'] {
  left: 730px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='8'] {
  left: 825px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='9'] {
  left: 920px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='10'] {
  left: 1015px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='11'] {
  left: 1110px;
}

/* line 737, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal[data-num='12'] {
  left: 1205px;
}

/* line 742, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.in-front {
  -webkit-transform: scale(2.1);
  -moz-transform: scale(2.1);
  -ms-transform: scale(2.1);
  -o-transform: scale(2.1);
  transform: scale(2.1);
  width: 100px;
  top: -55px;
  left: 40px;
  -webkit-transition: all 750ms ease-in-out, z-index 0ms ease-in-out 500ms;
  -moz-transition: all 750ms ease-in-out, z-index 0ms ease-in-out 500ms;
  -ms-transition: all 750ms ease-in-out, z-index 0ms ease-in-out 500ms;
  -o-transition: all 750ms ease-in-out, z-index 0ms ease-in-out 500ms;
  transition: all 750ms ease-in-out, z-index 0ms ease-in-out 500ms;
}

/* line 750, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal.in-front.slide-off {
  margin-left: -500px;
  -webkit-transition: margin-left 1500ms ease-in-out;
  -moz-transition: margin-left 1500ms ease-in-out;
  -ms-transition: margin-left 1500ms ease-in-out;
  -o-transition: margin-left 1500ms ease-in-out;
  transition: margin-left 1500ms ease-in-out;
}

/* line 757, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal-lineup {
  position: absolute;
  top: 600px;
  -webkit-transition: top 1000ms ease-in-out, filter 300ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out, filter 300ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out, filter 300ms ease-in-out;
  -o-transition: top 1000ms ease-in-out, filter 300ms ease-in-out;
  transition: top 1000ms ease-in-out, filter 300ms ease-in-out;
}

/* line 762, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal-lineup.behind-grass {
  display: block;
  top: 480px;
}

/* line 772, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.counting .given-mat-objects .label {
  left: 0px;
  width: 100%;
}

/* line 779, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .given-mat-objects .label, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .given-mat-objects .label, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .given-mat-objects .label {
  right: 10px;
}

/* line 783, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .label-row .label, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .label-row .label, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .label-row .label {
  margin-top: 4px;
}

/* line 785, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .label-row .label.and-more, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .label-row .label.and-more, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .label-row .label.and-more {
  margin-right: 10px;
  white-space: nowrap;
}

/* line 791, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .close-the-loop, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .close-the-loop, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .close-the-loop {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  width: auto;
  opacity: 1;
}

/* line 798, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .close-the-loop.fade-out, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .close-the-loop.fade-out, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .close-the-loop.fade-out {
  opacity: 0;
  width: 0;
}

/* line 803, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .close-the-loop .label:not(:first-child), .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .close-the-loop .label:not(:first-child), .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .close-the-loop .label:not(:first-child) {
  white-space: nowrap;
  margin-left: 10px;
}

/* line 808, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.more .close-the-loop .zearn-input, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.adding .close-the-loop .zearn-input, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.goal .close-the-loop .zearn-input {
  margin-left: 10px;
}

/* line 818, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-layer {
  width: 100%;
  height: 100%;
  background-color: white;
  position: absolute;
  top: 0px;
  opacity: 0;
  -webkit-transition: opacity 1000ms ease-in-out, z-index 0ms ease-in-out 1000ms;
  -moz-transition: opacity 1000ms ease-in-out, z-index 0ms ease-in-out 1000ms;
  -ms-transition: opacity 1000ms ease-in-out, z-index 0ms ease-in-out 1000ms;
  -o-transition: opacity 1000ms ease-in-out, z-index 0ms ease-in-out 1000ms;
  transition: opacity 1000ms ease-in-out, z-index 0ms ease-in-out 1000ms;
}

/* line 830, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group.remediating .remediation-layer {
  opacity: 0.95;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 836, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group.remediating .grass, .counting-out.number-sense-task-group.remediating .animal-lineup, .counting-out.number-sense-task-group.remediating .ns-prompt-bar.behind, .counting-out.number-sense-task-group.remediating .counting-mat-widget:not(.dynamic) > div:not(.remediation-area) {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 846, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-foods .food.rem-food {
  position: absolute;
}

/* line 848, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-foods .food.rem-food.rem-moment {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 850, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-foods .food.rem-food.rem-moment[data-pv='1'] {
  min-width: 40px;
  width: 40px;
  height: 40px;
  background-size: 40px 40px;
}

/* line 856, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-foods .food.rem-food.rem-moment[data-pv='0'] {
  min-width: 15px;
  width: 15px;
  height: 15px;
  background-size: 15px 15px;
}

/* line 863, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-foods .food.rem-food.fade-out {
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 870, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num, .counting-out.number-sense-task-group .remediation-area .rem-pvc {
  position: absolute;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 873, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num .tens, .counting-out.number-sense-task-group .remediation-area .rem-num .ones, .counting-out.number-sense-task-group .remediation-area .rem-pvc .tens, .counting-out.number-sense-task-group .remediation-area .rem-pvc .ones {
  display: inline-block;
  height: 100%;
}

/* line 879, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num {
  min-width: 66px;
  padding-top: 5px;
  border: 4px solid transparent;
  top: 6px;
  left: 0px;
}

/* line 885, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num .ones {
  margin-left: -8px;
  min-width: 0px;
}

/* line 889, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num .tens {
  margin-left: 0px;
  min-width: 0px;
}

/* line 893, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.moving {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 895, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.moving .ones, .counting-out.number-sense-task-group .remediation-area .rem-num.moving .tens {
  -webkit-transition: margin-left 500ms ease-in-out, min-width 500ms ease-in-out;
  -moz-transition: margin-left 500ms ease-in-out, min-width 500ms ease-in-out;
  -ms-transition: margin-left 500ms ease-in-out, min-width 500ms ease-in-out;
  -o-transition: margin-left 500ms ease-in-out, min-width 500ms ease-in-out;
  transition: margin-left 500ms ease-in-out, min-width 500ms ease-in-out;
}

/* line 899, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment {
  padding-top: 0px;
  border-width: 0px;
  font-size: 72px;
  top: 300px;
}

/* line 904, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment .ones {
  margin-left: -12px;
}

/* line 907, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment .tens {
  margin-left: 4px;
}

/* line 913, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc {
  border-radius: 5px;
  border: 4px solid black;
  top: 270px;
}

/* line 917, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc.fade-out {
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 921, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .ones {
  border-left: 4px solid black;
}

/* line 924, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .ones, .counting-out.number-sense-task-group .remediation-area .rem-pvc .tens {
  -webkit-transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
  -moz-transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
  -ms-transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
  -o-transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
  transition: background-color 100ms ease-in-out, color 100ms ease-in-out;
}

/* line 928, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-row {
  height: 93px;
}

/* line 931, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-row .ones.highlight, .counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-row .tens.highlight {
  background-color: #ffe919;
}

/* line 935, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-row .tens {
  width: 85.5px;
}

/* line 938, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-row .ones {
  width: 89.5px;
}

/* line 942, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-header {
  background-color: black;
  color: white;
  font-size: 20px;
  height: 30px;
}

/* line 948, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-header .ones.highlight, .counting-out.number-sense-task-group .remediation-area .rem-pvc .pvc-header .tens.highlight {
  color: #ffe919;
}

/* line 954, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment, .counting-out.number-sense-task-group .remediation-area .rem-pvc {
  min-width: 180px;
}

/* line 956, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment.previous, .counting-out.number-sense-task-group .remediation-area .rem-pvc.previous {
  left: 235px;
}

/* line 959, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment.current, .counting-out.number-sense-task-group .remediation-area .rem-pvc.current {
  left: 545px;
}

/* line 962, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment .ones, .counting-out.number-sense-task-group .remediation-area .rem-pvc .ones {
  min-width: 88px;
}

/* line 965, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num.rem-moment .tens, .counting-out.number-sense-task-group .remediation-area .rem-pvc .tens {
  min-width: 82px;
}

/* line 971, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .counting-out-arrow.fade-out {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 974, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .counting-out-arrow.rem-moment {
  top: 310px;
  left: 430px;
}

/* line 978, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .counting-out-arrow.rem-moment .arrow-label {
  font-size: 30px;
}

/* line 982, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .counting-out-arrow.rem-moment:not(.fade-out) {
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -ms-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}

/* line 988, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .number-sense-finish {
  position: absolute;
  left: 0px;
  width: 100%;
  height: 100%;
  display: none;
  top: 309px;
  background: none;
}

/* line 997, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .number-sense-finish .fluency-complete-buttons {
  display: block;
}

/* line 1000, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  color: #ff5959;
  position: relative;
  top: -280px;
}

/* line 1007, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .number-sense-finish .zzz {
  left: 360px;
  top: 165px;
  position: absolute;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/ZZZ.gif");
  background-size: 80px 100px;
  width: 80px;
  height: 100px;
}

/* line 1014, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .number-sense-finish .sleeping-rabbit {
  position: relative;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/counting/sum_snacks/Rabbit_sleeping.svg");
  background-size: 300px 200px;
  width: 300px;
  height: 200px;
  top: 210px;
  margin: auto;
}

@supports (-ms-accelerator: true) {
  /* line 1028, app/assets/stylesheets/number_sense_activities/counting_out.scss */
  .counting-out.number-sense-task-group.remediating .grass, .counting-out.number-sense-task-group.remediating .animal-lineup, .counting-out.number-sense-task-group.remediating .ns-prompt-bar.behind, .counting-out.number-sense-task-group.remediating .counting-mat-widget:not(.dynamic) > div:not(.remediation-area) {
    -webkit-filter: none;
    -moz-filter: none;
    -ms-filter: none;
    -o-filter: none;
    filter: none;
  }
}

/* line 1046, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .welcome-scene {
  z-index: 2;
}

/* line 1051, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .title .bite {
  z-index: 1;
}

/* line 1055, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .ns-welcome-button {
  z-index: 2;
}

/* line 1058, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-welcome .welcome-animals {
  z-index: 1;
}

/* line 1065, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .grass {
  z-index: 1;
}

/* line 1068, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .food {
  z-index: 7;
}

/* line 1071, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .animal {
  z-index: 1;
}

/* line 1075, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget .scroll-left, .counting-out.number-sense-task-group .ns-main .counting-mat-widget .scroll-right {
  z-index: 8;
}

/* line 1079, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .given-mat-container, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .counting-mat-container {
  z-index: 5;
}

/* line 1082, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .given-mat-objects {
  z-index: 6;
}

/* line 1086, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .counting-mat-objects .ghost-row {
  z-index: 4;
}

/* line 1089, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .counting-mat-objects .pocket-row .pocket, .counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .counting-mat-objects .ghost-row .ghost {
  z-index: 6;
}

/* line 1093, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .label {
  z-index: 6;
}

/* line 1096, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .bank {
  z-index: 7;
}

/* line 1098, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget.dynamic .bank.slide-down {
  z-index: 1;
}

/* line 1104, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .given-mat-container, .counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .counting-mat-container {
  z-index: 1;
}

/* line 1107, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .given-mat-objects .given-grouping, .counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .given-mat-objects .zearn-input, .counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .counting-mat-objects .food-row, .counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .counting-mat-objects .label-row .zearn-input:not(.clickable) {
  z-index: 2;
}

/* line 1110, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .counting-out-arrow {
  z-index: 8;
}

/* line 1112, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-main .counting-mat-widget:not(.dynamic):not(.more):not(.adding) .counting-out-arrow .arrow-label {
  z-index: -1;
}

/* line 1120, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .ns-prompt-bar.behind {
  z-index: 3;
}

/* line 1125, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-layer {
  z-index: 0;
}

/* line 1129, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group.remediating .remediation-layer {
  z-index: 4;
}

/* line 1132, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group.remediating .ns-main .counting-mat-widget.dynamic .counting-mat-objects .ghost-row {
  z-index: 5;
}

/* line 1135, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group.remediating .ns-main .animal.in-front:not(.eating) {
  z-index: 1;
}

/* line 1140, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-num {
  z-index: 7;
}

/* line 1143, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .rem-pvc {
  z-index: 6;
}

/* line 1147, app/assets/stylesheets/number_sense_activities/counting_out.scss */
.counting-out.number-sense-task-group .remediation-area .counting-out-arrow.rem-moment {
  z-index: 6;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 8, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-hundred-flat {
  display: table;
  background: #f26d00;
  border-style: solid;
  border-color: #994500;
  border-width: 2px 4px 4px 2px;
}

/* line 15, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-hundred-flat .ns-hundred-flat-row {
  display: table-row;
}

/* line 18, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-hundred-flat .ns-hundred-flat-cell {
  width: 17px;
  height: 17px;
  display: table-cell;
  border-style: solid;
  border-color: #994500;
  border-width: 2px 0px 0px 2px;
}

/* line 28, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-ten-rod {
  border-bottom: 4px solid #991900;
}

/* line 30, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-ten-rod .ns-ten-rod-cell {
  background: #ff5433;
  border: 4px solid #991900;
  border-bottom: none;
  width: 21px;
  height: 17px;
}

/* line 39, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.ns-one-unit {
  width: 13px;
  height: 13px;
  background: #505759;
}

/* line 45, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-hundreds-buttons, .f2f-concrete-tens-buttons, .f2f-concrete-ones-buttons,
.f2f-concrete-hundreds-area, .f2f-concrete-tens-area, .f2f-concrete-ones-area {
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

/* line 52, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-hundreds-buttons, .f2f-concrete-tens-buttons,
.f2f-concrete-hundreds-area, .f2f-concrete-tens-area {
  width: 358px;
}

/* line 57, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-ones-buttons, .f2f-concrete-ones-area {
  width: 180px;
}

/* line 61, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons, .f2f-concrete-mat {
  width: 900px;
  margin: 0 auto;
}

/* line 66, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons {
  border: 2px solid transparent;
  -webkit-transform: translateY(100px);
  -moz-transform: translateY(100px);
  -ms-transform: translateY(100px);
  -o-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-transition: -webkit-transform 300ms ease-in-out;
  -moz-transition: -moz-transform 300ms ease-in-out;
  -o-transition: -o-transform 300ms ease-in-out;
  transition: transform 300ms ease-in-out;
}

/* line 71, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons.show {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}

/* line 75, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .plus-button, .f2f-concrete-buttons .minus-button {
  vertical-align: middle;
}

/* line 79, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-hundred-flat, .f2f-concrete-buttons .ns-ten-rod, .f2f-concrete-buttons .ns-one-unit {
  display: inline-block;
  vertical-align: middle;
  margin: 0 4px;
}

/* line 85, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-hundred-flat-cell, .f2f-concrete-buttons .ns-ten-rod-cell {
  width: 6px;
  height: 6px;
}

/* line 90, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-hundred-flat {
  border-width: 1px 2px 2px 1px;
}

/* line 93, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-hundred-flat .ns-hundred-flat-cell {
  border-width: 1px 0px 0px 1px;
}

/* line 98, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-ten-rod {
  border-width: 1px;
}

/* line 101, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-ten-rod .ns-ten-rod-cell {
  border-width: 1px;
}

/* line 106, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-buttons .ns-one-unit {
  border-width: 1px;
  width: 8px;
  height: 8px;
}

/* line 113, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat {
  margin-top: 20px;
  background: #048ec3;
  border-radius: 10px;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 119, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat.correct {
  background-color: #00c372;
}

/* line 122, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat.incorrect {
  background-color: #ff4d76;
}

/* line 125, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat.clickable {
  cursor: pointer;
}

/* line 129, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-box {
  height: 360px;
  background: #f3fdff;
  border: 2px solid #0097b6;
  border-radius: 10px;
  position: relative;
  top: 0px;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 138, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-box.activate {
  -webkit-animation: bounceUp 1000ms;
  -moz-animation: bounceUp 1000ms;
  -ms-animation: bounceUp 1000ms;
  -o-animation: bounceUp 1000ms;
  animation: bounceUp 1000ms;
  top: -10px;
}

/* line 142, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-box.incorrect {
  border-color: #ff4d76;
  background-color: #ffe6ee;
}

/* line 146, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-box.correct {
  border-color: #00c372;
  background-color: #ccffd9;
  -webkit-animation: bounceDown 1000ms;
  -moz-animation: bounceDown 1000ms;
  -ms-animation: bounceDown 1000ms;
  -o-animation: bounceDown 1000ms;
  animation: bounceDown 1000ms;
  top: 0px;
}

/* line 154, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .ns-hundred-flat, .f2f-concrete-mat .ns-ten-rod, .f2f-concrete-mat .ns-one-unit {
  opacity: 0;
  position: relative;
  -webkit-transition: opacity 500ms, transform 500ms;
  -moz-transition: opacity 500ms, transform 500ms;
  -ms-transition: opacity 500ms, transform 500ms;
  -o-transition: opacity 500ms, transform 500ms;
  transition: opacity 500ms, transform 500ms;
}

/* line 158, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .ns-hundred-flat.active, .f2f-concrete-mat .ns-ten-rod.active, .f2f-concrete-mat .ns-one-unit.active {
  opacity: 1;
}

/* line 160, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .ns-hundred-flat.active.pre-animate, .f2f-concrete-mat .ns-ten-rod.active.pre-animate, .f2f-concrete-mat .ns-one-unit.active.pre-animate {
  -webkit-transform: scale(0.4);
  -moz-transform: scale(0.4);
  -ms-transform: scale(0.4);
  -o-transform: scale(0.4);
  transform: scale(0.4);
  -webkit-transform-origin: top left;
  -moz-transform-origin: top left;
  -ms-transform-origin: top left;
  -o-transform-origin: top left;
  transform-origin: top left;
  -webkit-transition: opacity 100ms;
  -moz-transition: opacity 100ms;
  -ms-transition: opacity 100ms;
  -o-transition: opacity 100ms;
  transition: opacity 100ms;
}

/* line 164, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .ns-hundred-flat.active.pre-animate.animate, .f2f-concrete-mat .ns-ten-rod.active.pre-animate.animate, .f2f-concrete-mat .ns-one-unit.active.pre-animate.animate {
  -webkit-transition: all 500ms;
  -moz-transition: all 500ms;
  -ms-transition: all 500ms;
  -o-transition: all 500ms;
  transition: all 500ms;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

/* line 172, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-remediation-area, .f2f-concrete-mat .f2f-concrete-tens-remediation-area, .f2f-concrete-mat .f2f-concrete-ones-remediation-area {
  opacity: 0;
}

/* line 174, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-remediation-area.show, .f2f-concrete-mat .f2f-concrete-tens-remediation-area.show, .f2f-concrete-mat .f2f-concrete-ones-remediation-area.show {
  opacity: 1;
}

/* line 180, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot {
  position: absolute;
  width: 176px;
  height: 176px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-0 {
  top: 20px;
  left: 10px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-1 {
  top: 28px;
  left: 26px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-2 {
  top: 36px;
  left: 42px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-3 {
  top: 44px;
  left: 58px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-4 {
  top: 52px;
  left: 74px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-5 {
  top: 60px;
  left: 90px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-6 {
  top: 68px;
  left: 106px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-7 {
  top: 76px;
  left: 122px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-8 {
  top: 84px;
  left: 138px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundreds-area .f2f-concrete-hundred-slot.slot-9 {
  top: 92px;
  left: 154px;
}

/* line 194, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-tens-area {
  padding-top: 20px;
}

/* line 197, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-tens-area .f2f-concrete-ten-slot {
  display: inline-block;
  vertical-align: top;
  margin: 0 6px;
  width: 21px;
  height: 174px;
}

/* line 206, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-ones-area {
  padding: 20px 0;
}

/* line 208, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-ones-area .f2f-concrete-one-slot {
  margin: 0px auto 4px auto;
  width: 13px;
  height: 13px;
}

/* line 213, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-ones-area .f2f-concrete-one-slot.slot-4 {
  margin-bottom: 12px;
}

/* line 219, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundred-slot, .f2f-concrete-mat .f2f-concrete-ten-slot, .f2f-concrete-mat .f2f-concrete-one-slot {
  border-color: #f3fdff;
}

/* line 222, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundred-slot.ghost, .f2f-concrete-mat .f2f-concrete-ten-slot.ghost, .f2f-concrete-mat .f2f-concrete-one-slot.ghost {
  border: 2px dotted #999999;
  background: #e4e4e4;
  opacity: 1;
  -webkit-transition: border-color 500ms, background 500ms;
  -moz-transition: border-color 500ms, background 500ms;
  -ms-transition: border-color 500ms, background 500ms;
  -o-transition: border-color 500ms, background 500ms;
  transition: border-color 500ms, background 500ms;
}

/* line 228, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundred-slot.ghost .ns-hundred-flat, .f2f-concrete-mat .f2f-concrete-ten-slot.ghost .ns-hundred-flat, .f2f-concrete-mat .f2f-concrete-one-slot.ghost .ns-hundred-flat {
  width: 176px;
  height: 176px;
  margin: -2px 0px 0px -2px;
}

/* line 233, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundred-slot.ghost .ns-ten-rod, .f2f-concrete-mat .f2f-concrete-ten-slot.ghost .ns-ten-rod, .f2f-concrete-mat .f2f-concrete-one-slot.ghost .ns-ten-rod {
  width: 21px;
  height: 174px;
  margin: -2px 0px 0px -2px;
}

/* line 238, app/assets/stylesheets/number_sense_activities/f2f_concrete.scss */
.f2f-concrete-mat .f2f-concrete-hundred-slot.ghost .ns-one-unit, .f2f-concrete-mat .f2f-concrete-ten-slot.ghost .ns-one-unit, .f2f-concrete-mat .f2f-concrete-one-slot.ghost .ns-one-unit {
  width: 13px;
  height: 13px;
  margin: -2px 0px 0px -2px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes bounceUp {
  0% {
    top: 0px;
  }
  20% {
    top: -10px;
  }
  40% {
    top: -6px;
  }
  60% {
    top: -10px;
  }
  80% {
    top: -9px;
  }
  100% {
    top: -10px;
  }
}

@-moz-keyframes bounceUp {
  0% {
    top: 0px;
  }
  20% {
    top: -10px;
  }
  40% {
    top: -6px;
  }
  60% {
    top: -10px;
  }
  80% {
    top: -9px;
  }
  100% {
    top: -10px;
  }
}

@-o-keyframes bounceUp {
  0% {
    top: 0px;
  }
  20% {
    top: -10px;
  }
  40% {
    top: -6px;
  }
  60% {
    top: -10px;
  }
  80% {
    top: -9px;
  }
  100% {
    top: -10px;
  }
}

@keyframes bounceUp {
  0% {
    top: 0px;
  }
  20% {
    top: -10px;
  }
  40% {
    top: -6px;
  }
  60% {
    top: -10px;
  }
  80% {
    top: -9px;
  }
  100% {
    top: -10px;
  }
}

@-webkit-keyframes bounceDown {
  0% {
    top: -10px;
  }
  20% {
    top: 0px;
  }
  40% {
    top: -4px;
  }
  60% {
    top: 0px;
  }
  80% {
    top: -1px;
  }
  100% {
    top: 0px;
  }
}

@-moz-keyframes bounceDown {
  0% {
    top: -10px;
  }
  20% {
    top: 0px;
  }
  40% {
    top: -4px;
  }
  60% {
    top: 0px;
  }
  80% {
    top: -1px;
  }
  100% {
    top: 0px;
  }
}

@-o-keyframes bounceDown {
  0% {
    top: -10px;
  }
  20% {
    top: 0px;
  }
  40% {
    top: -4px;
  }
  60% {
    top: 0px;
  }
  80% {
    top: -1px;
  }
  100% {
    top: 0px;
  }
}

@keyframes bounceDown {
  0% {
    top: -10px;
  }
  20% {
    top: 0px;
  }
  40% {
    top: -4px;
  }
  60% {
    top: 0px;
  }
  80% {
    top: -1px;
  }
  100% {
    top: 0px;
  }
}

/* line 36, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group {
  height: 560px;
}

/* line 39, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right {
  position: absolute;
  width: 0px;
  height: 0px;
}

/* line 43, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-bottom {
  border-left: 480px solid transparent;
  border-right: 480px solid transparent;
}

/* line 46, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-top.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-bottom.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-top.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-bottom.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-top.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-bottom.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-top.f2f-bg-top, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-bottom.f2f-bg-top {
  top: 0px;
  border-top: 280px solid #00afcc;
}

/* line 50, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-top.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-bottom.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-top.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-bottom.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-top.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-bottom.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-top.f2f-bg-bottom, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-bottom.f2f-bg-bottom {
  bottom: 0px;
  border-bottom: 280px solid #6700cc;
}

/* line 55, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-right {
  border-top: 280px solid transparent;
  border-bottom: 280px solid transparent;
}

/* line 58, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-left.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-right.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-left.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-right.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-left.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-right.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-left.f2f-bg-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-right.f2f-bg-left {
  left: 0px;
  border-left: 480px solid #00cc80;
}

/* line 62, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-left.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-top.f2f-bg-right.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-left.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-bottom.f2f-bg-right.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-left.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-left.f2f-bg-right.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-left.f2f-bg-right, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-bg-right.f2f-bg-right.f2f-bg-right {
  right: 0px;
  border-right: 480px solid #00cc80;
}

/* line 69, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .center-circle, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-brain {
  position: absolute;
  border-radius: 250px;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: -webkit-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  -moz-transition: -moz-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  -o-transition: -o-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  transition: transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
}

/* line 76, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal {
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -ms-transform-style: none;
  left: 245px;
  width: 450px;
  height: 450px;
  bottom: 55px;
}

/* line 87, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal.flipped {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -ms-transform: rotateY(0deg);
}

/* line 92, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal.flipped .center-circle {
  -ms-transform: rotateY(180deg);
}

/* line 96, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal.flipped .f2f-brain {
  -ms-transform: rotateY(0deg);
}

/* line 101, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-form-text, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-t-text {
  background-repeat: no-repeat;
  background-color: transparent;
}

/* line 106, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle {
  background: #ffec00;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* line 112, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-form-bg, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-t-text, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .ns-welcome-button {
  position: absolute;
}

/* line 116, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-form-bg {
  background-color: #6700cc;
  height: 70px;
  width: 260px;
  padding: 10px;
  left: 95px;
}

/* line 122, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-form-bg.top {
  top: 70px;
}

/* line 125, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-form-bg.bottom {
  bottom: 70px;
}

/* line 129, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-form-bg .f2f-form-text {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/asset-word-form.svg");
  width: 168px;
  height: 100%;
  margin: auto;
}

/* line 136, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .f2f-t-text {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/asset-word-t.svg");
  width: 75px;
  height: 130px;
  top: 160px;
  left: 130px;
}

/* line 143, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .ns-welcome-button {
  top: 192px;
  left: 220px;
  width: 100px;
  height: 100px;
}

/* line 149, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .center-circle .fluency-complete-buttons {
  margin-top: 160px;
}

/* line 154, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain {
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}

/* line 160, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.effort {
  background-color: white;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_effort.gif");
}

/* line 164, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.thinking {
  background-color: white;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_thinking.gif");
}

/* line 168, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.strong {
  background-color: #ffec00;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_strong.gif");
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  /* line 154, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
  #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain {
    background-size: 80%;
    background-position: center;
  }
  /* line 180, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
  #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.effort {
    background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_effort_v2.svg");
  }
  /* line 183, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
  #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.thinking {
    background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_thinking_v2.svg");
  }
  /* line 186, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
  #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-goal .f2f-brain.strong {
    background-image: url("//webassets.zearn.org/app_assets/number_sense/form_2_form/EFOE_brain_strong_v2.svg");
  }
}

/* line 193, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-gate {
  position: absolute;
  -webkit-transition: -webkit-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  -moz-transition: -moz-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  -o-transition: -o-transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  transition: transform 2000ms ease-in-out, height 1000ms ease-in-out, width 1000ms ease-in-out, bottom 1000ms ease-in-out, left 1000ms ease-in-out;
  background: white;
  overflow: hidden;
}

/* line 199, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-gate.active {
  z-index: 3;
}

/* line 204, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .task-container.grid-12 {
  margin: 0;
  width: 940px;
  height: 430px;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
}

/* line 212, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .task-container.grid-12.small {
  -webkit-transition: -webkit-transform 1000ms ease-in-out;
  -moz-transition: -moz-transform 1000ms ease-in-out;
  -o-transition: -o-transform 1000ms ease-in-out;
  transition: transform 1000ms ease-in-out;
  top: -65px;
  left: -34px;
  -webkit-transform: scale(0.7);
  -moz-transform: scale(0.7);
  -ms-transform: scale(0.7);
  -o-transform: scale(0.7);
  transform: scale(0.7);
}

/* line 221, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-text-input {
  margin-top: 156px;
}

/* line 227, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat {
  background: transparent;
}

/* line 230, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box {
  height: 280px;
  border-color: #cbcbcb;
  background: white;
}

/* line 235, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area {
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -ms-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

/* line 237, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area.faded, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area.faded, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area.faded, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-area.faded, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-area.faded, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-area.faded {
  opacity: 0.5;
}

/* line 242, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area {
  position: relative;
}

/* line 245, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area.show {
  -webkit-transition: opacity 800ms;
  -moz-transition: opacity 800ms;
  -ms-transition: opacity 800ms;
  -o-transition: opacity 800ms;
  transition: opacity 800ms;
}

/* line 249, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area.show .f2f-mc-button:hover:not(.correct):not(.incorrect):not(.hidden) {
  border-color: #00d6ff;
  background: #f3fdff;
  cursor: pointer;
}

/* line 257, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button {
  position: absolute;
  height: 40px;
  width: 198px;
  font-size: 20px;
  color: #323232;
  border: 1px solid #323232;
  border-radius: 22px;
  margin-bottom: 4px;
  line-height: 40px;
  -webkit-transition: opacity 200ms;
  -moz-transition: opacity 200ms;
  -ms-transition: opacity 200ms;
  -o-transition: opacity 200ms;
  transition: opacity 200ms;
}

/* line 269, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.correct, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.correct, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.correct, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.correct, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.correct, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.correct {
  border-color: #00c372;
  background: #ccffd9;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  -ms-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}

/* line 275, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.incorrect, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.incorrect, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.incorrect, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.incorrect, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.incorrect, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.incorrect {
  border-color: #ff4d76;
  background: #ffe3ee;
  opacity: 0.5;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  -ms-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}

/* line 282, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.hidden, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.hidden, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.hidden, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.hidden, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.hidden, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.hidden {
  opacity: 0;
}

/* line 286, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.float, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.float, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.float, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button.float, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button.float, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button.float {
  top: -29px;
  -webkit-transition: all 350ms ease-in;
  -moz-transition: all 350ms ease-in;
  -ms-transition: all 350ms ease-in;
  -o-transition: all 350ms ease-in;
  transition: all 350ms ease-in;
}

/* line 293, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(1):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(1):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(1):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(1):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(1):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(1):not(.float) {
  top: 0px;
}

/* line 293, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(2):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(2):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(2):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(2):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(2):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(2):not(.float) {
  top: 44px;
}

/* line 293, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(3):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(3):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(3):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area .f2f-mc-button:nth-child(3):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area .f2f-mc-button:nth-child(3):not(.float), #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area .f2f-mc-button:nth-child(3):not(.float) {
  top: 88px;
}

/* line 299, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-hundreds-remediation-area {
  top: 286px;
  left: 56px;
}

/* line 304, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-tens-remediation-area {
  top: 92px;
  left: 76px;
}

/* line 309, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-concrete-ones-remediation-area {
  top: 87px;
  left: -12px;
}

/* line 314, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus {
  position: absolute;
  width: 20px;
  height: 20px;
  font-size: 20px;
  background-color: white;
  opacity: 0;
}

/* line 321, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='hundred-one'], #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='hundred-one'] {
  left: 418px;
  top: -24px;
}

/* line 325, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='ten'], #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='ten'] {
  left: -100px;
  top: -23px;
}

/* line 329, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='one'], #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus[data-pv='one'] {
  left: -48px;
  top: -22px;
}

/* line 333, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-concrete-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-mat .f2f-concrete-box .f2f-remediation-plus.show {
  opacity: 1;
  -webkit-transition: opacity 200ms ease-in;
  -moz-transition: opacity 200ms ease-in;
  -ms-transition: opacity 200ms ease-in;
  -o-transition: opacity 200ms ease-in;
  transition: opacity 200ms ease-in;
}

/* line 343, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-hundreds-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-tens-remediation-area, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-ones-remediation-area {
  position: absolute;
  top: 290px;
  font-size: 30px;
  font-weight: 700;
  color: #656565;
}

/* line 349, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-hundreds-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-tens-remediation-area.show, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-concrete-ones-remediation-area.show {
  -webkit-transition: opacity 50ms, top 500ms ease-in-out, left 500ms ease-in-out;
  -moz-transition: opacity 50ms, top 500ms ease-in-out, left 500ms ease-in-out;
  -ms-transition: opacity 50ms, top 500ms ease-in-out, left 500ms ease-in-out;
  -o-transition: opacity 50ms, top 500ms ease-in-out, left 500ms ease-in-out;
  transition: opacity 50ms, top 500ms ease-in-out, left 500ms ease-in-out;
}

/* line 354, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-t2c-text {
  font-size: 30px;
  color: #323232;
  border: 2px solid #323232;
  border-radius: 8px;
  height: 74px;
  width: 900px;
  padding: 15px;
  margin: 10px auto;
  font-weight: 700;
}

/* line 365, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-t2c-text .f2f-text-input-box {
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -o-inline-flex;
  display: inline-flex;
}

/* line 368, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-t2c-text .f2f-text-input-box .f2f-text-input-pv, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-concrete .f2f-t2c-text .f2f-text-input-box .f2f-text-input-plus {
  margin: 0px 10px;
}

/* line 376, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation {
  position: absolute;
  top: 245px;
  left: 0px;
  right: 0px;
}

/* line 382, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation.remediating {
  top: 456px;
  -webkit-transition: top, 250ms;
  -moz-transition: top, 250ms;
  -ms-transition: top, 250ms;
  -o-transition: top, 250ms;
  transition: top, 250ms;
}

/* line 387, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-equal, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-right {
  color: #323232;
  font-size: 30px;
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

/* line 396, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-num, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-pv, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-plus {
  display: inline-block;
  -webkit-transition: color, 500ms;
  -moz-transition: color, 500ms;
  -ms-transition: color, 500ms;
  -o-transition: color, 500ms;
  transition: color, 500ms;
}

/* line 400, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-num.grayed, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-pv.grayed, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-left .f2f-text-input-plus.grayed {
  color: #cbcbcb;
}

/* line 406, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-equal {
  margin-left: 20px;
  margin-right: 20px;
  width: 40px;
  -webkit-transition: color, 500ms;
  -moz-transition: color, 500ms;
  -ms-transition: color, 500ms;
  -o-transition: color, 500ms;
  transition: color, 500ms;
}

/* line 412, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-text-equation .f2f-t2t-equal.grayed {
  color: #cbcbcb;
}

/* line 418, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-box {
  opacity: 0;
}

/* line 421, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-2-text .f2f-concrete-box.show {
  opacity: 1;
  -webkit-transition: opacity, 1000ms;
  -moz-transition: opacity, 1000ms;
  -ms-transition: opacity, 1000ms;
  -o-transition: opacity, 1000ms;
  transition: opacity, 1000ms;
}

/* line 429, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input {
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -o-inline-flex;
  display: inline-flex;
  position: relative;
  background: #656565;
  border-radius: 8px;
}

/* line 435, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input.correct {
  background: #00c372;
}

/* line 439, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input.grayed {
  background: #cbcbcb;
}

/* line 442, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input.grayed .f2f-text-input-box {
  color: #cbcbcb;
  border-color: #e4e4e4;
  -webkit-transition: color, 500ms;
  -moz-transition: color, 500ms;
  -ms-transition: color, 500ms;
  -o-transition: color, 500ms;
  transition: color, 500ms;
  -webkit-transition: border-color, 500ms;
  -moz-transition: border-color, 500ms;
  -ms-transition: border-color, 500ms;
  -o-transition: border-color, 500ms;
  transition: border-color, 500ms;
}

/* line 450, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box {
  position: relative;
  top: 0px;
  color: #323232;
  font-size: 30px;
  font-weight: bold;
  background: white;
  border: 2px solid #656565;
  border-radius: 8px;
  height: 82px;
  width: auto;
  display: -webkit-inline-flex;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -o-inline-flex;
  display: inline-flex;
  padding-top: 10px;
  padding-left: 20px;
  padding-right: 20px;
}

/* line 466, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box.activate {
  -webkit-animation: bounceUp 1000ms;
  -moz-animation: bounceUp 1000ms;
  -ms-animation: bounceUp 1000ms;
  -o-animation: bounceUp 1000ms;
  animation: bounceUp 1000ms;
  top: -10px;
}

/* line 471, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box.deactivate {
  -webkit-animation: bounceDown 1000ms;
  -moz-animation: bounceDown 1000ms;
  -ms-animation: bounceDown 1000ms;
  -o-animation: bounceDown 1000ms;
  animation: bounceDown 1000ms;
  top: 0px;
}

/* line 476, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box.clickable {
  cursor: pointer;
}

/* line 480, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box.correct {
  border-color: #00c372;
  background: #ccffd9;
}

/* line 485, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num {
  color: #323232;
  height: 60px;
  width: 85px;
  font-size: 30px;
  border: 2px solid transparent;
  border-radius: 10px;
  padding-top: 8px;
}

/* line 494, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.off {
  border-color: #cbcbcb;
}

/* line 498, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.available {
  border-color: #00d6ff;
  cursor: pointer;
}

/* line 503, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.grayed {
  border-color: #e4e4e4;
  background: #e4e4e4;
}

/* line 508, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.try-again {
  border-color: #ff4d76;
  background: #ffe3ee;
}

/* line 513, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.correct {
  border-color: #00c372;
  background: #ccffd9;
}

/* line 518, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.correct-done {
  border-color: transparent;
  background: transparent;
}

/* line 523, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-num.incorrect {
  border-color: #ff4d76;
  background: #ff4d76;
  color: white;
}

/* line 530, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-pv, #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-plus {
  margin-top: 10px;
  margin-left: 10px;
  margin-right: 10px;
}

/* line 536, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-pv {
  text-align: left;
}

/* line 539, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-pv[data-pv="hundred"] {
  width: 140px;
}

/* line 543, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-pv[data-pv="ten"], #number-sense-activity .tasks-page .form-2-form.number-sense-task-group .f2f-text-input .f2f-text-input-box .f2f-text-input-pv[data-pv="one"] {
  width: 70px;
}

/* line 552, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button .ns-video-button-image {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/teacher_images/f2f.jpg");
}

/* line 555, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button.upper {
  bottom: 480px;
}

/* line 559, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button:not(.expanded) .ns-video-button-image {
  background-position: -59px -2px;
}

/* line 563, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button.expanded {
  bottom: 53px;
}

/* line 566, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button.expanded .ns-video-button-image {
  bottom: 61px;
  background-position: -148px 0px;
}

/* line 571, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-button.expanded.rectify .ns-video-button-image {
  background-position: -40px 0px;
}

/* line 576, app/assets/stylesheets/number_sense_activities/form_2_form.scss */
#number-sense-activity .tasks-page .form-2-form.number-sense-task-group .ns-video .ns-video-player {
  bottom: 53px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes waveShallow {
  10% {
    opacity: 0.9;
  }
  40% {
    left: 587px;
  }
  60% {
    left: 637px;
  }
  70% {
    opacity: 0;
  }
}

@-moz-keyframes waveShallow {
  10% {
    opacity: 0.9;
  }
  40% {
    left: 587px;
  }
  60% {
    left: 637px;
  }
  70% {
    opacity: 0;
  }
}

@-o-keyframes waveShallow {
  10% {
    opacity: 0.9;
  }
  40% {
    left: 587px;
  }
  60% {
    left: 637px;
  }
  70% {
    opacity: 0;
  }
}

@keyframes waveShallow {
  10% {
    opacity: 0.9;
  }
  40% {
    left: 587px;
  }
  60% {
    left: 637px;
  }
  70% {
    opacity: 0;
  }
}

@-webkit-keyframes waveMedium {
  40% {
    left: 696px;
  }
  60% {
    left: 716px;
  }
}

@-moz-keyframes waveMedium {
  40% {
    left: 696px;
  }
  60% {
    left: 716px;
  }
}

@-o-keyframes waveMedium {
  40% {
    left: 696px;
  }
  60% {
    left: 716px;
  }
}

@keyframes waveMedium {
  40% {
    left: 696px;
  }
  60% {
    left: 716px;
  }
}

@-webkit-keyframes lilypadGrow {
  0% {
    top: 30px;
    left: 30px;
    width: 10px;
    height: 9px;
  }
  20% {
    top: -6px;
    left: -6px;
    width: 82px;
    height: 74px;
  }
  40% {
    top: 3px;
    left: 3px;
    width: 61px;
    height: 59px;
  }
  60% {
    top: -2px;
    left: -2px;
    width: 71px;
    height: 65px;
  }
  80% {
    top: 1px;
    left: 1px;
    width: 66px;
    height: 60px;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 69px;
    height: 64px;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
}

@-moz-keyframes lilypadGrow {
  0% {
    top: 30px;
    left: 30px;
    width: 10px;
    height: 9px;
  }
  20% {
    top: -6px;
    left: -6px;
    width: 82px;
    height: 74px;
  }
  40% {
    top: 3px;
    left: 3px;
    width: 61px;
    height: 59px;
  }
  60% {
    top: -2px;
    left: -2px;
    width: 71px;
    height: 65px;
  }
  80% {
    top: 1px;
    left: 1px;
    width: 66px;
    height: 60px;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 69px;
    height: 64px;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
}

@-o-keyframes lilypadGrow {
  0% {
    top: 30px;
    left: 30px;
    width: 10px;
    height: 9px;
  }
  20% {
    top: -6px;
    left: -6px;
    width: 82px;
    height: 74px;
  }
  40% {
    top: 3px;
    left: 3px;
    width: 61px;
    height: 59px;
  }
  60% {
    top: -2px;
    left: -2px;
    width: 71px;
    height: 65px;
  }
  80% {
    top: 1px;
    left: 1px;
    width: 66px;
    height: 60px;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 69px;
    height: 64px;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
}

@keyframes lilypadGrow {
  0% {
    top: 30px;
    left: 30px;
    width: 10px;
    height: 9px;
  }
  20% {
    top: -6px;
    left: -6px;
    width: 82px;
    height: 74px;
  }
  40% {
    top: 3px;
    left: 3px;
    width: 61px;
    height: 59px;
  }
  60% {
    top: -2px;
    left: -2px;
    width: 71px;
    height: 65px;
  }
  80% {
    top: 1px;
    left: 1px;
    width: 66px;
    height: 60px;
  }
  100% {
    top: 0px;
    left: 0px;
    width: 69px;
    height: 64px;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
}

@-webkit-keyframes whitePulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

@-moz-keyframes whitePulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

@-o-keyframes whitePulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

@keyframes whitePulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
  10% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(3);
    -moz-transform: scale(3);
    -ms-transform: scale(3);
    -o-transform: scale(3);
    transform: scale(3);
    opacity: 0;
  }
}

/* line 109, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group {
  background-color: #f9e5b6;
  height: 590px;
}

/* line 113, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  white-space: nowrap;
}

/* line 121, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river.pan-task {
  -webkit-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
  transition: top 1000ms ease-in-out, left 1000ms ease-in-out;
}

/* line 125, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river.pan-intro {
  -webkit-transition: top 2000ms ease-in-out, left 2000ms ease-in-out;
  -moz-transition: top 2000ms ease-in-out, left 2000ms ease-in-out;
  -ms-transition: top 2000ms ease-in-out, left 2000ms ease-in-out;
  -o-transition: top 2000ms ease-in-out, left 2000ms ease-in-out;
  transition: top 2000ms ease-in-out, left 2000ms ease-in-out;
}

/* line 131, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container {
  position: relative;
  top: 0px;
  left: 0px;
  margin: 0;
}

/* line 139, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .number {
  color: transparent;
}

/* line 144, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell.tile-destination-slot .sinkhole-image {
  cursor: default;
}

/* line 148, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell.tile-destination-slot.active .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell.tile-destination-slot:hover .sinkhole-image .sinkhole-border {
  stroke: transparent;
}

/* line 152, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell.tile-destination-slot .frog-input {
  display: none;
}

/* line 155, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell.tile-destination-slot .fillin-watershadow {
  opacity: 0;
}

/* line 160, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container.intro .tiles-repo {
  display: none;
}

/* line 165, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .task-header, .frog-river.number-sense-task-group .river .frog-pond.task-container .task {
  margin: 0;
}

/* line 169, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container {
  position: absolute;
  bottom: 130px;
  height: 460px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 176, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section {
  width: 960px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 180, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .inlet {
  margin-right: -20px;
}

/* line 183, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .inlet .inlet-stream {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/inlet.svg");
  height: 50px;
}

/* line 189, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .outlet {
  margin-left: -20px;
}

/* line 192, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .outlet .outlet-stream {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/outlet.svg");
  height: 50px;
}

/* line 198, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .inlet, .frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .outlet {
  overflow: hidden;
  -webkit-flex-grow: 1;
  flex-grow: 1;
  -webkit-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -moz-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -ms-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -o-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
}

/* line 203, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .inlet.upper, .frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .outlet.upper {
  -webkit-align-self: flex-start;
  -moz-align-self: flex-start;
  -ms-align-self: flex-start;
  -o-align-self: flex-start;
  align-self: flex-start;
  margin-top: 2px;
}

/* line 208, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .inlet.lower, .frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .outlet.lower {
  -webkit-align-self: flex-end;
  -moz-align-self: flex-end;
  -ms-align-self: flex-end;
  -o-align-self: flex-end;
  align-self: flex-end;
  margin-bottom: 2px;
}

/* line 214, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond {
  -webkit-flex-grow: 0;
  flex-grow: 0;
  position: relative;
}

/* line 218, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .highlight {
  position: absolute;
  z-index: 6;
  width: 69px;
  height: 64px;
  border-radius: 8px;
  background-color: #ffe919;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 227, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .highlight.hidden {
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
  opacity: 0;
}

/* line 233, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/bug.svg");
  background-size: 43px 40px;
  width: 43px;
  height: 40px;
  position: absolute;
  z-index: 5;
  opacity: 0;
}

/* line 239, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug[data-num='1'], .frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug[data-num='3'] {
  -webkit-transform: rotate(2deg);
  -moz-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  -o-transform: rotate(2deg);
  transform: rotate(2deg);
}

/* line 243, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug[data-num='2'], .frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug[data-num='4'] {
  -webkit-transform: rotate(2deg) scaleX(-1);
  -moz-transform: rotate(2deg) scaleX(-1);
  -ms-transform: rotate(2deg) scaleX(-1);
  -o-transform: rotate(2deg) scaleX(-1);
  transform: rotate(2deg) scaleX(-1);
}

/* line 247, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .bug.eating {
  -webkit-transition: all 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -moz-transition: all 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -ms-transition: all 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -o-transition: all 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  transition: all 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
}

/* line 252, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer {
  padding: 75px 22px;
}

/* line 256, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer .bug[data-num='1'] {
  top: 20px;
  left: calc(15% + 22px);
}

/* line 260, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer .bug[data-num='2'] {
  top: calc(100% - 60px);
  left: calc(75% - 65px);
}

/* line 264, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer .bug[data-num='3'] {
  top: calc(100% - 60px);
  left: calc(10% + 22px);
}

/* line 268, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer .bug[data-num='4'] {
  top: 20px;
  left: calc(80% - 65px);
}

/* line 275, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer-side {
  padding: 11px 97px;
}

/* line 279, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer-side .bug[data-num='1'] {
  top: calc(15% + 11px);
  left: 30px;
}

/* line 283, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer-side .bug[data-num='2'] {
  top: calc(75% - 51px);
  left: calc(100% - 73px);
}

/* line 287, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer-side .bug[data-num='3'] {
  top: calc(90% - 51px);
  left: 30px;
}

/* line 291, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond.buffer-side .bug[data-num='4'] {
  top: calc(20% + 11px);
  left: calc(100% - 73px);
}

/* line 298, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .pond-fill {
  background: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/pond.svg") center no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  -webkit-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -moz-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -ms-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -o-transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  transition: filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
}

/* line 309, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .problem-grid {
  display: table;
  border-spacing: 6px 2px;
}

/* line 313, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .problem-grid .problem-row {
  display: table-row;
}

/* line 316, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.task-container .river-section-container .river-section .pond .problem-grid .problem-row .problem-cell {
  display: table-cell;
  position: relative;
  width: 69px;
  height: 64px;
  min-width: 69px;
  min-height: 64px;
  max-width: 69px;
  max-height: 64px;
  vertical-align: middle;
}

/* line 336, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost {
  position: absolute;
  bottom: 75px;
  right: 70px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost[data-img='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/sign_0.svg");
  background-size: 120px 125px;
  width: 120px;
  height: 125px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost[data-img='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/sign_1.svg");
  background-size: 120px 125px;
  width: 120px;
  height: 125px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost[data-img='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/sign_2.svg");
  background-size: 120px 125px;
  width: 120px;
  height: 125px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost[data-img='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/sign_3.svg");
  background-size: 120px 125px;
  width: 120px;
  height: 125px;
}

/* line 347, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .signpost canvas {
  position: relative;
  width: 65px;
  height: 45px;
  top: 17px;
  left: -5px;
  z-index: 1;
}

/* line 359, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .number {
  font-size: 30px;
  font-weight: bold;
  position: relative;
  color: #323232;
  z-index: 2;
}

/* line 369, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .problem-cell.highlight-num .number, .frog-river.number-sense-task-group .river .problem-cell.highlight-num .lilypad.correct .number {
  -webkit-transition: color 500ms ease-in;
  -moz-transition: color 500ms ease-in;
  -ms-transition: color 500ms ease-in;
  -o-transition: color 500ms ease-in;
  transition: color 500ms ease-in;
  color: #f6f6f6;
}

/* line 375, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .problem-cell:not(.highlight-num) .number, .frog-river.number-sense-task-group .river .problem-cell:not(.highlight-num) .lilypad.correct .number {
  -webkit-transition: color 500ms ease-out;
  -moz-transition: color 500ms ease-out;
  -ms-transition: color 500ms ease-out;
  -o-transition: color 500ms ease-out;
  transition: color 500ms ease-out;
}

/* line 383, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .sinkhole-image .sinkhole-border {
  stroke: transparent;
}

/* line 389, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.active:not(.ui-droppable-disabled) .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .tile-destination-slot:not(.ui-droppable-disabled):not(.active) .rock + .sinkhole-image .sinkhole-border {
  -webkit-transition: stroke 250ms ease-in-out 250ms;
  -moz-transition: stroke 250ms ease-in-out 250ms;
  -ms-transition: stroke 250ms ease-in-out 250ms;
  -o-transition: stroke 250ms ease-in-out 250ms;
  transition: stroke 250ms ease-in-out 250ms;
}

/* line 394, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.active:not(.ui-droppable-disabled) .rock + .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .tile-destination-slot:not(.ui-droppable-disabled):hover .rock + .sinkhole-image .sinkhole-border {
  stroke: transparent;
}

/* line 397, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.active:not(.ui-droppable-disabled) .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .tile-destination-slot:not(.ui-droppable-disabled):hover .sinkhole-image .sinkhole-border {
  stroke: white;
}

/* line 406, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot:not(.unrevealed):not(.correct-tile):not(.ui-droppable-disabled) {
  cursor: pointer;
}

/* line 413, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input, .frog-river.number-sense-task-group .river .fillin-watershadow {
  position: absolute;
}

/* line 416, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input {
  top: 6px;
  left: 3px;
  min-width: 66px;
  max-width: 66px;
  height: 58px;
  line-height: 48px;
  font-size: 30px;
  font-weight: bold;
  z-index: 3;
}

/* line 428, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input.zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 10px;
}

/* line 432, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input:not(.incorrect):not(.try-again) {
  background-color: white;
  border-color: #169be6;
}

/* line 438, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input.fade-out, .frog-river.number-sense-task-group .river .frog-input.fade-out + .fillin-watershadow {
  opacity: 0;
  -webkit-transition: opacity 500ms ease-out;
  -moz-transition: opacity 500ms ease-out;
  -ms-transition: opacity 500ms ease-out;
  -o-transition: opacity 500ms ease-out;
  transition: opacity 500ms ease-out;
}

/* line 443, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input:not(.inactive):not(.fade-out) + .fillin-watershadow {
  opacity: 0.75;
}

/* line 445, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-input:not(.inactive):not(.fade-out) + .fillin-watershadow path {
  fill: white;
}

/* line 451, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .fillin-watershadow {
  top: 0px;
  width: 69px;
  height: 64px;
}

/* line 457, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad {
  width: 100%;
  height: 100%;
  line-height: 64px;
}

/* line 462, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad .lilypad-image {
  position: absolute;
  top: 0px;
  left: 0px;
}

/* line 468, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.growable {
  position: absolute;
  top: 0px;
  z-index: 1;
}

/* line 473, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.growable .number {
  opacity: 0;
}

/* line 477, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.growable .lilypad-image svg {
  position: absolute;
  opacity: 0;
}

/* line 483, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.above {
  z-index: 7;
}

/* line 486, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.above .lilypad-image, .frog-river.number-sense-task-group .river .lilypad.above .flower {
  z-index: 7;
}

/* line 490, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad.above .number {
  z-index: 9;
}

/* line 495, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad .flower {
  position: absolute;
  top: 1px;
  left: 3px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/flower.svg");
  background-size: 64px 63px;
  width: 64px;
  height: 63px;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform 500ms cubic-bezier(0.35, 2.53, 0.22, 0.52);
  -moz-transition: -moz-transform 500ms cubic-bezier(0.35, 2.53, 0.22, 0.52);
  -o-transition: -o-transform 500ms cubic-bezier(0.35, 2.53, 0.22, 0.52);
  transition: transform 500ms cubic-bezier(0.35, 2.53, 0.22, 0.52);
}

/* line 503, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad .flower.shrink {
  -webkit-transform: scale(0.24);
  -moz-transform: scale(0.24);
  -ms-transform: scale(0.24);
  -o-transform: scale(0.24);
  transform: scale(0.24);
}

/* line 507, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad .flower.disappear {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transition: -webkit-transform 300ms cubic-bezier(0, 0.98, 0.1, 1);
  -moz-transition: -moz-transform 300ms cubic-bezier(0, 0.98, 0.1, 1);
  -o-transition: -o-transform 300ms cubic-bezier(0, 0.98, 0.1, 1);
  transition: transform 300ms cubic-bezier(0, 0.98, 0.1, 1);
}

/* line 513, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .lilypad .pulse {
  position: absolute;
  top: 7px;
  left: 10px;
  width: 50px;
  height: 50px;
  background-color: white;
  border-radius: 50%;
  -webkit-animation: whitePulse 1000ms ease-in-out;
  -moz-animation: whitePulse 1000ms ease-in-out;
  -ms-animation: whitePulse 1000ms ease-in-out;
  -o-animation: whitePulse 1000ms ease-in-out;
  animation: whitePulse 1000ms ease-in-out;
}

/* line 528, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .sinkhole-image, .frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .rock, .frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .frog-input, .frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .fillin-watershadow {
  opacity: 0;
  -webkit-transition: opacity 166ms ease-in-out;
  -moz-transition: opacity 166ms ease-in-out;
  -ms-transition: opacity 166ms ease-in-out;
  -o-transition: opacity 166ms ease-in-out;
  transition: opacity 166ms ease-in-out;
}

/* line 535, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .lilypad .number, .frog-river.number-sense-task-group .river .lilypad.grow .number {
  top: 0px;
  opacity: 1;
}

/* line 540, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tile-destination-slot.correct-tile .lilypad .lilypad-image svg, .frog-river.number-sense-task-group .river .lilypad.grow .lilypad-image svg {
  opacity: 1;
  -webkit-transition: opacity 200ms ease-in-out;
  -moz-transition: opacity 200ms ease-in-out;
  -ms-transition: opacity 200ms ease-in-out;
  -o-transition: opacity 200ms ease-in-out;
  transition: opacity 200ms ease-in-out;
  -webkit-animation: lilypadGrow 833ms ease-in-out 100ms;
  -moz-animation: lilypadGrow 833ms ease-in-out 100ms;
  -ms-animation: lilypadGrow 833ms ease-in-out 100ms;
  -o-animation: lilypadGrow 833ms ease-in-out 100ms;
  animation: lilypadGrow 833ms ease-in-out 100ms;
}

/* line 547, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tiles-repo {
  position: relative;
  display: inline-block;
  top: 465px;
  height: 64px;
}

/* line 553, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tiles-repo .tile-origin-slot {
  display: inline-block;
  width: 69px;
  height: 64px;
  position: relative;
  margin: 0px 3px;
}

/* line 560, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tiles-repo .tile-origin-slot .sand-divot {
  position: relative;
  margin: auto;
  top: 20px;
  opacity: 1;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/sand-divot.svg");
  background-size: 37px 33px;
  width: 37px;
  height: 33px;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 567, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .tiles-repo .tile-origin-slot .sand-divot.hide {
  opacity: 0;
}

/* line 574, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock {
  position: absolute;
  z-index: 3;
  width: 69px;
  height: 64px;
  top: 0px;
  left: 0px;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 583, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock .rock-image {
  position: absolute;
  top: 0px;
  left: 0px;
}

/* line 588, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock .rock-image .rock-outline {
  fill: transparent;
}

/* line 594, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.watershadow .rock-outline {
  fill: #0097b6;
}

/* line 599, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock .number {
  top: 13px;
}

/* line 604, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .rock-outline {
  fill: #ff4d76;
}

/* line 607, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .large-rock-shape {
  fill: #cc9faa;
}

/* line 610, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .medium-rock-shape {
  fill: #d8abb6;
}

/* line 613, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .small-rock-shape {
  fill: #e1b4bf;
}

/* line 618, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.incorrect-tile {
  color: white;
}

/* line 621, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.incorrect-tile .rock-outline {
  fill: #ff4d76;
}

/* line 624, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.incorrect-tile .large-rock-shape {
  fill: #bb3856;
}

/* line 627, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.incorrect-tile .medium-rock-shape {
  fill: #cc3d5e;
}

/* line 630, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.incorrect-tile .small-rock-shape {
  fill: #d84163;
}

/* line 636, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.dark .large-rock-shape {
  fill: #4a4a4a;
}

/* line 639, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.dark .medium-rock-shape {
  fill: #686868;
}

/* line 642, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.dark .small-rock-shape {
  fill: #787878;
}

/* line 648, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .number, .frog-river.number-sense-task-group .river .rock.incorrect-tile .number {
  -webkit-transition: color 200ms ease-in-out;
  -moz-transition: color 200ms ease-in-out;
  -ms-transition: color 200ms ease-in-out;
  -o-transition: color 200ms ease-in-out;
  transition: color 200ms ease-in-out;
}

/* line 651, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.try-again .rock-outline, .frog-river.number-sense-task-group .river .rock.try-again .large-rock-shape, .frog-river.number-sense-task-group .river .rock.try-again .medium-rock-shape, .frog-river.number-sense-task-group .river .rock.try-again .small-rock-shape, .frog-river.number-sense-task-group .river .rock.incorrect-tile .rock-outline, .frog-river.number-sense-task-group .river .rock.incorrect-tile .large-rock-shape, .frog-river.number-sense-task-group .river .rock.incorrect-tile .medium-rock-shape, .frog-river.number-sense-task-group .river .rock.incorrect-tile .small-rock-shape {
  -webkit-transition: stroke 200ms ease-in-out, fill 200ms ease-in-out;
  -moz-transition: stroke 200ms ease-in-out, fill 200ms ease-in-out;
  -ms-transition: stroke 200ms ease-in-out, fill 200ms ease-in-out;
  -o-transition: stroke 200ms ease-in-out, fill 200ms ease-in-out;
  transition: stroke 200ms ease-in-out, fill 200ms ease-in-out;
}

/* line 656, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.moving {
  -webkit-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -moz-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -ms-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -o-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  transition: top 500ms ease-in-out, left 500ms ease-in-out;
}

/* line 661, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.flying .number {
  -webkit-transition: color 500ms ease-in-out;
  -moz-transition: color 500ms ease-in-out;
  -ms-transition: color 500ms ease-in-out;
  -o-transition: color 500ms ease-in-out;
  transition: color 500ms ease-in-out;
}

/* line 664, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.flying .rock-outline, .frog-river.number-sense-task-group .river .rock.flying .large-rock-shape, .frog-river.number-sense-task-group .river .rock.flying .medium-rock-shape, .frog-river.number-sense-task-group .river .rock.flying .small-rock-shape {
  -webkit-transition: stroke 500ms ease-in-out, fill 500ms ease-in-out;
  -moz-transition: stroke 500ms ease-in-out, fill 500ms ease-in-out;
  -ms-transition: stroke 500ms ease-in-out, fill 500ms ease-in-out;
  -o-transition: stroke 500ms ease-in-out, fill 500ms ease-in-out;
  transition: stroke 500ms ease-in-out, fill 500ms ease-in-out;
}

/* line 669, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock.hide {
  opacity: 0;
}

/* line 673, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock:not(.disabled) {
  cursor: pointer;
}

/* line 678, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .rock:hover:not(.disabled):not(.try-again):not(.incorrect-tile):not(.flying) .rock-outline {
  fill: #007b94;
}

/* line 685, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.fill-in .tile-origin-slot, .frog-river.number-sense-task-group .river .frog-pond.gradual .tile-origin-slot {
  opacity: 0;
  top: 130px;
}

/* line 689, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.fill-in .tile-origin-slot.rise, .frog-river.number-sense-task-group .river .frog-pond.gradual .tile-origin-slot.rise {
  opacity: 1;
  top: 0px;
  -webkit-transition: top 500ms ease-in-out;
  -moz-transition: top 500ms ease-in-out;
  -ms-transition: top 500ms ease-in-out;
  -o-transition: top 500ms ease-in-out;
  transition: top 500ms ease-in-out;
}

/* line 698, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 700, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 702, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot:not(.ui-droppable-disabled) {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 707, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell .lilypad.growable.grow:not(.correct) .number, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot:not(.ui-droppable-disabled) .lilypad.growable.grow:not(.correct) .number {
  -webkit-transition: color 500ms ease-in-out, opacity 800ms ease-in-out;
  -moz-transition: color 500ms ease-in-out, opacity 800ms ease-in-out;
  -ms-transition: color 500ms ease-in-out, opacity 800ms ease-in-out;
  -o-transition: color 500ms ease-in-out, opacity 800ms ease-in-out;
  transition: color 500ms ease-in-out, opacity 800ms ease-in-out;
}

/* line 712, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell .frog-input:not(.fade-out):not(.correct),
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell .frog-input:not(.fade-out):not(.correct) + .fillin-watershadow, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot:not(.ui-droppable-disabled) .frog-input:not(.fade-out):not(.correct),
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot:not(.ui-droppable-disabled) .frog-input:not(.fade-out):not(.correct) + .fillin-watershadow {
  -webkit-transition: opacity 500ms ease-in-out 100ms;
  -moz-transition: opacity 500ms ease-in-out 100ms;
  -ms-transition: opacity 500ms ease-in-out 100ms;
  -o-transition: opacity 500ms ease-in-out 100ms;
  transition: opacity 500ms ease-in-out 100ms;
}

/* line 718, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell .sinkhole-image, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot:not(.ui-droppable-disabled) .sinkhole-image {
  position: absolute;
  top: 4px;
}

/* line 724, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed:not(.active):not(.correct-tile), .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled):not(.active):not(.correct-tile) {
  cursor: default;
}

/* line 728, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed.active .sinkhole-image, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed:hover .sinkhole-image, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed.active:not(.ui-droppable-disabled) .sinkhole-image, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled):hover .sinkhole-image {
  cursor: default;
}

/* line 730, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed.active .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed:hover .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed.active:not(.ui-droppable-disabled) .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled):hover .sinkhole-image .sinkhole-border {
  stroke: transparent;
}

/* line 735, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed .sinkhole-image, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled) .sinkhole-image {
  opacity: 1;
  cursor: default;
}

/* line 738, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed .sinkhole-image .sinkhole-border, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled) .sinkhole-image .sinkhole-border {
  stroke: transparent;
}

/* line 742, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed .lilypad, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed .frog-input:not(.correct),
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.unrevealed .frog-input:not(.correct) + .fillin-watershadow, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled) .lilypad, .frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled) .frog-input:not(.correct),
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid .problem-row .problem-cell.tile-destination-slot.unrevealed:not(.ui-droppable-disabled) .frog-input:not(.correct) + .fillin-watershadow {
  opacity: 0;
}

/* line 749, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid.reverse {
  -webkit-flex-direction: column-reverse;
  -moz-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  -o-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

/* line 751, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid.reverse .problem-row {
  -webkit-flex-direction: row-reverse;
  -moz-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  -o-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

/* line 753, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.gradual.task-container .river-section-container .river-section .problem-grid.reverse .problem-row .problem-cell {
  margin: 1px 3px;
}

/* line 763, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 4;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/frog.svg");
  background-size: 58px 72px;
  width: 58px;
  height: 72px;
  -webkit-transition: top 1000ms ease-in-out, left 1000ms ease-in-out, filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out, left 1000ms ease-in-out, filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out, left 1000ms ease-in-out, filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  -o-transition: top 1000ms ease-in-out, left 1000ms ease-in-out, filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
  transition: top 1000ms ease-in-out, left 1000ms ease-in-out, filter 500ms ease-in-out, -webkit-filter 500ms ease-in-out;
}

/* line 772, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog.eating {
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/frog_eating.svg");
  background-size: 58px 72px;
  width: 58px;
  height: 72px;
}

/* line 776, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog .tongue {
  position: absolute;
  top: 18px;
  left: 24px;
  background: #ff9999;
  width: 0px;
  height: 9px;
  -webkit-transform-origin: 0 100%;
  -moz-transform-origin: 0 100%;
  -ms-transform-origin: 0 100%;
  -o-transform-origin: 0 100%;
  transform-origin: 0 100%;
  border-radius: 5px;
  -webkit-transition: width 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -moz-transition: width 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -ms-transition: width 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  -o-transition: width 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
  transition: width 500ms cubic-bezier(0.11, 1.12, 0.09, 1);
}

/* line 787, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog .tongue.eating {
  -webkit-transition: width 500ms cubic-bezier(0, 0.82, 0.44, 0.99);
  -moz-transition: width 500ms cubic-bezier(0, 0.82, 0.44, 0.99);
  -ms-transition: width 500ms cubic-bezier(0, 0.82, 0.44, 0.99);
  -o-transition: width 500ms cubic-bezier(0, 0.82, 0.44, 0.99);
  transition: width 500ms cubic-bezier(0, 0.82, 0.44, 0.99);
}

/* line 795, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frost {
  width: 100%;
  height: 100%;
  background-color: white;
  position: absolute;
  top: 0px;
  opacity: 0;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 806, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .frost {
  z-index: 5;
  opacity: 0.5;
}

/* line 810, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .sinkhole-image {
  z-index: 6;
}

/* line 813, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .lilypad {
  z-index: 7;
}

/* line 815, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .lilypad .lilypad-image {
  z-index: 7;
}

/* line 819, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .rock {
  z-index: 8;
}

/* line 821, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .rock .rock-outline, .frog-river.number-sense-task-group .river .frog-pond.remediating .rock .large-rock-shape, .frog-river.number-sense-task-group .river .frog-pond.remediating .rock .medium-rock-shape, .frog-river.number-sense-task-group .river .frog-pond.remediating .rock .small-rock-shape {
  -webkit-transition: fill 500ms ease-in-out, stroke 1000ms ease-in-out;
  -moz-transition: fill 500ms ease-in-out, stroke 1000ms ease-in-out;
  -ms-transition: fill 500ms ease-in-out, stroke 1000ms ease-in-out;
  -o-transition: fill 500ms ease-in-out, stroke 1000ms ease-in-out;
  transition: fill 500ms ease-in-out, stroke 1000ms ease-in-out;
}

/* line 825, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating .number {
  z-index: 9;
}

/* line 828, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.remediating ~ .frog, .frog-river.number-sense-task-group .river .frog-pond.remediating .pond-fill, .frog-river.number-sense-task-group .river .frog-pond.remediating .inlet, .frog-river.number-sense-task-group .river .frog-pond.remediating .outlet, .frog-river.number-sense-task-group .river .frog-pond.remediating .signpost {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 834, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.autocorrect .frost {
  z-index: 5;
  opacity: 0.9;
}

/* line 838, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.autocorrect .equation-area {
  z-index: 7;
}

/* line 841, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .frog-pond.autocorrect ~ .frog, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .pond-fill, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .inlet, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .outlet, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .signpost, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .bug, .frog-river.number-sense-task-group .river .frog-pond.autocorrect .lilypad:not(.above) {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  /* line 846, app/assets/stylesheets/number_sense_activities/frog_river.scss */
  .frog-river.number-sense-task-group .river .frog-pond.autocorrect .lilypad:not(.above) {
    -webkit-filter: none;
    -moz-filter: none;
    -ms-filter: none;
    -o-filter: none;
    filter: none;
  }
}

@supports (-ms-accelerator: true) {
  /* line 852, app/assets/stylesheets/number_sense_activities/frog_river.scss */
  .frog-river.number-sense-task-group .river .frog-pond.autocorrect .lilypad:not(.above) {
    -webkit-filter: none;
    -moz-filter: none;
    -ms-filter: none;
    -o-filter: none;
    filter: none;
  }
}

/* line 860, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area {
  position: absolute;
  top: 460px;
  width: 100%;
  z-index: 3;
  opacity: 1;
  font-size: 30px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-weight: bold;
  -webkit-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, top 300ms ease-in-out;
}

/* line 871, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area.slide-down {
  top: 480px;
  opacity: 0;
  z-index: 0;
}

/* line 877, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area .zearn-input {
  min-width: 66px;
  height: 58px;
  font-size: 30px;
  font-weight: bold;
  padding-top: 5px;
}

/* line 884, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area .zearn-input:not(.correct):not(.correct-done):not(.try-again):not(.incorrect):not(.incorrect-done):not(.unknown) {
  background-color: white;
}

/* line 889, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 10px;
}

/* line 893, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .equation-area .zearn-input.correct, .frog-river.number-sense-task-group .river .equation-area .zearn-input.try-again, .frog-river.number-sense-task-group .river .equation-area .zearn-input.incorrect, .frog-river.number-sense-task-group .river .equation-area .zearn-input.highlight, .frog-river.number-sense-task-group .river .equation-area .zearn-input.unknown {
  -webkit-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -moz-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -ms-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  -o-transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
  transition: background-color 300ms ease-in-out, border 300ms ease-in-out, color 300ms ease-in-out;
}

/* line 901, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening {
  width: 100%;
  height: 100%;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

/* line 908, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .title, .frog-river.number-sense-task-group .river .opening .party, .frog-river.number-sense-task-group .river .opening .ocean-shall, .frog-river.number-sense-task-group .river .opening .ocean-med, .frog-river.number-sense-task-group .river .opening .ocean-deep {
  position: absolute;
}

/* line 912, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .title {
  top: 280px;
  left: 223px;
  z-index: 3;
  opacity: 1;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/title2.svg");
  background-size: 416px 137px;
  width: 416px;
  height: 137px;
}

/* line 919, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .title.fade-out {
  opacity: 0;
  -webkit-transition: opacity 1000ms ease-out;
  -moz-transition: opacity 1000ms ease-out;
  -ms-transition: opacity 1000ms ease-out;
  -o-transition: opacity 1000ms ease-out;
  transition: opacity 1000ms ease-out;
}

/* line 925, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ns-welcome {
  z-index: 4;
}

/* line 927, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ns-welcome .ns-welcome-button {
  top: 305px;
  left: 665px;
  width: 86px;
  height: 86px;
}

/* line 933, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ns-welcome .ns-welcome-button.fade-out {
  -webkit-transition: opacity 1000ms ease-out;
  -moz-transition: opacity 1000ms ease-out;
  -ms-transition: opacity 1000ms ease-out;
  -o-transition: opacity 1000ms ease-out;
  transition: opacity 1000ms ease-out;
  opacity: 0;
}

/* line 940, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .party {
  top: -40px;
  z-index: 2;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/party.svg");
  background-size: 816px 652px;
  width: 816px;
  height: 652px;
}

/* line 946, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ocean-shall {
  top: -56px;
  left: 716px;
  z-index: 0;
  opacity: 0;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/ocean_shall.svg");
  background-size: 536px 722px;
  width: 536px;
  height: 722px;
  -webkit-animation: waveShallow 5000ms infinite ease-in-out;
  -moz-animation: waveShallow 5000ms infinite ease-in-out;
  -ms-animation: waveShallow 5000ms infinite ease-in-out;
  -o-animation: waveShallow 5000ms infinite ease-in-out;
  animation: waveShallow 5000ms infinite ease-in-out;
}

/* line 955, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ocean-med {
  top: -66px;
  left: 716px;
  z-index: 1;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/ocean_med.svg");
  background-size: 536px 722px;
  width: 536px;
  height: 722px;
  -webkit-animation: waveMedium 5000ms infinite ease-in-out;
  -moz-animation: waveMedium 5000ms infinite ease-in-out;
  -ms-animation: waveMedium 5000ms infinite ease-in-out;
  -o-animation: waveMedium 5000ms infinite ease-in-out;
  animation: waveMedium 5000ms infinite ease-in-out;
}

/* line 963, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .ocean-deep {
  top: -66px;
  left: 830px;
  z-index: 2;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/complete_a_sequence/ocean_deep.svg");
  background-size: 536px 722px;
  width: 536px;
  height: 722px;
}

/* line 970, app/assets/stylesheets/number_sense_activities/frog_river.scss */
.frog-river.number-sense-task-group .river .opening .fluency-complete-buttons {
  display: none;
  position: absolute;
  top: 90px;
  left: 286px;
  z-index: 4;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group {
  height: 490px;
}

/* line 9, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-hole-board {
  z-index: 12;
  height: 490px;
}

/* line 12, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-hole-board .ns-hole-bg {
  fill: #7b00ff;
  height: 490px;
}

/* line 18, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome {
  z-index: 13;
}

/* line 20, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome.animating {
  z-index: 11;
}

/* line 24, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-logo {
  width: 315px;
  margin-top: 100px;
}

/* line 29, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-slot {
  width: 72px;
  height: 72px;
  position: absolute;
  left: 360px;
  top: 280px;
  background-color: #ffea00;
  border: 4px solid black;
}

/* line 38, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-slot .mab-welcome-slot-inner {
  border: 2px solid #7e7e7e;
  width: 60px;
  height: 60px;
  border-radius: 30px;
  margin: 2px;
}

/* line 47, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs {
  top: 260px;
  right: 360px;
  width: 68px;
  position: absolute;
}

/* line 53, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs .ns-welcome-button {
  position: absolute;
  width: 62px;
  height: 62px;
  top: 3px;
  left: 3px;
}

/* line 60, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs .ns-welcome-button.moved {
  transition: top 1000ms, left 1000ms;
  top: 25px;
  left: -167px;
}

/* line 67, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs .mab-welcome-disc {
  width: 68px;
  height: 68px;
  background-color: #323232;
  border-radius: 44px;
  border: 4px solid #cbcbcb;
  position: absolute;
}

/* line 75, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs .mab-welcome-disc:first-child {
  top: 32px;
}

/* line 78, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-welcome .mab-welcome-discs .mab-welcome-disc:nth-child(2) {
  top: 16px;
}

/* line 85, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-main-tasks {
  white-space: nowrap;
  position: relative;
  left: -10px;
  height: 380px;
  transition: left 1250ms;
}

/* line 91, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-main-tasks .task-container.grid-12 {
  display: inline-block;
  vertical-align: top;
  width: 960px;
}

/* line 96, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-main-tasks .task-container.grid-12 .task {
  text-align: left;
  height: 360px;
}

/* line 103, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames {
  display: inline-block;
  position: relative;
  margin: 0;
  text-align: center;
}

/* line 109, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame {
  border: 4px solid #323232;
  border-radius: 0;
  margin: 0 64px 0 60px;
}

/* line 114, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame .ten-frame-cell {
  border-color: #323232;
}

/* line 119, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame:nth-child(2) {
  margin: 0 64px 0 0;
  border: 0;
}

/* line 123, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame:nth-child(2) .ten-frame-cell {
  border: 1px solid #cb9e13;
  margin: 1px;
  width: 69px;
  height: 69px;
}

/* line 132, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame .ten-frame-cell, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-overflow .ten-frame-cell {
  width: 70px;
  height: 70px;
  background-color: #ffea00;
}

/* line 136, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame .ten-frame-cell .ten-frame-slot, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-overflow .ten-frame-cell .ten-frame-slot {
  height: 60px;
  width: 60px;
}

/* line 139, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame .ten-frame-cell .ten-frame-slot.ui-droppable:empty, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-overflow .ten-frame-cell .ten-frame-slot.ui-droppable:empty {
  border: 2px solid #7e7e7e;
  border-radius: 30px;
}

/* line 147, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-disc {
  background: #323232;
  border-radius: 60px;
  width: 60px;
  height: 60px;
}

/* line 154, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-disc.colored.tf-disc-a {
  background: #7b00ff;
}

/* line 157, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ten-frames-widget.number-sense-ten-frames .ten-frame-disc.colored.tf-disc-b {
  background: #ff5400;
}

/* line 164, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank {
  display: inline-block;
  position: relative;
  opacity: 0;
  transition: opacity 500ms linear;
  min-width: 680px;
}

/* line 171, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank:nth-child(3) {
  min-width: 450px;
}

/* line 175, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs {
  display: inline-block;
  vertical-align: middle;
  width: 68px;
  height: 100px;
  position: relative;
  transition: opacity 500ms linear;
}

/* line 183, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-fake-disc {
  background: #323232;
  border-radius: 60px;
  width: 68px;
  height: 68px;
  border: 4px solid #cbcbcb;
  position: absolute;
}

/* line 191, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-fake-disc:first-child {
  top: 32px;
}

/* line 194, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-fake-disc:nth-child(2) {
  top: 16px;
}

/* line 199, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-drag-disc {
  position: absolute;
  background: #323232;
  border-radius: 60px;
  width: 60px;
  height: 60px;
  top: 4px;
  left: 4px;
}

/* line 208, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-drag-disc:not(.ui-draggable-disabled) {
  cursor: pointer;
}

/* line 212, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-fake-discs .ns-tf-drag-disc.moving {
  transition: 400ms;
}

/* line 218, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-bank-text {
  vertical-align: middle;
  font-size: 40px;
  display: inline-block;
  margin: 0 20px;
}

/* line 224, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-bank-text .ns-tf-bank-make-text, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-bank-text .ns-tf-bank-sum-text, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-tf-bank-text .ns-tf-bank-exclamation-text {
  display: inline;
  transition: opacity 500ms linear;
}

/* line 229, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-bank .ns-next-button {
  visibility: hidden;
  vertical-align: middle;
  transition: opacity 500ms linear;
}

/* line 236, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter {
  display: none;
  opacity: 1;
  transition: opacity 500ms, top 250ms;
  position: absolute;
  font-size: 40px;
  width: 60px;
  height: 60px;
  margin-top: -24px;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/make_and_break/counter.svg");
  background-repeat: no-repeat;
}

/* line 248, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter.purple {
  color: #7b00ff;
}

/* line 252, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter.orange {
  color: #ff5400;
}

/* line 256, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter .ns-tf-counter-text {
  margin: 0 10px 0 0px;
  line-height: 60px;
}

/* line 261, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter.flipped {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 263, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .ns-tf-counter.flipped .ns-tf-counter-text {
  -webkit-transform: scale(-1);
  -moz-transform: scale(-1);
  -ms-transform: scale(-1);
  -o-transform: scale(-1);
  transform: scale(-1);
}

/* line 269, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget {
  display: inline-block;
  font-size: 0px;
  vertical-align: middle;
}

/* line 274, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper {
  display: table;
}

/* line 277, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence-spacer {
  height: 20px;
}

/* line 281, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-equation, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence {
  display: table-row;
}

/* line 285, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper span {
  display: table-cell;
}

/* line 289, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence {
  margin-top: 10px;
}

/* line 291, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span {
  opacity: 0;
  transition: opacity 500ms;
}

/* line 296, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.mabs-a:not(.correct):not(.incorrect):not(.try-again) {
  color: #7b00ff;
}

/* line 298, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.mabs-a.zearn-input:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #7b00ff;
}

/* line 302, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.mabs-b:not(.correct):not(.incorrect):not(.try-again) {
  color: #ff5400;
}

/* line 304, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.mabs-b.zearn-input:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #ff5400;
}

/* line 311, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.correct.correct-done.mabs-a {
  color: #7b00ff;
}

/* line 314, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence span.correct.correct-done.mabs-b {
  color: #ff5400;
}

/* line 322, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence-wrapper .make-and-break-sentence.inactive span.zearn-input:not(.correct):not(.incorrect):not(.try-again) {
  border-color: transparent;
}

/* line 330, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence span {
  vertical-align: baseline;
  min-width: 85px;
  font-size: 40px;
  margin: 0 5px;
  height: 58px;
}

/* line 336, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span:not(.zearn-input), #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence span:not(.zearn-input) {
  border: 4px solid transparent;
  padding: 0 10px;
}

/* line 342, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span:not(.zearn-input):empty::after, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.zearn-input.inactive:empty::after, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence span:not(.zearn-input):empty::after, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-sentence span.zearn-input.inactive:empty::after {
  content: "\0000a0";
}

/* line 349, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation {
  opacity: 0;
  transition: opacity 500ms;
  margin-top: 10px;
  min-height: 58px;
}

/* line 356, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.mab-eq-a:not(.correct):not(.incorrect):not(.try-again) {
  color: #7b00ff;
}

/* line 358, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.mab-eq-a.zearn-input:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #7b00ff;
}

/* line 362, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.mab-eq-b:not(.correct):not(.incorrect):not(.try-again) {
  color: #ff5400;
}

/* line 364, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.mab-eq-b.zearn-input:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #ff5400;
}

/* line 370, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.correct.correct-done.mab-eq-a {
  color: #7b00ff;
}

/* line 373, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-equation-widget .make-and-break-equation span.correct.correct-done.mab-eq-b {
  color: #ff5400;
}

/* line 380, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side {
  display: inline-block;
  vertical-align: middle;
  text-align: center;
}

/* line 385, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb {
  margin: 0 auto;
  opacity: 0;
  transition: opacity 500ms;
  height: 280px;
}

/* line 391, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-a, #number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-b {
  top: 180px;
}

/* line 395, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-a {
  left: 10px;
}

/* line 397, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-a.highlight:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #7b00ff;
}

/* line 400, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-a .ns-nb-a-text.highlight:not(.correct):not(.incorrect):not(.try-again) {
  color: #7b00ff;
}

/* line 405, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-b {
  left: 190px;
}

/* line 407, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-b.highlight:not(.correct):not(.incorrect):not(.try-again) {
  border-color: #ff5400;
}

/* line 410, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .mab-right-side .ns-nb .ns-nb-b .ns-nb-b-text.highlight:not(.correct):not(.incorrect):not(.try-again) {
  color: #ff5400;
}

/* line 417, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-progress-bar {
  overflow: hidden;
  background: #323232;
  position: relative;
  width: 90%;
  height: 40px;
  margin: 5px auto;
  border-radius: 20px;
}

/* line 426, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-progress-bar .mab-pb-filled {
  background: #50cb13;
  height: 40px;
  width: 0;
  transition: width 1000ms;
}

/* line 433, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .make-and-break-progress-bar .mab-pb-face {
  background: #0294f8;
  width: 48px;
  height: 48px;
  border: 4px solid white;
  position: absolute;
  top: -4px;
  left: 20px;
  margin-left: -24px;
  border-radius: 24px;
  transition: left 1000ms;
}

/* line 447, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .fluency-complete-buttons {
  display: inline-block;
  vertical-align: middle;
  width: 360px;
  height: 360px;
  background: #ff005b;
  border-radius: 200px;
  margin-top: 10px;
  padding-top: 100px;
  margin: 10px 300px;
}

/* line 458, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .fluency-complete-buttons .acb-zearned-it {
  color: white;
  margin-bottom: 20px;
}

/* line 463, app/assets/stylesheets/number_sense_activities/make_and_break.scss */
#number-sense-activity .tasks-page .make-and-break.number-sense-task-group .fluency-complete-buttons .done-area {
  display: block;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 6, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) {
  background: #002132;
  height: 440px;
}

/* line 10, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-building {
  background: #7e7e7e;
}

/* line 12, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-building .nst-building-roof, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-building .nst-building-floor {
  position: absolute;
  background: #f6f6f6;
}

/* line 18, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

/* line 26, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome img {
  height: 440px;
}

/* line 30, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .ns-welcome-button {
  top: 176px;
  left: 404px;
  width: 123px;
  height: 123px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .nst-building {
  position: absolute;
  width: 105px;
  height: 126px;
  bottom: 0;
  left: 423px;
}

/* line 44, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .nst-building .nst-building-roof {
  width: 113px;
  left: -4px;
  top: -4px;
  height: 4px;
}

/* line 51, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .nst-building .nst-window {
  background: #323232;
  position: absolute;
  padding: 2px;
  height: 109px;
  width: 46px;
  left: 5px;
  top: 9px;
}

/* line 59, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .nst-building .nst-window:last-child {
  left: auto;
  right: 5px;
  background: transparent;
}

/* line 65, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .nst-building .nst-window .nst-window-cell {
  background: #fff265;
  width: 17px;
  height: 17px;
  display: inline-block;
  margin: 2px;
}

/* line 75, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .ns-welcome .ns-green-circle:not(.big) {
  top: 176px;
  left: 404px;
  width: 123px;
  height: 123px;
}

/* line 83, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main {
  transition: 1s;
}

/* line 86, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area {
  text-align: left;
  padding: 80px 0 0 150px;
}

/* line 90, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag-pole, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag {
  display: inline-block;
  vertical-align: top;
}

/* line 95, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag-pole {
  width: 10px;
  height: 180px;
  background: #ffea00;
  margin-right: 5px;
}

/* line 102, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag {
  width: 105px;
  background: #f6f6f6;
  padding: 10px 10px;
}

/* line 107, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-1, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-2 {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  display: inline-block;
}

/* line 113, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-1 .face-img, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-2 .face-img {
  display: none;
  background-repeat: no-repeat;
  height: 150%;
  margin: -5px 1px;
}

/* line 120, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-1.show-face .face-img, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-2.show-face .face-img {
  display: block;
}

/* line 125, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-1 {
  background: #ff4419;
  margin-right: 5px;
}

/* line 129, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-1 .face-img {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/next_stop_top/faces/faces-00002-left_smile.svg");
}

/* line 134, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-2 {
  background: #7b00ff;
}

/* line 137, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main.ns-main .nst-flag-area .nst-flag .nst-flag-circle-2 .face-img {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/next_stop_top/faces/faces-00001-right_smile.svg");
}

/* line 145, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer {
  position: relative;
  min-height: 100px;
  margin-left: 60px;
  margin-bottom: 60px;
}

/* line 151, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building {
  height: 100%;
  position: absolute;
  bottom: 55px;
  width: 175px;
}

/* line 158, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building.skinny {
  width: 110px;
}

/* line 161, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building.wide {
  width: 310px;
}

/* line 165, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building .nst-building-roof, .next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building .nst-building-floor {
  width: calc(100% + 20px);
  left: -10px;
  height: 10px;
}

/* line 171, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building .nst-building-roof {
  top: 0;
}

/* line 175, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .nst-building .nst-building-floor {
  bottom: 0;
}

/* line 180, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .ns-main-tasks {
  padding: 30px 0;
  padding-bottom: 75px;
}

/* line 183, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .ns-main-tasks.last-task {
  padding-top: 15px;
}

/* line 186, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .ns-main-tasks .task-container {
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 75px;
}

/* line 190, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .ns-main-tasks .task-container:last-child {
  margin-bottom: 0px;
}

/* line 193, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .nst-main-tasks-outer .ns-main-tasks .task-container:first-child {
  margin-top: -20px;
}

/* line 204, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .task {
  text-align: left;
}

/* line 208, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget {
  display: inline-block;
  margin: 0;
}

/* line 211, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame {
  padding: 10px;
  background: #323232;
  border-radius: 0;
  border: none;
}

/* line 216, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame:first-child {
  margin-left: 15px;
}

/* line 219, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame:last-child {
  margin-right: 15px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame:not(:first-child) {
  padding: 0;
}

/* line 228, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-col:first-child {
  margin-right: 5px;
}

/* line 233, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell {
  border: none;
  width: 60px;
  height: 60px;
  background: #fff265;
}

/* line 239, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell:not(:last-child) {
  margin-bottom: 5px;
}

/* line 243, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot {
  width: 50px;
  height: 50px;
  border: 0;
  top: 5px;
  left: 5px;
}

/* line 250, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc {
  width: 50px;
  height: 50px;
  border-radius: 28px;
  top: 0;
  left: 0;
  -webkit-transition: opacity, 400ms, ease-in;
  -moz-transition: opacity, 400ms, ease-in;
  -ms-transition: opacity, 400ms, ease-in;
  -o-transition: opacity, 400ms, ease-in;
  transition: opacity, 400ms, ease-in;
}

/* line 258, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a {
  background: #ff4419;
}

/* line 260, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a.reverse-colors {
  background: #7b00ff;
}

/* line 265, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b {
  background: #7b00ff;
}

/* line 267, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.reverse-colors {
  background: #ff4419;
}

/* line 272, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.autocorrected {
  width: 56px;
  height: 56px;
  top: -3px;
  left: -3px;
}

/* line 285, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget .ten-frame.five-frame .ten-frame-col:first-child {
  margin-right: 0;
}

/* line 293, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget.lights-off .ten-frame .ten-frame-cell {
  background: #656565;
}

/* line 295, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ten-frames-widget.lights-off .ten-frame .ten-frame-cell .ten-frame-disc {
  opacity: 0;
}

/* line 302, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb {
  margin: 0 auto;
}

/* line 305, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-sum {
  border-color: #cbcbcb;
}

/* line 309, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-a {
  color: #ff4419;
  border-color: #ff4419;
}

/* line 313, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-b {
  border-color: #7b00ff;
  color: #7b00ff;
}

/* line 318, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-a-line, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-b-line {
  stroke: white;
}

/* line 322, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-a-text, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-b-text, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-sum-text {
  width: 100%;
  position: inherit;
}

/* line 328, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb.reverse-colors .ns-nb-a {
  border-color: #7b00ff;
  color: #7b00ff;
}

/* line 332, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb.reverse-colors .ns-nb-b {
  border-color: #ff4419;
  color: #ff4419;
}

/* line 339, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-a.incorrect, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-a.try-again, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-b.incorrect, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-b.try-again, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-sum.incorrect, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb .ns-nb-sum.try-again {
  border-color: #ff4d76;
  background: #fea5ba;
}

/* line 346, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right {
  vertical-align: middle;
  display: inline-block;
  padding: 0 20px;
  height: 340px;
  position: relative;
  width: 725px;
}

/* line 355, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right.skinny {
  width: 590px;
  position: absolute;
  left: 305px;
}

/* line 361, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right.wide {
  width: 785px;
}

/* line 365, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze-backdrop {
  position: absolute;
}

/* line 369, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze {
  top: calc(50% - 150px);
  left: calc(50% - 150px);
  padding: 0;
  border: 0;
  background: #50cb13;
  font-size: 65px;
  font-weight: bold;
  cursor: pointer;
  width: 300px;
  height: 300px;
  border-radius: 150px;
  z-index: 200;
  color: black;
}

/* line 383, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze:active {
  top: calc(50% - 138px);
}

/* line 386, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze:hover {
  background: #80ff00;
}

/* line 391, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze-backdrop {
  left: calc(50% - 150px);
  top: calc(50% - 138px);
  width: 300px;
  height: 300px;
  background-color: #156615;
  border-radius: 150px;
}

/* line 400, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right .decompose-nb-freeze:hover + .decompose-nb-freeze-backdrop {
  background-color: #50cb13;
}

/* line 405, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .zearn-keypad {
  margin-top: 20px;
}

/* line 409, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .decompose-nb-right, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .ns-nb, .next-stop-top.number-sense-task-group:not(.activity-post) .decompose-nb .zearn-keypad {
  display: none;
}

/* line 415, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs {
  display: none;
  position: absolute;
  top: 220px;
  left: 240px;
}

/* line 421, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs.wide {
  left: 380px;
}

/* line 425, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs.skinny {
  left: 180px;
}

/* line 429, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs .nst-light-bulb {
  display: inline-block;
  width: 40px;
  height: 52px;
  background: url("//webassets.zearn.org/app_assets/number_sense/next_stop_top/lightbulb-off.svg");
  cursor: pointer;
  transition: opacity 250ms ease-in-out;
}

/* line 437, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs .nst-light-bulb.on {
  cursor: default;
  background: url("//webassets.zearn.org/app_assets/number_sense/next_stop_top/lightbulb.svg") no-repeat;
}

/* line 442, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs .nst-light-bulb.off {
  opacity: 0;
}

/* line 447, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.nst-light-bulbs.disabled {
  cursor: default;
}

/* line 453, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish {
  position: absolute;
  width: 0;
  height: 0;
  background: #50cb13;
  border-radius: 200px;
  left: 450px;
  top: 80px;
  transition: 200ms ease-in-out;
}

/* line 463, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish.big {
  width: 300px;
  height: 300px;
}

/* line 468, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish .fluency-complete-buttons {
  margin-top: 5px;
}

/* line 471, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  color: #002132;
  margin-top: 90px;
}

/* line 477, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .done-btn:active, .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .love-it-btn:active {
  border-width: 2px 0 0 0;
  border-top-color: #50cb13;
}

/* line 482, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .done-btn {
  width: 190px;
}

/* line 488, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish .number-sense-finish-title, .number-sense-finish .fluency-complete-buttons {
  display: none;
}

/* line 492, app/assets/stylesheets/number_sense_activities/next_stop_top.scss */
.number-sense-finish.visible .number-sense-finish-title, .number-sense-finish.visible .fluency-complete-buttons {
  display: block;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 11, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten {
  width: 960px;
  height: 531px;
}

/* line 14, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-button .ns-video-button-image {
  background-image: url("//webassets.zearn.org/app_assets/number_sense/teacher_images/subtraction.jpg");
}

/* line 18, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-button:not(.expanded) .ns-video-button-image {
  background-position: -69px -2px;
}

/* line 22, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-button.expanded {
  bottom: 43px;
}

/* line 25, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-button.expanded .ns-video-button-image {
  bottom: 51px;
  background-position: -178px 0px;
}

/* line 30, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-button.expanded.rectify .ns-video-button-image {
  background-position: -70px 0px;
}

/* line 35, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-video .ns-video-player {
  bottom: 43px;
}

/* line 40, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-prompt-bar {
  position: absolute;
  left: 0;
}

/* line 45, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-hole-board {
  z-index: 12;
  height: 531px;
}

/* line 48, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-hole-board .ns-hole-bg {
  height: 531px;
}

/* line 51, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-hole-board .ns-hole-mask-rect {
  height: 531px;
}

/* line 62, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-welcome .tft-welcome {
  width: 900px;
  height: 460px;
  margin-top: 35px;
  margin-left: 30px;
}

/* line 67, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-welcome .tft-welcome img.show {
  display: inline-block;
}

/* line 70, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-welcome .tft-welcome img:not(.show) {
  display: none;
}

/* line 73, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-welcome .tft-welcome .ns-welcome-button {
  width: 135px;
  height: 135px;
}

/* line 78, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-welcome .ns-green-circle:not(.big) {
  width: 135px;
  height: 135px;
}

/* line 84, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main {
  background-color: #f5f1de;
}

/* line 86, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ready-message {
  width: 30%;
  height: 20%;
  position: absolute;
  left: 35%;
  top: 30%;
  font-size: 48px;
  color: #ff5400;
  font-weight: 500;
  transition: 100ms opacity linear;
}

/* line 97, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks {
  -webkit-perspective: 6960px;
  -moz-perspective: 6960px;
  -ms-perspective: 6960px;
  -o-perspective: 6960px;
  perspective: 6960px;
}

/* line 99, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .task-container {
  margin-bottom: 20px;
  margin-left: 10px;
  margin-right: 10px;
}

/* line 104, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-equation-task, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-2-equation-task {
  background-color: white;
  border-color: #7e7e7e;
  border-style: solid;
  border-width: 2px 2px 2px 2px;
  height: 523px;
  margin-left: 0px;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform-origin: left;
  -moz-transform-origin: left;
  -ms-transform-origin: left;
  -o-transform-origin: left;
  transform-origin: left;
  -webkit-transition: -webkit-transform 1000ms ease-in-out;
  -moz-transition: -moz-transform 1000ms ease-in-out;
  -o-transition: -o-transform 1000ms ease-in-out;
  transition: transform 1000ms ease-in-out;
}

/* line 115, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-equation-task.flipped, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-2-equation-task.flipped {
  z-index: 5;
  -webkit-transform: rotateY(-90deg);
  -moz-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  -o-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}

/* line 119, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-equation-task .task, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-2-equation-task .task {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;
  position: relative;
  top: 51px;
}

/* line 123, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-equation-task .task .nb-eq-widget, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-equation-task .task .ten-frames-widget, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-2-equation-task .task .nb-eq-widget, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .ns-main-tasks .ns-take-from-ten-2-equation-task .task .ten-frames-widget {
  position: absolute;
}

/* line 129, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten .ns-main .fluency-complete-buttons {
  position: absolute;
  width: 500px;
  left: calc(50% - 250px);
}

/* line 137, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten:not(.take-two) {
  background: #136fcb;
}

/* line 139, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten:not(.take-two) .ns-welcome-button, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten:not(.take-two) .ns-green-circle:not(.big) {
  top: 343px;
  left: 412px;
}

/* line 145, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two {
  background: #7b00ff;
}

/* line 147, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .logo, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .pattern {
  position: absolute;
  left: 0px;
}

/* line 151, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .logo {
  top: 20px;
  bottom: 0px;
}

/* line 155, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .pattern {
  top: 0px;
  width: 960px;
}

/* line 159, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .ns-welcome-button, #number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .ns-green-circle:not(.big) {
  top: 270px;
  left: 416px;
}

/* line 163, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .nb-eq-widget {
  top: 129px;
}

/* line 165, app/assets/stylesheets/number_sense_activities/ns_take_from_ten.scss */
#number-sense-activity .tasks-page .number-sense-task-group.ns-take-from-ten.take-two .nb-eq-widget.top {
  top: 10px;
  -webkit-transition: top 800ms ease-in-out;
  -moz-transition: top 800ms ease-in-out;
  -ms-transition: top 800ms ease-in-out;
  -o-transition: top 800ms ease-in-out;
  transition: top 800ms ease-in-out;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper {
  font-size: 40px;
  font-weight: 700;
}

/* line 8, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-eq {
  position: relative;
  left: 248px;
}

/* line 13, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper {
  display: inline-block;
  padding: 10px 0 26px 0;
  position: absolute;
  left: 264px;
}

/* line 19, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines, .tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-eq-parts {
  position: relative;
}

/* line 22, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines {
  background-repeat: no-repeat;
  opacity: 0;
}

/* line 25, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines.show {
  opacity: 1;
}

/* line 28, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines.animate-show {
  opacity: 1;
  -webkit-transition: opacity 500ms linear 100ms;
  -moz-transition: opacity 500ms linear 100ms;
  -ms-transition: opacity 500ms linear 100ms;
  -o-transition: opacity 500ms linear 100ms;
  transition: opacity 500ms linear 100ms;
}

/* line 34, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines-wrapper {
  padding: 5px;
  height: 62px;
}

/* line 37, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper .tft-nb-part-wrapper .nb-lines-wrapper .nb-lines {
  top: 30px;
  height: 39px;
  width: 56px;
  margin: 0 auto;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/addition_magician/nb-eq-part-lines.svg");
}

/* line 47, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span {
  float: left;
  width: 100px;
  opacity: 0;
}

/* line 51, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.show {
  opacity: 1;
}

/* line 54, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.animate-show {
  opacity: 1;
  -webkit-transition: opacity 500ms linear 100ms;
  -moz-transition: opacity 500ms linear 100ms;
  -ms-transition: opacity 500ms linear 100ms;
  -o-transition: opacity 500ms linear 100ms;
  transition: opacity 500ms linear 100ms;
}

/* line 58, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-op {
  width: 125px;
}

/* line 61, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-diff {
  position: absolute;
  height: 58px;
  top: 0px;
}

/* line 66, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.grayed {
  border-color: #e4e4e4;
  background-color: #e4e4e4;
}

/* line 70, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-a1, .tft-nb-eq-wrapper span.nb-eq-a2 {
  margin: 0 5px;
  position: absolute;
  top: 10px;
}

/* line 75, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-a1.nb-eq-a1, .tft-nb-eq-wrapper span.nb-eq-a2.nb-eq-a1 {
  left: -60px;
}

/* line 78, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-a1.nb-eq-a1.big-numbers, .tft-nb-eq-wrapper span.nb-eq-a2.nb-eq-a1.big-numbers {
  left: -70px;
}

/* line 83, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-a1.nb-eq-a2, .tft-nb-eq-wrapper span.nb-eq-a2.nb-eq-a2 {
  left: 20px;
}

/* line 86, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_number_bond_equation.scss */
.tft-nb-eq-wrapper span.nb-eq-a1.nb-eq-a2.big-numbers, .tft-nb-eq-wrapper span.nb-eq-a2.nb-eq-a2.big-numbers {
  left: 30px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames {
  position: relative;
  top: 75px;
  left: 96px;
}

/* line 9, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame-op {
  margin: 0 10px;
}

/* line 13, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame {
  border: 2px solid #323232;
  border-radius: 0px;
  opacity: 0;
  left: -165px;
}

/* line 19, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.show {
  opacity: 1;
}

/* line 23, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.animate-show {
  opacity: 1;
  -webkit-transition: opacity 500ms linear 100ms;
  -moz-transition: opacity 500ms linear 100ms;
  -ms-transition: opacity 500ms linear 100ms;
  -o-transition: opacity 500ms linear 100ms;
  transition: opacity 500ms linear 100ms;
}

/* line 28, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.ten-frame-a .ten-frame-cell {
  border-color: #323232;
}

/* line 32, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.ten-frame-b {
  border-color: white;
}

/* line 34, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.ten-frame-b.incorrect .ten-frame-cell {
  -webkit-transition: border-color 300ms linear, background-color 300ms linear;
  -moz-transition: border-color 300ms linear, background-color 300ms linear;
  -ms-transition: border-color 300ms linear, background-color 300ms linear;
  -o-transition: border-color 300ms linear, background-color 300ms linear;
  transition: border-color 300ms linear, background-color 300ms linear;
  border-color: #ffdbca;
  background-color: #ffdbca;
}

/* line 40, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.ten-frame-b.faded {
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
  opacity: 0.25;
}

/* line 45, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame.ten-frame-b .ten-frame-cell {
  border-color: white;
}

/* line 51, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell {
  background-color: white;
  border-width: 0 2px 2px 0;
  padding: 1px 0;
}

/* line 56, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell:last-child {
  height: 48px;
  border-bottom: 0;
}

/* line 61, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col:last-child .ten-frame-cell {
  border-right: 0;
  border-left: 0;
  width: 48px;
}

/* line 69, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice {
  opacity: 0;
  border: 8px solid #0097b6;
  border-radius: 10px;
  width: 114px;
  height: 264px;
  position: absolute;
  top: -6px;
  z-index: 0;
  -webkit-transition: width 200ms ease-in-out, left 200ms ease-in-out, height 200ms ease-in-out, top 200ms ease-in-out;
  -moz-transition: width 200ms ease-in-out, left 200ms ease-in-out, height 200ms ease-in-out, top 200ms ease-in-out;
  -ms-transition: width 200ms ease-in-out, left 200ms ease-in-out, height 200ms ease-in-out, top 200ms ease-in-out;
  -o-transition: width 200ms ease-in-out, left 200ms ease-in-out, height 200ms ease-in-out, top 200ms ease-in-out;
  transition: width 200ms ease-in-out, left 200ms ease-in-out, height 200ms ease-in-out, top 200ms ease-in-out;
}

/* line 83, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice:hover {
  border-color: #048ec3;
}

/* line 87, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.show {
  z-index: 3;
  opacity: 1;
  cursor: pointer;
  -webkit-animation: pulse 250ms ease-in-out;
  -moz-animation: pulse 250ms ease-in-out;
  -ms-animation: pulse 250ms ease-in-out;
  -o-animation: pulse 250ms ease-in-out;
  animation: pulse 250ms ease-in-out;
}

/* line 93, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.show.tft-multchoice-b {
  -webkit-animation-delay: 100ms;
  -moz-animation-delay: 100ms;
  -ms-animation-delay: 100ms;
  -o-animation-delay: 100ms;
  animation-delay: 100ms;
}

/* line 98, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.pulse:not(.incorrect) {
  width: 124px;
  height: 284px;
  top: -16px;
}

/* line 104, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-a {
  left: 79px;
}

/* line 107, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-a.pulse {
  left: 74px;
}

/* line 112, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-b {
  left: 210px;
}

/* line 115, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-b.incorrect {
  -webkit-transition: border-color 300ms linear;
  -moz-transition: border-color 300ms linear;
  -ms-transition: border-color 300ms linear;
  -o-transition: border-color 300ms linear;
  transition: border-color 300ms linear;
  border-color: #ff005b;
}

/* line 119, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-b.incorrect:hover {
  cursor: default;
}

/* line 124, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-b.faded {
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
  opacity: 0.25;
}

/* line 129, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-multchoice.tft-multchoice-b.pulse:not(.incorrect) {
  left: 205px;
}

/* line 135, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard {
  position: relative;
  top: 60px;
  left: 22px;
  margin-left: 50px;
  margin-right: 90px;
  margin-bottom: 54px;
  width: 594px;
  height: 0px;
  border: 4px solid #5c6b72;
  border-radius: 4px;
  background-color: #e5e5e5;
  background-image: url("//webassets.zearn.org/app_assets/tasks/trash/trashcan.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 45px 57px;
  opacity: 0;
}

/* line 153, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show {
  opacity: 1;
  height: 78px;
  top: 21px;
  -webkit-transition: height 300ms ease-out, top 300ms ease-out;
  -moz-transition: height 300ms ease-out, top 300ms ease-out;
  -ms-transition: height 300ms ease-out, top 300ms ease-out;
  -o-transition: height 300ms ease-out, top 300ms ease-out;
  transition: height 300ms ease-out, top 300ms ease-out;
}

/* line 159, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.correct, .ns-take-from-ten-ten-frames .tft-graveyard.show.try-again, .ns-take-from-ten-ten-frames .tft-graveyard.show.incorrect {
  transition: all 250ms ease-in-out;
}

/* line 163, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.correct {
  border-color: #00c372;
  background-color: #ccffd9;
}

/* line 168, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.try-again {
  border-color: #ff4d76;
  background-color: #ffe3ee;
}

/* line 173, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.incorrect {
  border-color: #ff005b;
  background-color: #ff005b;
}

/* line 178, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.clickable {
  cursor: pointer;
}

/* line 182, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show.faded {
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
  opacity: 0.25;
}

/* line 187, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot {
  position: absolute;
  width: 50px;
  height: 50px;
  top: 10px;
}

/* line 194, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='0'] {
  left: 6px;
}

/* line 197, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='1'] {
  left: 56px;
}

/* line 200, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='2'] {
  left: 106px;
}

/* line 203, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='3'] {
  left: 156px;
}

/* line 206, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='4'] {
  left: 206px;
}

/* line 209, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='5'] {
  left: 330px;
}

/* line 212, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='6'] {
  left: 380px;
}

/* line 215, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='7'] {
  left: 430px;
}

/* line 218, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='8'] {
  left: 480px;
}

/* line 221, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.show .disc-slot[data-slot='9'] {
  left: 530px;
}

/* line 228, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc {
  background-color: #323232;
  background-image: none;
  border-radius: 20px;
  z-index: 2;
  opacity: 1;
}

/* line 235, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.ui-draggable-dragging, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.ui-draggable-dragging {
  z-index: 5;
}

/* line 239, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.expand, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.expand {
  background-color: #0097b6;
  width: 48px;
  height: 48px;
  top: -8px;
  left: -8px;
  border-radius: 24px;
  -webkit-transition: background-color 100ms linear, width 100ms linear, height 100ms linear, border-radius 100ms linear, top 100ms linear, left 100ms linear;
  -moz-transition: background-color 100ms linear, width 100ms linear, height 100ms linear, border-radius 100ms linear, top 100ms linear, left 100ms linear;
  -ms-transition: background-color 100ms linear, width 100ms linear, height 100ms linear, border-radius 100ms linear, top 100ms linear, left 100ms linear;
  -o-transition: background-color 100ms linear, width 100ms linear, height 100ms linear, border-radius 100ms linear, top 100ms linear, left 100ms linear;
  transition: background-color 100ms linear, width 100ms linear, height 100ms linear, border-radius 100ms linear, top 100ms linear, left 100ms linear;
}

/* line 253, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc:not(.expand), .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc:not(.expand) {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 257, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.image, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.image {
  width: 40px;
  height: 40px;
  background-color: #0097b6;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/ns_take_from_ten/blue-disc.svg");
}

/* line 263, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.image.disc-active:not(.ui-draggable-disabled), .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.image.disc-active:not(.ui-draggable-disabled) {
  cursor: pointer;
}

/* line 268, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.moving, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.moving {
  z-index: 3;
  -webkit-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -moz-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -ms-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  -o-transition: top 500ms ease-in-out, left 500ms ease-in-out;
  transition: top 500ms ease-in-out, left 500ms ease-in-out;
}

/* line 273, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.ghost, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.ghost {
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
  border: 3px dotted #5c6b72;
  background-color: white;
  opacity: .5;
}

/* line 280, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.faded, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.faded {
  -webkit-transition: opacity 300ms linear;
  -moz-transition: opacity 300ms linear;
  -ms-transition: opacity 300ms linear;
  -o-transition: opacity 300ms linear;
  transition: opacity 300ms linear;
  opacity: 0.25;
}

/* line 285, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-col .ten-frame-cell .ten-frame-disc.hidden, .ns-take-from-ten-ten-frames .tft-graveyard .disc-slot .ten-frame-disc.hidden {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
  opacity: 0;
  cursor: default;
}

/* line 293, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .ten-frame .ten-frame-disc.image {
  left: -4px;
  top: -4px;
}

/* line 298, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard .ten-frame-disc {
  left: 5px;
  top: 5px;
}

/* line 303, app/assets/stylesheets/number_sense_activities/ns_take_from_ten_ten_frames.scss */
.ns-take-from-ten-ten-frames .tft-graveyard.clickable .disc-slot .ten-frame-disc.hidden {
  cursor: pointer;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes arrive {
  10% {
    width: 102.2%;
    height: 102.2%;
    top: -4px;
    left: -4px;
  }
  60% {
    width: 80%;
    height: 80%;
    top: 30px;
    left: 30px;
  }
}

@-moz-keyframes arrive {
  10% {
    width: 102.2%;
    height: 102.2%;
    top: -4px;
    left: -4px;
  }
  60% {
    width: 80%;
    height: 80%;
    top: 30px;
    left: 30px;
  }
}

@-o-keyframes arrive {
  10% {
    width: 102.2%;
    height: 102.2%;
    top: -4px;
    left: -4px;
  }
  60% {
    width: 80%;
    height: 80%;
    top: 30px;
    left: 30px;
  }
}

@keyframes arrive {
  10% {
    width: 102.2%;
    height: 102.2%;
    top: -4px;
    left: -4px;
  }
  60% {
    width: 80%;
    height: 80%;
    top: 30px;
    left: 30px;
  }
}

@-webkit-keyframes star-grow {
  0% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
  25% {
    opacity: 1;
  }
  50% {
    font-size: 400px;
    line-height: 400px;
    width: 400px;
    height: 400px;
    top: -25px;
    left: -20px;
  }
  100% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
}

@-moz-keyframes star-grow {
  0% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
  25% {
    opacity: 1;
  }
  50% {
    font-size: 400px;
    line-height: 400px;
    width: 400px;
    height: 400px;
    top: -25px;
    left: -20px;
  }
  100% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
}

@-o-keyframes star-grow {
  0% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
  25% {
    opacity: 1;
  }
  50% {
    font-size: 400px;
    line-height: 400px;
    width: 400px;
    height: 400px;
    top: -25px;
    left: -20px;
  }
  100% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
}

@keyframes star-grow {
  0% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
  25% {
    opacity: 1;
  }
  50% {
    font-size: 400px;
    line-height: 400px;
    width: 400px;
    height: 400px;
    top: -25px;
    left: -20px;
  }
  100% {
    opacity: 0;
    font-size: 200px;
    line-height: 200px;
    width: 200px;
    height: 200px;
    top: 70px;
    left: 80px;
  }
}

/* line 62, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome {
  background: #ffea00;
}

/* line 64, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .ns-welcome-button {
  left: 410px;
  top: 180px;
  z-index: 1;
}

/* line 70, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-welcome-text {
  position: absolute;
  background: url("//webassets.zearn.org/app_assets/number_sense/number_bond_dash/number_bond_dash.svg");
  width: 100%;
  height: 100%;
}

/* line 77, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying {
  position: absolute;
  width: 128px;
  height: 40px;
  top: 230px;
  left: -128px;
  z-index: 0;
}

/* line 85, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying.fly {
  transition: left 700ms linear;
  left: 100%;
}

/* line 90, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying .nbd-flying-dot {
  background: #ff4419;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  position: absolute;
  right: 0;
  top: 0;
}

/* line 100, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying .nbd-flying-line-1, .number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying .nbd-flying-line-2 {
  position: absolute;
  background: #ff4419;
  width: 60px;
  height: 4px;
  border-radius: 8px;
}

/* line 108, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying .nbd-flying-line-1 {
  top: 10px;
  right: 46px;
}

/* line 112, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .nbd-flying .nbd-flying-line-2 {
  top: 26px;
  right: 64px;
}

/* line 118, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-welcome .ns-green-circle {
  z-index: 2;
  top: 180px;
  left: 410px;
}

/* line 125, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main {
  background: #511fcf;
  transition: background 700ms;
}

/* line 129, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main.unfocus {
  background: #a581ff;
}

/* line 134, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-countdown-box {
  position: absolute;
  top: 10px;
  left: 30px;
  width: 900px;
  height: 40px;
}

/* line 141, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-countdown-box .countdown-bar {
  border-radius: 20px;
  background: #55ff4d;
}

/* line 147, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls {
  position: absolute;
  top: 70px;
  height: 360px;
  white-space: nowrap;
  transition: 700ms;
  left: 300px;
}

/* line 156, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls.ending {
  transition-timing-function: linear;
}

/* line 160, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls {
  display: inline-block;
  vertical-align: middle;
}

/* line 165, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container {
  margin: 0;
}

/* line 168, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .task {
  margin: 0;
}

/* line 172, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left {
  display: inline-block;
  position: absolute;
  right: 450px;
  padding: 0 10px;
  top: 25px;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 179, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.wide {
  right: 360px;
}

/* line 183, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget {
  display: inline-block;
  margin: 0;
}

/* line 186, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame {
  padding: 5px;
  background: #3f3f3f;
  border-radius: 0;
  border: none;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 193, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame:first-child {
  margin-left: 15px;
}

/* line 196, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame:last-child {
  margin-right: 15px;
}

/* line 201, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-col:first-child {
  margin-right: 5px;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 207, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell {
  border: none;
  background: #fffee8;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 212, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell:not(:last-child) {
  margin-bottom: 5px;
  -webkit-transition: all 400ms;
  -moz-transition: all 400ms;
  -ms-transition: all 400ms;
  -o-transition: all 400ms;
  transition: all 400ms;
}

/* line 217, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot {
  border: 0;
  top: 5px;
  left: 5px;
}

/* line 222, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc {
  border-radius: 28px;
  top: 0;
  left: 0;
  transition: 100ms ease-in;
}

/* line 228, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a {
  background: #3f3f3f;
}

/* line 230, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a.highlight {
  background: #7a00c9;
}

/* line 233, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-a.scale {
  -webkit-animation: pulse 800ms ease-in 1;
  -moz-animation: pulse 800ms ease-in 1;
  -ms-animation: pulse 800ms ease-in 1;
  -o-animation: pulse 800ms ease-in 1;
  animation: pulse 800ms ease-in 1;
}

/* line 238, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b {
  background: #3f3f3f;
}

/* line 240, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.highlight {
  background: #ff4419;
}

/* line 243, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame .ten-frame-cell .ten-frame-slot .ten-frame-disc.tf-disc-b.scale {
  -webkit-animation: pulse 800ms ease-in 1;
  -moz-animation: pulse 800ms ease-in 1;
  -ms-animation: pulse 800ms ease-in 1;
  -o-animation: pulse 800ms ease-in 1;
  animation: pulse 800ms ease-in 1;
}

/* line 252, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame.five-frame {
  position: absolute;
  right: 10px;
}

/* line 256, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left .ten-frames-widget .ten-frame.five-frame .ten-frame-col:first-child .ten-frame-cell {
  border-right-width: 20px;
}

/* line 264, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.small {
  padding-right: 50px;
  top: 160px;
  transition: 800ms ease-in-out;
}

/* line 268, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.small .ten-frame {
  padding: 0px;
}

/* line 272, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.small .ten-frame .ten-frame-col:first-child {
  margin-right: 0px;
}

/* line 277, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.small .ten-frame .ten-frame-cell {
  height: 0px;
  width: 0px;
}

/* line 280, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .dash-nb-left.small .ten-frame .ten-frame-cell:not(:last-child) {
  margin-bottom: 0px;
}

/* line 288, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .feedback-message {
  text-align: center;
  margin: 0;
}

/* line 291, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .feedback-message .feedback-message-text {
  line-height: 20px;
  font-size: 30px;
  font-weight: 600;
  color: #ff4419;
}

/* line 299, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb {
  margin: 0 auto;
}

/* line 301, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b-line, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a-line {
  stroke: #323232;
  stroke-width: 8px;
}

/* line 304, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b-line.unfocus, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a-line.unfocus {
  stroke: #cbcbcb;
  transition: stroke 400ms linear;
}

/* line 311, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding: 0 0 0 12px;
}

/* line 316, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum {
  border: 8px solid #323232;
}

/* line 318, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.correct, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.correct, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.correct {
  background: #19ff00;
  transition: 150ms linear;
}

/* line 322, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.incorrect, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.incorrect, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.incorrect {
  background: #ffdbca;
}

/* line 325, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.incorrect .ns-nb-a-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.incorrect .ns-nb-b-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.incorrect .ns-nb-sum-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.incorrect .ns-nb-a-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.incorrect .ns-nb-b-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.incorrect .ns-nb-sum-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.incorrect .ns-nb-a-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.incorrect .ns-nb-b-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.incorrect .ns-nb-sum-text {
  color: #323232;
}

/* line 329, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.unknown, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.unknown, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.unknown {
  background: #0294f8;
  border-color: #0294f8;
  transition: 150ms linear;
  -webkit-animation: pulse 1000ms ease-in-out infinite;
  -moz-animation: pulse 1000ms ease-in-out infinite;
  -ms-animation: pulse 1000ms ease-in-out infinite;
  -o-animation: pulse 1000ms ease-in-out infinite;
  animation: pulse 1000ms ease-in-out infinite;
}

/* line 335, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.unfocus, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.unfocus, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum.unfocus {
  border-color: #cbcbcb;
  transition: border-color 400ms linear;
}

/* line 341, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a.highlight {
  border-color: #7a00c9;
}

/* line 344, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a-text.highlight {
  color: #7a00c9;
}

/* line 347, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b.highlight {
  border-color: #ff4419;
}

/* line 350, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b-text.highlight {
  color: #ff4419;
}

/* line 353, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum-text {
  font-size: 46px;
}

/* line 355, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-a-text.unfocus, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-b-text.unfocus, .number-bond-dash.number-sense-task-group .ns-main .nbd-balls .nbd-task-balls .dash-nb.task-container .ns-nb .ns-nb-sum-text.unfocus {
  color: #cbcbcb;
}

/* line 364, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball {
  position: relative;
  width: 100px;
  height: 100px;
  display: inline-block;
  vertical-align: middle;
  margin: 130px 5px;
  transition: 700ms;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 374, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .nbd-ball-bg {
  position: absolute;
  background: #a581ff;
  border-radius: 180px;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  transition: 700ms;
}

/* line 385, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .nbd-ball-star {
  display: none;
}

/* line 389, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball .nbd-proficiency-message {
  position: absolute;
  left: 20px;
  color: white;
  width: calc(100% - 40px);
  white-space: normal;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 398, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .nbd-ball-redo {
  display: none;
  position: relative;
  width: 100%;
  height: 80%;
  background: url("//webassets.zearn.org/app_assets/number_sense/number_bond_dash/redo_icon.svg") no-repeat;
  background-position: center;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 408, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.previous {
  cursor: pointer;
}

/* line 410, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.previous .nbd-ball-redo {
  display: block;
}

/* line 415, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.active, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball {
  width: 360px;
  height: 360px;
  margin: 0 5px;
}

/* line 421, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.hidden {
  width: 0;
  height: 0;
  margin: 0;
}

/* line 431, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball.active.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball.nbd-game-over-ball.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-time-ball.active.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-time-ball.nbd-game-over-ball.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.active.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.nbd-game-over-ball.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.active.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.nbd-game-over-ball.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball.active.arrive .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball.nbd-game-over-ball.arrive .nbd-ball-text {
  font-size: 60px;
  -webkit-backface-visibility: hidden;
}

/* line 438, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball.active.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball.nbd-game-over-ball.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-time-ball.active.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-time-ball.nbd-game-over-ball.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.active.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.nbd-game-over-ball.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.active.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.nbd-game-over-ball.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball.active.arrive .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball.nbd-game-over-ball.arrive .nbd-ball-bg {
  -webkit-animation: arrive 700ms linear;
  -moz-animation: arrive 700ms linear;
  -ms-animation: arrive 700ms linear;
  -o-animation: arrive 700ms linear;
  animation: arrive 700ms linear;
}

/* line 446, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball .nbd-ball-bg {
  background: #0294f8;
}

/* line 449, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball .nbd-stars-ball-star {
  position: absolute;
  color: #ffea00;
}

/* line 455, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-stars-ball.animate .nbd-stars-ball-star {
  -webkit-animation: star-grow 750ms ease-out 250ms;
  -moz-animation: star-grow 750ms ease-out 250ms;
  -ms-animation: star-grow 750ms ease-out 250ms;
  -o-animation: star-grow 750ms ease-out 250ms;
  animation: star-grow 750ms ease-out 250ms;
}

/* line 462, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball .nbd-ball-bg, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball .nbd-ball-bg {
  background: #ff4419;
}

/* line 468, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.check .nbd-ball-bg {
  background: #0294f8;
}

/* line 472, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.check .nbd-ball-text {
  top: 120px;
  font-size: 58px;
}

/* line 478, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-done-ball.check.unfocus .nbd-ball-bg {
  background: #a581ff;
}

/* line 485, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-time-ball .nbd-ball-bg {
  background: #ff4419;
}

/* line 491, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball .nbd-ball-bg {
  background: #50cb13;
}

/* line 496, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.check .nbd-ball-bg {
  background: #0294f8;
}

/* line 500, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.check.active.arrive .nbd-ball-text {
  font-size: 0;
}

/* line 506, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-go-ball.unfocus .nbd-ball-bg {
  background: #a581ff;
}

/* line 513, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball .nbd-ball-bg {
  background: #a581ff;
}

/* line 518, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.active .nbd-ball-bg {
  background: #f6f6f6;
}

/* line 524, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.check .nbd-ball-bg {
  background: #19ff00;
}

/* line 528, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.check.correct .nbd-ball-star {
  color: #ffea00;
  font-size: 40px;
  display: block;
  position: absolute;
  width: 100%;
  height: 50px;
  line-height: 50px;
  top: calc(50% - 27px);
}

/* line 539, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.check.correct.unfocus .nbd-ball-star {
  display: none;
}

/* line 547, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.unfocus:not(.active) .nbd-ball-bg {
  background: #a581ff;
}

/* line 552, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-task-ball.unfocus.active .nbd-ball-bg {
  background: #e4e4e4;
}

/* line 558, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball {
  display: none;
  position: absolute;
  left: 300px;
  top: 70px;
}

/* line 563, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-ball-text, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-ball-text {
  font-size: 60px;
}

/* line 566, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-game-over-ball .nbd-proficiency-message, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-proficiency-message, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-proficiency-message {
  display: none;
  font-size: 20px;
}

/* line 573, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-ball-bg {
  background: #0294f8;
}

/* line 576, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-ball-text {
  top: 120px;
  display: none;
}

/* line 581, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-left-star, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-right-star,
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-num {
  position: absolute;
}

/* line 586, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-left-star, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-right-star {
  color: #ffea00;
  font-size: 40px;
  width: 50px;
  height: 50px;
  top: calc(50% - 27px);
}

/* line 594, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-left-star {
  left: 80px;
}

/* line 597, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-left-star .nbd-count-star {
  position: absolute;
  top: 0;
  width: 50px;
  transition-property: initial;
  transition-timing-function: linear;
  transition-delay: initial;
}

/* line 607, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-right-star {
  right: 80px;
}

/* line 611, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-final-count-ball .nbd-final-count-num {
  font-size: 60px;
  color: #ffea00;
  width: 80px;
  height: 80px;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
}

/* line 622, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-ball-bg {
  background: #ffea00;
}

/* line 625, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-ball-text {
  top: 175px;
  color: #323232;
  font-size: 50px;
  font-weight: 600;
}

/* line 632, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over {
  position: relative;
  display: inline;
  top: 35px;
  width: 150px;
  height: 40px;
  border-width: 0px 0px 2px 0px;
  border-radius: 20px;
  font-size: 20px;
}

/* line 642, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going:active, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over:active {
  border-top-color: #ffea00;
  border-width: 2px 0 0 0;
}

/* line 647, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going .yes-icon, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going .do-over-icon, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over .yes-icon, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over .do-over-icon {
  width: 14px;
  height: 16px;
  display: inline-block;
}

/* line 654, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going {
  background: #50cb13;
  border-color: #156615;
}

/* line 658, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-keep-going .yes-icon {
  margin-left: 4px;
  background: url("//webassets.zearn.org/app_assets/number_sense/number_bond_dash/yes_icon.svg") no-repeat;
}

/* line 664, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over {
  background: #ff005b;
  border-color: #971937;
}

/* line 668, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball.nbd-inactivity-ball .nbd-start-over .do-over-icon {
  margin-right: 4px;
  background: url("//webassets.zearn.org/app_assets/number_sense/number_bond_dash/do_over_icon.svg") no-repeat;
}

/* line 675, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .fluency-complete-buttons {
  display: none;
  position: absolute;
  top: 220px;
  left: 30px;
  width: 300px;
  text-align: center;
  white-space: normal;
}

/* line 685, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .fluency-complete-buttons .zearn-button.done-btn:active, .number-bond-dash.number-sense-task-group .ns-main .nbd-ball .fluency-complete-buttons .zearn-button.love-it-btn:active {
  border-color: #0294f8;
}

/* line 690, app/assets/stylesheets/number_sense_activities/number_bond_dash.scss */
.number-bond-dash.number-sense-task-group .ns-main .nbd-ball .fluency-complete-buttons .zearn-button.done-btn {
  background: #ff4419;
  border-color: #971937;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
body.number_gym_activities, body.kindergarten_activities {
  background-color: #ebebeb;
}

/* line 9, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity {
  text-align: center;
  margin: 0px auto;
  width: 960px;
  border-radius: 6px;
  position: relative;
  -webkit-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -moz-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -ms-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  -o-box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
  box-shadow: 1px 1px 2px 0 rgba(179, 179, 179, 0.5);
}

/* line 17, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity .tasks-page {
  width: 100%;
  padding-top: 0px;
}

/* line 21, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity .tasks-page .task-group-header {
  margin: 0;
}

/* line 24, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity .tasks-page .task-container.grid-12 {
  width: 100%;
  height: 100%;
}

/* line 29, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity .tasks-page.ended {
  margin-bottom: 0px;
}

/* line 34, app/assets/stylesheets/number_sense_activities/number_sense_activities.scss */
#number-sense-activity .zearn-keypad {
  width: 960px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 5, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb {
  position: relative;
  width: 300px;
  height: 300px;
  transition: opacity 500ms linear;
}

/* line 11, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum, .number-sense-task-group .ns-nb .ns-nb-a, .number-sense-task-group .ns-nb .ns-nb-b, .number-sense-task-group .ns-nb .ns-nb-a-line, .number-sense-task-group .ns-nb .ns-nb-b-line, .number-sense-task-group .ns-nb .ns-nb-enter {
  position: absolute;
}

/* line 15, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum, .number-sense-task-group .ns-nb .ns-nb-a, .number-sense-task-group .ns-nb .ns-nb-b {
  width: 100px;
  height: 100px;
  border: 4px solid black;
  border-radius: 60px;
  line-height: 72px;
  background: white;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

/* line 24, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.jiggle, .number-sense-task-group .ns-nb .ns-nb-a.jiggle, .number-sense-task-group .ns-nb .ns-nb-b.jiggle {
  -webkit-animation: jiggle 250ms ease-in-out infinite;
  -moz-animation: jiggle 250ms ease-in-out infinite;
  -ms-animation: jiggle 250ms ease-in-out infinite;
  -o-animation: jiggle 250ms ease-in-out infinite;
  animation: jiggle 250ms ease-in-out infinite;
}

/* line 28, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.correct, .number-sense-task-group .ns-nb .ns-nb-a.correct, .number-sense-task-group .ns-nb .ns-nb-b.correct {
  background: #50cb13;
  border-color: #50cb13;
}

/* line 31, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.correct .zearn-input.correct, .number-sense-task-group .ns-nb .ns-nb-a.correct .zearn-input.correct, .number-sense-task-group .ns-nb .ns-nb-b.correct .zearn-input.correct {
  background: transparent;
}

/* line 35, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.incorrect, .number-sense-task-group .ns-nb .ns-nb-a.incorrect, .number-sense-task-group .ns-nb .ns-nb-b.incorrect {
  background: #ff005b;
  border-color: #ff005b;
}

/* line 38, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.incorrect .zearn-input.incorrect, .number-sense-task-group .ns-nb .ns-nb-a.incorrect .zearn-input.incorrect, .number-sense-task-group .ns-nb .ns-nb-b.incorrect .zearn-input.incorrect {
  background: transparent;
}

/* line 42, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.try-again, .number-sense-task-group .ns-nb .ns-nb-a.try-again, .number-sense-task-group .ns-nb .ns-nb-b.try-again {
  border-color: #ff4d76;
  background: #ffe3ee;
}

/* line 45, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum.try-again .zearn-input.try-again, .number-sense-task-group .ns-nb .ns-nb-a.try-again .zearn-input.try-again, .number-sense-task-group .ns-nb .ns-nb-b.try-again .zearn-input.try-again {
  background: transparent;
}

/* line 51, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum-text, .number-sense-task-group .ns-nb .ns-nb-a-text, .number-sense-task-group .ns-nb .ns-nb-b-text {
  font-size: 60px;
  text-align: center;
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

/* line 56, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum-text.blink, .number-sense-task-group .ns-nb .ns-nb-a-text.blink, .number-sense-task-group .ns-nb .ns-nb-b-text.blink {
  -webkit-animation: blink 1300ms linear infinite;
  -moz-animation: blink 1300ms linear infinite;
  -ms-animation: blink 1300ms linear infinite;
  -o-animation: blink 1300ms linear infinite;
  animation: blink 1300ms linear infinite;
}

/* line 60, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum-text.zearn-input, .number-sense-task-group .ns-nb .ns-nb-a-text.zearn-input, .number-sense-task-group .ns-nb .ns-nb-b-text.zearn-input {
  border-color: rgba(255, 255, 255, 0.01);
}

/* line 64, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum-text.zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(.try-again):not(:empty), .number-sense-task-group .ns-nb .ns-nb-a-text.zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(.try-again):not(:empty), .number-sense-task-group .ns-nb .ns-nb-b-text.zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(.try-again):not(:empty) {
  padding: 0 0 0 23px;
}

/* line 70, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-a, .number-sense-task-group .ns-nb .ns-nb-b {
  top: 200px;
}

/* line 74, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-b {
  left: 200px;
}

/* line 78, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-sum {
  left: 100px;
}

/* line 82, app/assets/stylesheets/number_sense_activities/number_sense_number_bond.scss */
.number-sense-task-group .ns-nb .ns-nb-b-line, .number-sense-task-group .ns-nb .ns-nb-a-line {
  top: 0;
  left: 0;
  stroke: black;
  stroke-width: 4px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 4, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper {
  font-size: 40px;
  font-weight: 700;
}

/* line 8, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq {
  position: absolute;
  left: 338px;
}

/* line 11, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq .nb-eq-bottom-op, .nb-eq-wrapper .nb-eq .nb-eq-top-op {
  width: 125px;
}

/* line 16, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper {
  display: inline-block;
  padding: 15px 0 26px 205px;
}

/* line 20, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn, .nb-eq-wrapper .nb-part-wrapper .nb-lines, .nb-eq-wrapper .nb-part-wrapper .nb-eq-parts {
  position: relative;
}

/* line 23, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn, .nb-eq-wrapper .nb-part-wrapper .nb-lines {
  background-repeat: no-repeat;
  opacity: 0;
  -webkit-transition: all 0ms;
  -moz-transition: all 0ms;
  -ms-transition: all 0ms;
  -o-transition: all 0ms;
  transition: all 0ms;
}

/* line 27, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn.show, .nb-eq-wrapper .nb-part-wrapper .nb-lines.show {
  opacity: 1;
}

/* line 32, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn.show {
  -webkit-transition: all 200ms;
  -moz-transition: all 200ms;
  -ms-transition: all 200ms;
  -o-transition: all 200ms;
  transition: all 200ms;
}

/* line 34, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn.show:hover:not(.disabled) {
  -webkit-transition: all 0ms;
  -moz-transition: all 0ms;
  -ms-transition: all 0ms;
  -o-transition: all 0ms;
  transition: all 0ms;
  cursor: pointer;
  background-color: #048ec3;
}

/* line 40, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-part-btn.pulse {
  -webkit-animation: pulse 500ms;
  -moz-animation: pulse 500ms;
  -ms-animation: pulse 500ms;
  -o-animation: pulse 500ms;
  animation: pulse 500ms;
}

/* line 45, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-lines.show {
  -webkit-transition: opacity 500ms linear 100ms;
  -moz-transition: opacity 500ms linear 100ms;
  -ms-transition: opacity 500ms linear 100ms;
  -o-transition: opacity 500ms linear 100ms;
  transition: opacity 500ms linear 100ms;
}

/* line 50, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-lines-wrapper {
  padding: 5px;
  height: 62px;
}

/* line 53, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-lines-wrapper .nb-part-btn {
  background-color: #0097b6;
  width: 40px;
  height: 40px;
  z-index: 1;
  margin: 0 auto;
  border-width: 0 0 3px 0px;
  border-style: solid;
  border-color: #047699;
  border-radius: 5px;
  background-size: cover;
  bottom: 7px;
}

/* line 65, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-lines-wrapper .nb-part-btn .nb-part-btn-icon {
  width: 32px;
  height: 32px;
  position: absolute;
  top: 5px;
  left: 4px;
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/addition_magician/split-number.svg");
}

/* line 75, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-part-wrapper .nb-lines-wrapper .nb-lines {
  top: 30px;
  height: 39px;
  width: 56px;
  margin: 0 auto;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/addition_magician/nb-eq-part-lines.svg");
}

/* line 85, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper span {
  opacity: 0;
  float: left;
  width: 80px;
  height: 60px;
  transition: opacity 400ms;
}

/* line 91, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper span.show {
  opacity: 1;
}

/* line 94, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper span.nb-eq-b1, .nb-eq-wrapper span.nb-eq-b2 {
  margin: 0 5px;
}

/* line 99, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .zearn-input-box {
  height: 58px;
  background: white;
}

/* line 102, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .zearn-input-box.correct:not(.correct-done) {
  background: #50cb13;
}

/* line 105, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .zearn-input-box.incorrect {
  background: #ff005b;
}

/* line 108, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .zearn-input-box.try-again {
  border-color: #ff4d76;
  background: #ffe3ee;
}

/* line 114, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrows, .nb-eq-wrapper .nb-eq-arrows-left, .nb-eq-wrapper .nb-eq-arrow-right {
  position: absolute;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 500ms;
}

/* line 119, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrows.show, .nb-eq-wrapper .nb-eq-arrows-left.show, .nb-eq-wrapper .nb-eq-arrow-right.show {
  opacity: 1;
}

/* line 123, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrows-left {
  height: 120px;
  width: 164px;
  left: 373px;
  top: 59px;
}

/* line 128, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrows-left .left-arrow-1, .nb-eq-wrapper .nb-eq-arrows-left .left-arrow-2 {
  fill: #a865ff;
}

/* line 132, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrow-right {
  height: 42px;
  width: 42px;
  left: 587px;
  top: 137px;
}

/* line 137, app/assets/stylesheets/number_sense_activities/number_sense_number_bond_equation.scss */
.nb-eq-wrapper .nb-eq-arrow-right .right-arrow-1 {
  fill: #656565;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot1 {
  0% {
    opacity: 0;
  }
  24% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot2 {
  0% {
    opacity: 0;
  }
  49% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

@keyframes dot3 {
  0% {
    opacity: 0;
  }
  74% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}

/* line 23, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .one {
  animation: dot1 2s infinite;
}

/* line 26, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .two {
  animation: dot2 2s infinite;
}

/* line 29, app/assets/stylesheets/fluency_shared/_waiting_dots.scss */
.waiting-dots .three {
  animation: dot3 2s infinite;
}

/* line 4, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button {
  position: absolute;
  width: 140px;
  height: 140px;
  border-radius: 70px;
  background-color: #e4e4e4;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 16, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button .waiting-text {
  font-size: 24px;
  color: #808080;
  margin-bottom: 4px;
}

/* line 22, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button .waiting-dots {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* line 27, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button .waiting-dots .one, .ns-welcome-button .waiting-dots .two, .ns-welcome-button .waiting-dots .three {
  width: 12px;
  height: 12px;
  background-color: #808080;
  border-radius: 6px;
  margin: 0 2px;
}

/* line 37, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.small .waiting-text {
  font-size: 18px;
}

/* line 42, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.small .waiting-dots .one, .ns-welcome-button.small .waiting-dots .two, .ns-welcome-button.small .waiting-dots .three {
  width: 8px;
  height: 8px;
}

/* line 50, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.extra-small .waiting-text {
  font-size: 14px;
}

/* line 55, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.extra-small .waiting-dots .one, .ns-welcome-button.extra-small .waiting-dots .two, .ns-welcome-button.extra-small .waiting-dots .three {
  width: 6px;
  height: 6px;
}

/* line 62, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.ready {
  cursor: pointer;
  background-color: #7bcc0a;
  -webkit-transition: background-color 300ms ease-in-out;
  -moz-transition: background-color 300ms ease-in-out;
  -ms-transition: background-color 300ms ease-in-out;
  -o-transition: background-color 300ms ease-in-out;
  transition: background-color 300ms ease-in-out;
}

/* line 67, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.ready .play-arrow {
  -webkit-animation: slideArrow 2000ms linear infinite;
  -moz-animation: slideArrow 2000ms linear infinite;
  -ms-animation: slideArrow 2000ms linear infinite;
  -o-animation: slideArrow 2000ms linear infinite;
  animation: slideArrow 2000ms linear infinite;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/PlayButton_Arrow.svg");
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  background-size: 50% 80%;
  background-position: 50% 50%;
  position: relative;
}

@-webkit-keyframes slideArrow {
  0%, 50%, 100% {
    background-position-x: 50%;
  }
  25% {
    background-position-x: 42%;
  }
  75% {
    background-position-x: 58%;
  }
}

@-moz-keyframes slideArrow {
  0%, 50%, 100% {
    background-position-x: 50%;
  }
  25% {
    background-position-x: 42%;
  }
  75% {
    background-position-x: 58%;
  }
}

@-o-keyframes slideArrow {
  0%, 50%, 100% {
    background-position-x: 50%;
  }
  25% {
    background-position-x: 42%;
  }
  75% {
    background-position-x: 58%;
  }
}

@keyframes slideArrow {
  0%, 50%, 100% {
    background-position-x: 50%;
  }
  25% {
    background-position-x: 42%;
  }
  75% {
    background-position-x: 58%;
  }
}

/* line 89, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.ready:hover {
  background-color: #80ff00;
  -webkit-transition: background-color 100ms ease-in-out, left 100ms ease-in-out;
  -moz-transition: background-color 100ms ease-in-out, left 100ms ease-in-out;
  -ms-transition: background-color 100ms ease-in-out, left 100ms ease-in-out;
  -o-transition: background-color 100ms ease-in-out, left 100ms ease-in-out;
  transition: background-color 100ms ease-in-out, left 100ms ease-in-out;
}

/* line 93, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.ready:hover .play-arrow {
  -webkit-animation: none;
  -moz-animation: none;
  -ms-animation: none;
  -o-animation: none;
  animation: none;
}

/* line 98, app/assets/stylesheets/fluency_shared/welcome_button.scss */
.ns-welcome-button.ready .waiting-dots, .ns-welcome-button.ready .waiting-text {
  display: none;
}

/* line 5, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group {
  overflow: hidden;
  position: relative;
  width: 960px;
  height: 500px;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 17, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group.resizing * {
  transition: none !important;
}

/* line 23, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .task, .number-sense-task-group button {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
}

/* line 27, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-welcome {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
}

/* line 35, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-welcome.ready {
  cursor: pointer;
}

/* line 39, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-welcome .ns-green-circle {
  position: absolute;
  display: none;
  width: 140px;
  height: 140px;
  background-color: #50cb13;
  border-radius: 100px;
  transition: 1000ms;
}

/* line 48, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-welcome .ns-green-circle.big {
  border-radius: 2000px;
  width: 1200px;
  height: 1200px;
  top: -350px;
  left: -120px;
}

/* line 58, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-main {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

/* line 67, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-hole-board {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  height: 500px;
}

/* line 74, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-hole-board .ns-hole-bg {
  fill: #50cb13;
  height: 500px;
}

/* line 79, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-hole-board .ns-hole-mask-rect {
  fill: white;
}

/* line 83, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-hole-board .ns-hole {
  fill: black;
}

/* line 88, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-button {
  cursor: pointer;
  vertical-align: top;
  font-size: 40px;
  color: white;
  border-radius: 40px;
  border-width: 0 0 4px 0;
  border-style: solid;
  text-transform: none;
  padding: 2px 12px 4px 12px;
}

/* line 98, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-button:active {
  border-width: 4px 0 0 0;
}

/* line 102, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-button.ns-next-button {
  background: #0294f8;
  border-color: #0673bf;
  width: 80px;
  height: 40px;
  border-radius: 10px;
  font-size: 30px;
  padding-left: 16px;
}

/* line 110, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-button.ns-next-button:active {
  border-top-color: #e4e4e4;
}

/* line 113, app/assets/stylesheets/number_sense_activities/number_sense_tg.scss */
.number-sense-task-group .ns-button.ns-next-button .ns-next-triangle {
  width: 0;
  height: 0;
  margin: 4px auto;
  border-style: solid;
  border-width: 12.5px 0 12.5px 21.7px;
  border-color: transparent transparent transparent #ffffff;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 9, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-overlay.hidden, .ns-video-player.hidden {
  left: -960px;
}

/* line 14, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: black;
  cursor: pointer;
  opacity: 0;
  z-index: 11;
  -webkit-transition: opacity 1200ms ease-in;
  -moz-transition: opacity 1200ms ease-in;
  -ms-transition: opacity 1200ms ease-in;
  -o-transition: opacity 1200ms ease-in;
  transition: opacity 1200ms ease-in;
}

/* line 24, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-overlay.fade-in {
  opacity: 0.65;
}

/* line 29, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button {
  position: absolute;
  left: 20px;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  border: 5px solid transparent;
  z-index: 12;
  -webkit-transition: opacity 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, border-width 600ms ease-in-out, border-radius 600ms ease-in-out;
  -moz-transition: opacity 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, border-width 600ms ease-in-out, border-radius 600ms ease-in-out;
  -ms-transition: opacity 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, border-width 600ms ease-in-out, border-radius 600ms ease-in-out;
  -o-transition: opacity 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, border-width 600ms ease-in-out, border-radius 600ms ease-in-out;
  transition: opacity 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, border-width 600ms ease-in-out, border-radius 600ms ease-in-out;
}

/* line 41, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button:hover:not(.hidden) {
  cursor: pointer;
  border-color: #fad232;
}

/* line 46, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.hidden {
  opacity: 0;
}

/* line 50, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.lower {
  bottom: 20px;
}

/* line 54, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.upper {
  bottom: 420px;
}

/* line 58, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanding {
  cursor: default;
  border-color: #fad232;
}

/* line 62, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanding .ns-video-button-image {
  border-color: transparent;
}

/* line 67, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanded {
  border-width: 8px;
  bottom: 23px;
  left: 260.5px;
  width: 439px;
  height: 439px;
}

/* line 77, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanded .ns-video-button-image {
  bottom: 31px;
  left: 309.2777777778px;
  width: 425px;
  height: 425px;
  background-size: 755.5555555556px 425px;
  background-position: 0px 0px;
}

/* line 85, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanded.rectify {
  border-radius: 5px;
  width: 656px;
  left: 152px;
}

/* line 90, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button.expanded.rectify .ns-video-button-image {
  border-radius: 0px;
  width: 640px;
  left: 144px;
}

/* line 98, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-button .ns-video-button-image {
  width: 50px;
  height: 50px;
  border: 1px solid #7e7e7e;
  border-radius: 100%;
  background-color: white;
  background-repeat: no-repeat;
  background-size: 177.7777777778px 100px;
  -webkit-transition: border-radius 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, background-size 600ms ease-in-out, background-position 600ms ease-in-out;
  -moz-transition: border-radius 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, background-size 600ms ease-in-out, background-position 600ms ease-in-out;
  -ms-transition: border-radius 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, background-size 600ms ease-in-out, background-position 600ms ease-in-out;
  -o-transition: border-radius 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, background-size 600ms ease-in-out, background-position 600ms ease-in-out;
  transition: border-radius 600ms ease-in-out, bottom 600ms ease-in-out, left 600ms ease-in-out, width 600ms ease-in-out, height 600ms ease-in-out, background-size 600ms ease-in-out, background-position 600ms ease-in-out;
}

/* line 112, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player {
  opacity: 0;
  position: absolute;
  bottom: 23px;
  left: 152px;
  z-index: 13;
  -webkit-transition: opacity 400ms ease-in-out;
  -moz-transition: opacity 400ms ease-in-out;
  -ms-transition: opacity 400ms ease-in-out;
  -o-transition: opacity 400ms ease-in-out;
  transition: opacity 400ms ease-in-out;
}

/* line 120, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .ns-video-x {
  position: relative;
  top: 20px;
  left: 634px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border-radius: 20px;
  background-color: #0c91cc;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/video_player/x-close.svg");
  background-size: 100%;
  background-repeat: no-repeat;
  cursor: pointer;
}

/* line 135, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player {
  margin: auto;
  width: 656px;
  border: 8px solid #ffea00;
}

/* line 140, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player .video-wrapper {
  min-height: 360px;
}

/* line 145, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player .video-controls .play-button {
  height: 40px;
  width: 40px;
}

/* line 150, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player .video-controls #time-label, .ns-video-player .video-player .video-controls #end-label {
  margin: 0 8px;
}

/* line 154, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player .video-controls #progress-area {
  width: auto;
}

/* line 157, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player .video-player .video-controls #progress-area #progress-bar {
  max-width: 400px;
}

/* line 164, app/assets/stylesheets/number_sense_activities/number_sense_video.scss */
.ns-video-player.fade-in {
  opacity: 1;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 14, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar {
  font-size: 24px;
  text-align: center;
  font-weight: 700;
  width: 100%;
  height: 51px;
  top: 0;
  position: relative;
  z-index: 10;
  -webkit-transition: top 300ms ease-in-out;
  -moz-transition: top 300ms ease-in-out;
  -ms-transition: top 300ms ease-in-out;
  -o-transition: top 300ms ease-in-out;
  transition: top 300ms ease-in-out;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
}

/* line 26, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .audio-control {
  height: 51px;
  width: 70px;
}

/* line 29, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .audio-control .audio-icon {
  height: 34px;
  width: 34px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/prompt_bar/Toggle_Spritesheet.svg");
  background-size: 400px 60px;
  z-index: 10;
  left: 16px;
  position: absolute;
  -webkit-transition: top 166ms ease-in-out;
  -moz-transition: top 166ms ease-in-out;
  -ms-transition: top 166ms ease-in-out;
  -o-transition: top 166ms ease-in-out;
  transition: top 166ms ease-in-out;
}

/* line 38, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .audio-control .shadow {
  border-radius: 50%;
  position: absolute;
  -webkit-transition: filter 166ms ease-in-out, top 166ms ease-in-out, left 166ms ease-in-out, width 166ms ease-in-out, height 166ms ease-in-out;
  -moz-transition: filter 166ms ease-in-out, top 166ms ease-in-out, left 166ms ease-in-out, width 166ms ease-in-out, height 166ms ease-in-out;
  -ms-transition: filter 166ms ease-in-out, top 166ms ease-in-out, left 166ms ease-in-out, width 166ms ease-in-out, height 166ms ease-in-out;
  -o-transition: filter 166ms ease-in-out, top 166ms ease-in-out, left 166ms ease-in-out, width 166ms ease-in-out, height 166ms ease-in-out;
  transition: filter 166ms ease-in-out, top 166ms ease-in-out, left 166ms ease-in-out, width 166ms ease-in-out, height 166ms ease-in-out;
  top: 46px;
  left: 24.5px;
  width: 17px;
  height: 3px;
  -webkit-filter: blur(0px);
  -moz-filter: blur(0px);
  -ms-filter: blur(0px);
  -o-filter: blur(0px);
  filter: blur(0px);
  background-color: #a1adb3;
  z-index: 9;
}

/* line 50, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .audio-control .z-icon {
  height: 21px;
  width: 20px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/prompt_bar/Toggle_Spritesheet.svg");
  background-size: 400px 60px;
  position: absolute;
  background-position: -205px -10px;
  z-index: 11;
  left: 39px;
  top: 8px;
  transform: rotate(0deg) scale(1);
  -webkit-transition: left 100ms ease-in-out 166ms, top 100ms ease-in-out 166ms, opacity 100ms ease-in-out 166ms, transform 100ms ease-in-out 166ms;
  -moz-transition: left 100ms ease-in-out 166ms, top 100ms ease-in-out 166ms, opacity 100ms ease-in-out 166ms, transform 100ms ease-in-out 166ms;
  -ms-transition: left 100ms ease-in-out 166ms, top 100ms ease-in-out 166ms, opacity 100ms ease-in-out 166ms, transform 100ms ease-in-out 166ms;
  -o-transition: left 100ms ease-in-out 166ms, top 100ms ease-in-out 166ms, opacity 100ms ease-in-out 166ms, transform 100ms ease-in-out 166ms;
  transition: left 100ms ease-in-out 166ms, top 100ms ease-in-out 166ms, opacity 100ms ease-in-out 166ms, transform 100ms ease-in-out 166ms;
  opacity: 1;
}

/* line 65, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .prompt-bar {
  background-color: #e6b923;
  width: 890px;
  position: absolute;
  top: 0px;
  right: 0px;
  height: 51px;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
  z-index: 10;
}

/* line 75, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .prompt-bar .prompt-text {
  margin-top: 10px;
  display: inline-block;
}

/* line 79, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .prompt-bar .audio-widget {
  position: relative;
  top: -2px;
}

/* line 83, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar .prompt-bar .prompt-bar-tail {
  position: absolute;
  left: 4px;
  top: 22px;
  width: 30.5px;
  height: 20px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/prompt_bar/Toggle_Spritesheet.svg");
  background-size: 400px 60px;
  background-position: -303px  -10px;
  -webkit-transform: rotate(-23deg);
  -moz-transform: rotate(-23deg);
  -ms-transform: rotate(-23deg);
  -o-transform: rotate(-23deg);
  transform: rotate(-23deg);
  -webkit-transition: left 266ms ease-in-out, top 266ms ease-in-out, transform 266ms ease-in-out;
  -moz-transition: left 266ms ease-in-out, top 266ms ease-in-out, transform 266ms ease-in-out;
  -ms-transition: left 266ms ease-in-out, top 266ms ease-in-out, transform 266ms ease-in-out;
  -o-transition: left 266ms ease-in-out, top 266ms ease-in-out, transform 266ms ease-in-out;
  transition: left 266ms ease-in-out, top 266ms ease-in-out, transform 266ms ease-in-out;
}

/* line 97, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.autoplay-on .prompt-bar-tail {
  top: 20px;
  left: -18px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}

/* line 102, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.autoplay-on .audio-icon {
  top: 9px;
  background-position: -9px -10px;
}

/* line 106, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.autoplay-on .shadow {
  top: 45px;
  left: 21px;
  width: 23px;
  height: 4px;
  -webkit-filter: blur(1px);
  -moz-filter: blur(1px);
  -ms-filter: blur(1px);
  -o-filter: blur(1px);
  filter: blur(1px);
  background-color: #cfdee6;
}

/* line 114, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.autoplay-on .z-icon {
  left: 29px;
  top: 13px;
  opacity: 0;
  transform: rotate(-90deg) scale(0.5);
  -webkit-transition: left 100ms ease-in-out, top 100ms ease-in-out, opacity 100ms ease-in-out, transform 100ms ease-in-out;
  -moz-transition: left 100ms ease-in-out, top 100ms ease-in-out, opacity 100ms ease-in-out, transform 100ms ease-in-out;
  -ms-transition: left 100ms ease-in-out, top 100ms ease-in-out, opacity 100ms ease-in-out, transform 100ms ease-in-out;
  -o-transition: left 100ms ease-in-out, top 100ms ease-in-out, opacity 100ms ease-in-out, transform 100ms ease-in-out;
  transition: left 100ms ease-in-out, top 100ms ease-in-out, opacity 100ms ease-in-out, transform 100ms ease-in-out;
}

/* line 122, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.autoplay-on .audio-control:hover .audio-icon {
  background-position: -58px -10px;
}

/* line 129, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar:not(.autoplay-on) .audio-icon {
  top: 14px;
  background-position: -107px -10px;
}

/* line 134, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar:not(.autoplay-on) .audio-control:hover .audio-icon {
  background-position: -156px -10px;
}

/* line 137, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar:not(.autoplay-on) .audio-control:hover .z-icon {
  background-position: -254px -10px;
}

/* line 144, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.playing .prompt-bar {
  background-color: #f5a623;
}

/* line 146, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.playing .prompt-bar .prompt-bar-tail {
  background-position: -352px -10px;
}

/* line 152, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.playing .audio-widget .fa-volume {
  display: none;
}

/* line 155, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.playing .audio-widget .fa-volume-mute {
  display: inline;
}

/* line 161, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.with-audio {
  cursor: pointer;
}

/* line 163, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.with-audio .prompt-bar:hover {
  background-color: #f5a623;
}

/* line 165, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.with-audio .prompt-bar:hover .prompt-bar-tail {
  background-position: -352px -10px;
}

/* line 172, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar:not(.with-audio) .audio-widget {
  display: none;
}

/* line 177, app/assets/stylesheets/number_sense_activities/prompt_bar.scss */
.ns-prompt-bar.slide-up {
  top: -51px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes floatCenterPlanet {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 20px;
  }
}

@-moz-keyframes floatCenterPlanet {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 20px;
  }
}

@-o-keyframes floatCenterPlanet {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 20px;
  }
}

@keyframes floatCenterPlanet {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 20px;
  }
}

@-webkit-keyframes floatPlanets1 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
}

@-moz-keyframes floatPlanets1 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
}

@-o-keyframes floatPlanets1 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
}

@keyframes floatPlanets1 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: 10px;
  }
}

@-webkit-keyframes floatPlanets2 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: -5px;
  }
}

@-moz-keyframes floatPlanets2 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: -5px;
  }
}

@-o-keyframes floatPlanets2 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: -5px;
  }
}

@keyframes floatPlanets2 {
  0%, 100% {
    margin-top: 0px;
  }
  50% {
    margin-top: -5px;
  }
}

@-webkit-keyframes floatApe {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(30px) rotate(5deg);
    -moz-transform: translateY(30px) rotate(5deg);
    -ms-transform: translateY(30px) rotate(5deg);
    -o-transform: translateY(30px) rotate(5deg);
    transform: translateY(30px) rotate(5deg);
  }
}

@-moz-keyframes floatApe {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(30px) rotate(5deg);
    -moz-transform: translateY(30px) rotate(5deg);
    -ms-transform: translateY(30px) rotate(5deg);
    -o-transform: translateY(30px) rotate(5deg);
    transform: translateY(30px) rotate(5deg);
  }
}

@-o-keyframes floatApe {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(30px) rotate(5deg);
    -moz-transform: translateY(30px) rotate(5deg);
    -ms-transform: translateY(30px) rotate(5deg);
    -o-transform: translateY(30px) rotate(5deg);
    transform: translateY(30px) rotate(5deg);
  }
}

@keyframes floatApe {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(30px) rotate(5deg);
    -moz-transform: translateY(30px) rotate(5deg);
    -ms-transform: translateY(30px) rotate(5deg);
    -o-transform: translateY(30px) rotate(5deg);
    transform: translateY(30px) rotate(5deg);
  }
}

@-webkit-keyframes floatTiger {
  0%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translate(5px, -10px) rotate(-5deg);
    -moz-transform: translate(5px, -10px) rotate(-5deg);
    -ms-transform: translate(5px, -10px) rotate(-5deg);
    -o-transform: translate(5px, -10px) rotate(-5deg);
    transform: translate(5px, -10px) rotate(-5deg);
  }
}

@-moz-keyframes floatTiger {
  0%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translate(5px, -10px) rotate(-5deg);
    -moz-transform: translate(5px, -10px) rotate(-5deg);
    -ms-transform: translate(5px, -10px) rotate(-5deg);
    -o-transform: translate(5px, -10px) rotate(-5deg);
    transform: translate(5px, -10px) rotate(-5deg);
  }
}

@-o-keyframes floatTiger {
  0%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translate(5px, -10px) rotate(-5deg);
    -moz-transform: translate(5px, -10px) rotate(-5deg);
    -ms-transform: translate(5px, -10px) rotate(-5deg);
    -o-transform: translate(5px, -10px) rotate(-5deg);
    transform: translate(5px, -10px) rotate(-5deg);
  }
}

@keyframes floatTiger {
  0%, 100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    -moz-transform: translate(0px, 0px) rotate(0deg);
    -ms-transform: translate(0px, 0px) rotate(0deg);
    -o-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translate(5px, -10px) rotate(-5deg);
    -moz-transform: translate(5px, -10px) rotate(-5deg);
    -ms-transform: translate(5px, -10px) rotate(-5deg);
    -o-transform: translate(5px, -10px) rotate(-5deg);
    transform: translate(5px, -10px) rotate(-5deg);
  }
}

@-webkit-keyframes floatPig {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(5px) rotate(5deg);
    -moz-transform: translateY(5px) rotate(5deg);
    -ms-transform: translateY(5px) rotate(5deg);
    -o-transform: translateY(5px) rotate(5deg);
    transform: translateY(5px) rotate(5deg);
  }
}

@-moz-keyframes floatPig {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(5px) rotate(5deg);
    -moz-transform: translateY(5px) rotate(5deg);
    -ms-transform: translateY(5px) rotate(5deg);
    -o-transform: translateY(5px) rotate(5deg);
    transform: translateY(5px) rotate(5deg);
  }
}

@-o-keyframes floatPig {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(5px) rotate(5deg);
    -moz-transform: translateY(5px) rotate(5deg);
    -ms-transform: translateY(5px) rotate(5deg);
    -o-transform: translateY(5px) rotate(5deg);
    transform: translateY(5px) rotate(5deg);
  }
}

@keyframes floatPig {
  0%, 100% {
    -webkit-transform: translateY(0px) rotate(0deg);
    -moz-transform: translateY(0px) rotate(0deg);
    -ms-transform: translateY(0px) rotate(0deg);
    -o-transform: translateY(0px) rotate(0deg);
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    -webkit-transform: translateY(5px) rotate(5deg);
    -moz-transform: translateY(5px) rotate(5deg);
    -ms-transform: translateY(5px) rotate(5deg);
    -o-transform: translateY(5px) rotate(5deg);
    transform: translateY(5px) rotate(5deg);
  }
}

@-webkit-keyframes flickerFlame {
  0%, 100% {
    opacity: 0.5;
  }
  50% {
    opacity: 0;
  }
}

@-moz-keyframes flickerFlame {
  0%, 100% {
    opacity: 0.5;
  }
  50% {
    opacity: 0;
  }
}

@-o-keyframes flickerFlame {
  0%, 100% {
    opacity: 0.5;
  }
  50% {
    opacity: 0;
  }
}

@keyframes flickerFlame {
  0%, 100% {
    opacity: 0.5;
  }
  50% {
    opacity: 0;
  }
}

@-webkit-keyframes bobRocket {
  0%, 100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
  }
}

@-moz-keyframes bobRocket {
  0%, 100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
  }
}

@-o-keyframes bobRocket {
  0%, 100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
  }
}

@keyframes bobRocket {
  0%, 100% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }
  50% {
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
  }
}

@-webkit-keyframes dropFlame {
  0% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
  27% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  55%, 100% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
}

@-moz-keyframes dropFlame {
  0% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
  27% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  55%, 100% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
}

@-o-keyframes dropFlame {
  0% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
  27% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  55%, 100% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
}

@keyframes dropFlame {
  0% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
  27% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  55%, 100% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
}

@-webkit-keyframes flyInFlame {
  0%, 64% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
  91% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  100% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
}

@-moz-keyframes flyInFlame {
  0%, 64% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
  91% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  100% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
}

@-o-keyframes flyInFlame {
  0%, 64% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
  91% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  100% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
}

@keyframes flyInFlame {
  0%, 64% {
    opacity: 0.5;
    height: 250px;
    margin-top: 0px;
  }
  91% {
    opacity: 0.5;
    height: 80px;
    margin-top: 170px;
  }
  100% {
    opacity: 0;
    height: 80px;
    margin-top: 170px;
  }
}

/* line 130, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container {
  margin: auto;
}

/* line 133, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container.rotate-out {
  -webkit-transition: -webkit-transform 1500ms ease-in-out;
  -moz-transition: -moz-transform 1500ms ease-in-out;
  -o-transition: -o-transform 1500ms ease-in-out;
  transition: transform 1500ms ease-in-out;
  -webkit-transform: translate(-450px, 500px) rotate(10deg);
  -moz-transform: translate(-450px, 500px) rotate(10deg);
  -ms-transform: translate(-450px, 500px) rotate(10deg);
  -o-transform: translate(-450px, 500px) rotate(10deg);
  transform: translate(-450px, 500px) rotate(10deg);
}

/* line 139, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .inactive:not(.zearn-input), .skip-counting.task-container .active:not(.zearn-input) {
  margin-right: 20px;
  z-index: 3;
  -webkit-flex-shrink: 0;
  flex-shrink: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-transform: translate3d(0, 0, 0);
  /*fixes safari flicker bug*/
}

/* line 150, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row {
  top: 159px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transition: left 1000ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -moz-transition: left 1000ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -ms-transition: left 1000ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -o-transition: left 1000ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  transition: left 1000ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -webkit-transition: left 1000ms ease-in-out, transform 2000ms ease-in-out;
  -moz-transition: left 1000ms ease-in-out, transform 2000ms ease-in-out;
  -ms-transition: left 1000ms ease-in-out, transform 2000ms ease-in-out;
  -o-transition: left 1000ms ease-in-out, transform 2000ms ease-in-out;
  transition: left 1000ms ease-in-out, transform 2000ms ease-in-out;
}

/* line 158, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.fast-pan {
  -webkit-transition: left 500ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -moz-transition: left 500ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -ms-transition: left 500ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -o-transition: left 500ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  transition: left 500ms ease-in-out, -webkit-transform 2000ms ease-in-out;
  -webkit-transition: left 500ms ease-in-out, transform 2000ms ease-in-out;
  -moz-transition: left 500ms ease-in-out, transform 2000ms ease-in-out;
  -ms-transition: left 500ms ease-in-out, transform 2000ms ease-in-out;
  -o-transition: left 500ms ease-in-out, transform 2000ms ease-in-out;
  transition: left 500ms ease-in-out, transform 2000ms ease-in-out;
}

/* line 163, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.rotated-up {
  -webkit-transform: translate(500px, -550px) rotate(10deg);
  -moz-transform: translate(500px, -550px) rotate(10deg);
  -ms-transform: translate(500px, -550px) rotate(10deg);
  -o-transform: translate(500px, -550px) rotate(10deg);
  transform: translate(500px, -550px) rotate(10deg);
}

/* line 167, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.count-up {
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

/* line 171, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.count-down {
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

/* line 175, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row .blurring {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
  z-index: 1;
}

/* line 180, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row .moon {
  position: relative;
  left: 0px;
}

/* line 185, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.finish {
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  top: 226px;
}

/* line 189, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.finish.count-up {
  margin-left: -500px;
}

/* line 193, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.finish.count-down {
  margin-right: -480px;
}

/* line 197, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet-row.finish .earth {
  -webkit-transition: margin 1000ms ease-in-out;
  -moz-transition: margin 1000ms ease-in-out;
  -ms-transition: margin 1000ms ease-in-out;
  -o-transition: margin 1000ms ease-in-out;
  transition: margin 1000ms ease-in-out;
  margin: 0px 400px;
  -webkit-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -moz-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -ms-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -o-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  animation: floatCenterPlanet 2000ms ease-in-out infinite;
}

/* line 205, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet {
  position: relative;
  left: 0px;
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
}

/* line 210, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.no-animation {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-0.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-1.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-2.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-3.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-4.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='5'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-5.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='6'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-6.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='7'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-7.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='8'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-8.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 216, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active[data-num='9'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-planet-9.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active.earth[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/earth2-0.svg");
  background-size: 150px 150px;
  width: 150px;
  height: 150px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active.earth[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/earth2-1.svg");
  background-size: 150px 150px;
  width: 150px;
  height: 150px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active.earth[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/earth2-2.svg");
  background-size: 150px 150px;
  width: 150px;
  height: 150px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active.earth[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/earth2-3.svg");
  background-size: 150px 150px;
  width: 150px;
  height: 150px;
}

/* line 223, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.active.earth[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/earth2-4.svg");
  background-size: 150px 150px;
  width: 150px;
  height: 150px;
}

/* line 232, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.inactive[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-planet-0.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 232, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.inactive[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-planet-1.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 232, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .planet.inactive[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-planet-2.svg");
  background-size: 110px 110px;
  width: 110px;
  height: 110px;
}

/* line 239, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon {
  position: absolute;
}

/* line 244, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.active[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-moon-0.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 248, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.inactive[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-moon-0.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 252, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.drop-down[data-num='0'] {
  -webkit-transition: all 1000ms ease-in-out 0ms;
  -moz-transition: all 1000ms ease-in-out 0ms;
  -ms-transition: all 1000ms ease-in-out 0ms;
  -o-transition: all 1000ms ease-in-out 0ms;
  transition: all 1000ms ease-in-out 0ms;
}

/* line 244, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.active[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-moon-1.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 248, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.inactive[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-moon-1.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 252, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.drop-down[data-num='1'] {
  -webkit-transition: all 1000ms ease-in-out 25ms;
  -moz-transition: all 1000ms ease-in-out 25ms;
  -ms-transition: all 1000ms ease-in-out 25ms;
  -o-transition: all 1000ms ease-in-out 25ms;
  transition: all 1000ms ease-in-out 25ms;
}

/* line 244, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.active[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-moon-2.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 248, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.inactive[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-moon-2.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 252, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.drop-down[data-num='2'] {
  -webkit-transition: all 1000ms ease-in-out 50ms;
  -moz-transition: all 1000ms ease-in-out 50ms;
  -ms-transition: all 1000ms ease-in-out 50ms;
  -o-transition: all 1000ms ease-in-out 50ms;
  transition: all 1000ms ease-in-out 50ms;
}

/* line 244, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.active[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-moon-3.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 248, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.inactive[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-moon-3.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 252, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.drop-down[data-num='3'] {
  -webkit-transition: all 1000ms ease-in-out 75ms;
  -moz-transition: all 1000ms ease-in-out 75ms;
  -ms-transition: all 1000ms ease-in-out 75ms;
  -o-transition: all 1000ms ease-in-out 75ms;
  transition: all 1000ms ease-in-out 75ms;
}

/* line 244, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.active[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/active-moon-4.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 248, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.inactive[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/inactive-moon-4.svg");
  background-size: 70px 70px;
  width: 70px;
  height: 70px;
}

/* line 252, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.drop-down[data-num='4'] {
  -webkit-transition: all 1000ms ease-in-out 100ms;
  -moz-transition: all 1000ms ease-in-out 100ms;
  -ms-transition: all 1000ms ease-in-out 100ms;
  -o-transition: all 1000ms ease-in-out 100ms;
  transition: all 1000ms ease-in-out 100ms;
}

/* line 258, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .moon.no-margin {
  margin-right: -70px;
}

/* line 263, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .zearn-input {
  min-width: 66px;
  height: 58px;
  padding-top: 7px;
}

/* line 268, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .zearn-input:not(.correct):not(.correct-done):not(.try-again):not(.incorrect):not(.incorrect-done):not(.unknown) {
  background-color: white;
}

/* line 273, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .zearn-input:not(.full):not(.inactive):not(.correct):not(.incorrect):not(:empty) {
  padding-left: 10px;
}

/* line 278, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .label, .skip-counting.task-container .zearn-input {
  font-size: 30px;
  font-weight: bold;
  -webkit-transition: margin-top 500ms ease-in-out, opacity 500ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out, color 300ms ease-in-out;
  -moz-transition: margin-top 500ms ease-in-out, opacity 500ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out, color 300ms ease-in-out;
  -ms-transition: margin-top 500ms ease-in-out, opacity 500ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out, color 300ms ease-in-out;
  -o-transition: margin-top 500ms ease-in-out, opacity 500ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out, color 300ms ease-in-out;
  transition: margin-top 500ms ease-in-out, opacity 500ms ease-in-out, background-color 300ms ease-in-out, border-color 300ms ease-in-out, color 300ms ease-in-out;
}

/* line 283, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .label.hidden, .skip-counting.task-container .zearn-input.hidden {
  margin-top: 10px;
  opacity: 0;
}

/* line 288, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .label.disappear, .skip-counting.task-container .zearn-input.disappear {
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
  opacity: 0;
}

/* line 294, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.task-container .pulse {
  position: absolute;
  opacity: 0;
  top: 0px;
  background-color: white;
  width: 150px;
  height: 100%;
  border-radius: 50%;
  -webkit-animation: whitePulse 1000ms ease-in-out;
  -moz-animation: whitePulse 1000ms ease-in-out;
  -ms-animation: whitePulse 1000ms ease-in-out;
  -o-animation: whitePulse 1000ms ease-in-out;
  animation: whitePulse 1000ms ease-in-out;
}

@-webkit-keyframes whitePulse {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }
}

@-moz-keyframes whitePulse {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }
}

@-o-keyframes whitePulse {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }
}

@keyframes whitePulse {
  0% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.8);
    -moz-transform: scale(1.8);
    -ms-transform: scale(1.8);
    -o-transform: scale(1.8);
    transform: scale(1.8);
    opacity: 0;
  }
}

/* line 317, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group {
  height: 590px;
}

/* line 321, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .bg-layer {
  top: -590px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/title-background.svg");
  background-size: 960px 1180px;
  width: 960px;
  height: 1180px;
}

/* line 326, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .bg-planets {
  left: 0;
  top: 0;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/title-planets2.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 332, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .purple-layer {
  height: 590px;
  width: 960px;
  background-color: #2b004d;
  opacity: 0;
}

/* line 339, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .ns-welcome-button {
  left: 758px;
  top: 110px;
  width: 100px;
  height: 100px;
  -webkit-transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;
  transition: opacity 300ms ease-in-out, filter 300ms ease-in-out;
}

/* line 347, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .ape {
  left: 387px;
  top: 200px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/title-ape.svg");
  background-size: 418px 390px;
  width: 418px;
  height: 390px;
}

/* line 353, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .tiger {
  left: 75px;
  top: 320px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/title-tiger.svg");
  background-size: 292px 204px;
  width: 292px;
  height: 204px;
}

/* line 359, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .pig {
  left: 795px;
  top: 190px;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/title-pig.svg");
  background-size: 92px 106px;
  width: 92px;
  height: 106px;
}

/* line 366, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.animate-animals .ape {
  -webkit-animation: floatApe 10000ms ease-in-out infinite;
  -moz-animation: floatApe 10000ms ease-in-out infinite;
  -ms-animation: floatApe 10000ms ease-in-out infinite;
  -o-animation: floatApe 10000ms ease-in-out infinite;
  animation: floatApe 10000ms ease-in-out infinite;
}

/* line 369, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.animate-animals .tiger {
  -webkit-animation: floatTiger 10000ms ease-in-out infinite;
  -moz-animation: floatTiger 10000ms ease-in-out infinite;
  -ms-animation: floatTiger 10000ms ease-in-out infinite;
  -o-animation: floatTiger 10000ms ease-in-out infinite;
  animation: floatTiger 10000ms ease-in-out infinite;
}

/* line 372, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.animate-animals .pig {
  -webkit-animation: floatPig 10000ms ease-in-out infinite;
  -moz-animation: floatPig 10000ms ease-in-out infinite;
  -ms-animation: floatPig 10000ms ease-in-out infinite;
  -o-animation: floatPig 10000ms ease-in-out infinite;
  animation: floatPig 10000ms ease-in-out infinite;
}

/* line 377, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .bg-layer, .skip-counting.number-sense-task-group .ns-welcome .bg-planets, .skip-counting.number-sense-task-group .ns-welcome .purple-layer, .skip-counting.number-sense-task-group .ns-welcome .ns-welcome-button, .skip-counting.number-sense-task-group .ns-welcome .ape, .skip-counting.number-sense-task-group .ns-welcome .tiger, .skip-counting.number-sense-task-group .ns-welcome .pig, .skip-counting.number-sense-task-group .ns-welcome .title {
  position: absolute;
}

/* line 381, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .title {
  left: 203px;
  top: 30px;
  font-family: "cubano", "Arial Black", sans-serif;
  color: #ffff73;
  text-align: center;
  -webkit-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  -o-transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
  transition: opacity 1000ms ease-in-out, filter 1000ms ease-in-out;
}

/* line 389, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .title .title-count {
  letter-spacing: 2px;
  font-size: 184px;
  line-height: 134px;
}

/* line 395, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome .title .title-cosmos {
  font-size: 92px;
  letter-spacing: 1px;
  line-height: 106px;
}

/* line 403, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .purple-layer {
  opacity: 1;
}

/* line 406, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .ns-welcome-button, .skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .title {
  opacity: 0;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 410, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .bg-layer {
  top: 0px;
}

/* line 413, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .bg-planets {
  top: 113px;
}

/* line 416, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .ape {
  top: 500px;
}

/* line 419, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .tiger {
  top: 520px;
}

/* line 422, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .pig {
  top: 290px;
}

/* line 425, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .bg-layer, .skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .bg-planets, .skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .ape, .skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .tiger, .skip-counting.number-sense-task-group .ns-welcome.slide-and-fade .pig {
  opacity: 0;
  -webkit-transition: top 2000ms ease-in-out, opacity 1000ms ease-in-out 1000ms;
  -moz-transition: top 2000ms ease-in-out, opacity 1000ms ease-in-out 1000ms;
  -ms-transition: top 2000ms ease-in-out, opacity 1000ms ease-in-out 1000ms;
  -o-transition: top 2000ms ease-in-out, opacity 1000ms ease-in-out 1000ms;
  transition: top 2000ms ease-in-out, opacity 1000ms ease-in-out 1000ms;
}

/* line 431, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.ease-purple-layer {
  z-index: 1;
  -webkit-transition: opacity 2000ms ease-in-out;
  -moz-transition: opacity 2000ms ease-in-out;
  -ms-transition: opacity 2000ms ease-in-out;
  -o-transition: opacity 2000ms ease-in-out;
  transition: opacity 2000ms ease-in-out;
}

/* line 437, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-welcome.fade-back .purple-layer {
  opacity: 0;
  -webkit-transition: opacity 1000ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out;
  -o-transition: opacity 1000ms ease-in-out;
  transition: opacity 1000ms ease-in-out;
}

/* line 445, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group.remediating .stars, .skip-counting.number-sense-task-group.remediating .purple-haze, .skip-counting.number-sense-task-group.remediating .astronaut, .skip-counting.number-sense-task-group.remediating .spaceship {
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -ms-filter: blur(5px);
  -o-filter: blur(5px);
  filter: blur(5px);
}

/* line 449, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group.remediating .ns-main .astronaut, .skip-counting.number-sense-task-group.remediating .ns-main .rocket-wrapper {
  z-index: 1;
}

/* line 453, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group.remediating .blur-layer {
  opacity: 0.7;
  z-index: 2;
}

/* line 459, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main {
  display: block;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/space_bg.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 464, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main.hidden {
  opacity: 0;
}

/* line 468, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rem-highlight {
  top: 0;
  border-radius: 50%;
  background-color: #ffff73;
  position: absolute;
  width: 150px;
  height: 100%;
  opacity: 0;
  z-index: 2;
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

/* line 479, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rem-highlight.appear {
  opacity: 1;
}

/* line 484, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .purple-haze {
  top: 0px;
  position: absolute;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/purple_haze_bg.svg");
  background-size: 960px 590px;
  width: 960px;
  height: 590px;
}

/* line 490, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .stars {
  left: 0px;
  top: -1180px;
  position: absolute;
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/stars_bg.svg");
  background-size: 4800px 2950px;
  width: 4800px;
  height: 2950px;
  -webkit-transition: left 1000ms ease-in-out;
  -moz-transition: left 1000ms ease-in-out;
  -ms-transition: left 1000ms ease-in-out;
  -o-transition: left 1000ms ease-in-out;
  transition: left 1000ms ease-in-out;
}

/* line 497, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .stars.initial-shift {
  left: -1250px;
}

/* line 501, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .stars.fast-pan {
  -webkit-transition: left 500ms ease-in-out;
  -moz-transition: left 500ms ease-in-out;
  -ms-transition: left 500ms ease-in-out;
  -o-transition: left 500ms ease-in-out;
  transition: left 500ms ease-in-out;
}

/* line 506, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame {
  position: absolute;
  width: 80px;
  height: 80px;
  border-radius: 40px;
  opacity: 0;
  background: linear-gradient(rgba(247, 107, 28, 0) 15%, rgba(247, 107, 28, 0.75) 40%, #fbda61);
  z-index: 3;
}

/* line 515, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down {
  -webkit-transition: -webkit-transform 1000ms ease-in-out;
  -moz-transition: -moz-transform 1000ms ease-in-out;
  -o-transition: -o-transform 1000ms ease-in-out;
  transition: transform 1000ms ease-in-out;
  -webkit-animation: dropFlame 1100ms ease-in-out;
  -moz-animation: dropFlame 1100ms ease-in-out;
  -ms-animation: dropFlame 1100ms ease-in-out;
  -o-animation: dropFlame 1100ms ease-in-out;
  animation: dropFlame 1100ms ease-in-out;
}

/* line 519, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker {
  z-index: 1;
  -webkit-animation: dropFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out 300ms infinite;
  -moz-animation: dropFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out 300ms infinite;
  -ms-animation: dropFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out 300ms infinite;
  -o-animation: dropFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out 300ms infinite;
  animation: dropFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out 300ms infinite;
}

/* line 525, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down[data-num='0'] {
  transition-delay: 0ms;
  animation-delay: 0ms;
}

/* line 529, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker[data-num='0'] {
  animation-delay: 0ms, 300ms;
}

/* line 525, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down[data-num='1'] {
  transition-delay: 25ms;
  animation-delay: 25ms;
}

/* line 529, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker[data-num='1'] {
  animation-delay: 25ms, 325ms;
}

/* line 525, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down[data-num='2'] {
  transition-delay: 50ms;
  animation-delay: 50ms;
}

/* line 529, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker[data-num='2'] {
  animation-delay: 50ms, 350ms;
}

/* line 525, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down[data-num='3'] {
  transition-delay: 75ms;
  animation-delay: 75ms;
}

/* line 529, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker[data-num='3'] {
  animation-delay: 75ms, 375ms;
}

/* line 525, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down[data-num='4'] {
  transition-delay: 100ms;
  animation-delay: 100ms;
}

/* line 529, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.drop-down.flicker[data-num='4'] {
  animation-delay: 100ms, 400ms;
}

/* line 536, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in {
  -webkit-transition: -webkit-transform 1000ms ease-in-out;
  -moz-transition: -moz-transform 1000ms ease-in-out;
  -o-transition: -o-transform 1000ms ease-in-out;
  transition: transform 1000ms ease-in-out;
  -webkit-animation: flyInFlame 1100ms ease-in-out;
  -moz-animation: flyInFlame 1100ms ease-in-out;
  -ms-animation: flyInFlame 1100ms ease-in-out;
  -o-animation: flyInFlame 1100ms ease-in-out;
  animation: flyInFlame 1100ms ease-in-out;
}

/* line 540, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker {
  z-index: 1;
  -webkit-animation: flyInFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out infinite;
  -moz-animation: flyInFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out infinite;
  -ms-animation: flyInFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out infinite;
  -o-animation: flyInFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out infinite;
  animation: flyInFlame 1100ms ease-in-out, flickerFlame 200ms ease-in-out infinite;
}

/* line 546, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in[data-num='0'] {
  transition-delay: 0ms;
  animation-delay: 0ms;
}

/* line 550, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker[data-num='0'] {
  animation-delay: 0ms, 0ms;
}

/* line 546, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in[data-num='1'] {
  transition-delay: 25ms;
  animation-delay: 25ms;
}

/* line 550, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker[data-num='1'] {
  animation-delay: 25ms, 25ms;
}

/* line 546, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in[data-num='2'] {
  transition-delay: 50ms;
  animation-delay: 50ms;
}

/* line 550, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker[data-num='2'] {
  animation-delay: 50ms, 50ms;
}

/* line 546, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in[data-num='3'] {
  transition-delay: 75ms;
  animation-delay: 75ms;
}

/* line 550, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker[data-num='3'] {
  animation-delay: 75ms, 75ms;
}

/* line 546, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in[data-num='4'] {
  transition-delay: 100ms;
  animation-delay: 100ms;
}

/* line 550, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .flame.fly-in.flicker[data-num='4'] {
  animation-delay: 100ms, 100ms;
}

/* line 558, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper {
  left: 10px;
  top: 433px;
  z-index: 4;
  position: absolute;
  -webkit-transition: z-index 500ms ease-in-out, top 2000ms ease-in-out, left 2000ms ease-in-out;
  -moz-transition: z-index 500ms ease-in-out, top 2000ms ease-in-out, left 2000ms ease-in-out;
  -ms-transition: z-index 500ms ease-in-out, top 2000ms ease-in-out, left 2000ms ease-in-out;
  -o-transition: z-index 500ms ease-in-out, top 2000ms ease-in-out, left 2000ms ease-in-out;
  transition: z-index 500ms ease-in-out, top 2000ms ease-in-out, left 2000ms ease-in-out;
}

/* line 565, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper.float-down {
  -webkit-animation: bobRocket 1000ms ease-in-out;
  -moz-animation: bobRocket 1000ms ease-in-out;
  -ms-animation: bobRocket 1000ms ease-in-out;
  -o-animation: bobRocket 1000ms ease-in-out;
  animation: bobRocket 1000ms ease-in-out;
}

/* line 568, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper.float-down.fast-pan {
  -webkit-animation: bobRocket 500ms ease-in-out;
  -moz-animation: bobRocket 500ms ease-in-out;
  -ms-animation: bobRocket 500ms ease-in-out;
  -o-animation: bobRocket 500ms ease-in-out;
  animation: bobRocket 500ms ease-in-out;
}

/* line 573, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper.bob-down {
  -webkit-animation: bobRocket 2000ms ease-in-out;
  -moz-animation: bobRocket 2000ms ease-in-out;
  -ms-animation: bobRocket 2000ms ease-in-out;
  -o-animation: bobRocket 2000ms ease-in-out;
  animation: bobRocket 2000ms ease-in-out;
}

/* line 577, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper.off-screen {
  left: -412px;
  top: 360px;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 583, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper.rotate-away {
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  -webkit-transform: rotate(-20deg);
  -moz-transform: rotate(-20deg);
  -ms-transform: rotate(-20deg);
  -o-transform: rotate(-20deg);
  transform: rotate(-20deg);
  top: 565px;
  left: -450px;
}

/* line 590, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .flame {
  position: relative;
  top: -158px;
  left: -178px;
  width: 70px;
  height: 210px;
  z-index: 0;
  opacity: 0.5;
  -webkit-transform: rotate(-100deg);
  -moz-transform: rotate(-100deg);
  -ms-transform: rotate(-100deg);
  -o-transform: rotate(-100deg);
  transform: rotate(-100deg);
}

/* line 600, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .flame.flicker {
  top: 51px;
  -webkit-animation: flickerFlame 200ms ease-in-out infinite;
  -moz-animation: flickerFlame 200ms ease-in-out infinite;
  -ms-animation: flickerFlame 200ms ease-in-out infinite;
  -o-animation: flickerFlame 200ms ease-in-out infinite;
  animation: flickerFlame 200ms ease-in-out infinite;
}

/* line 606, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship {
  top: -438px;
  left: -54px;
  padding: 66px 46px 0px 0px;
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
  transform: rotate(-10deg);
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/spaceship.svg");
  background-size: 412px 247px;
  width: 412px;
  height: 247px;
  -webkit-transition: filter 500ms ease-in-out;
  -moz-transition: filter 500ms ease-in-out;
  -ms-transition: filter 500ms ease-in-out;
  -o-transition: filter 500ms ease-in-out;
  transition: filter 500ms ease-in-out;
}

/* line 617, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window {
  border-radius: 50%;
  margin-right: 8px;
  width: 42px;
  height: 42px;
  background-color: #11274c;
}

/* line 624, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window.closed {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window-closed.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 630, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window2-0.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 630, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window2-1.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 630, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window2-2.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 630, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window2-3.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 630, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/window2-4.svg");
  background-size: 42px 42px;
  width: 42px;
  height: 42px;
}

/* line 635, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .rocket-wrapper .spaceship .window .character.empty {
  opacity: 0;
  -webkit-transition: opacity 300ms ease-in-out;
  -moz-transition: opacity 300ms ease-in-out;
  -ms-transition: opacity 300ms ease-in-out;
  -o-transition: opacity 300ms ease-in-out;
  transition: opacity 300ms ease-in-out;
}

/* line 645, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main.transition-flight .stars {
  -webkit-transition: left 5000ms ease-in-out;
  -moz-transition: left 5000ms ease-in-out;
  -ms-transition: left 5000ms ease-in-out;
  -o-transition: left 5000ms ease-in-out;
  transition: left 5000ms ease-in-out;
}

/* line 648, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main.transition-flight .rocket-wrapper {
  top: 188px;
  left: 330px;
}

/* line 654, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut {
  position: absolute;
  z-index: 4;
  left: 50px;
  top: 73px;
  -webkit-transition: all 1000ms ease-in-out, opacity 1ms ease-in-out, filter 500ms ease-in-out, z-index 0ms ease-in-out 400ms;
  -moz-transition: all 1000ms ease-in-out, opacity 1ms ease-in-out, filter 500ms ease-in-out, z-index 0ms ease-in-out 400ms;
  -ms-transition: all 1000ms ease-in-out, opacity 1ms ease-in-out, filter 500ms ease-in-out, z-index 0ms ease-in-out 400ms;
  -o-transition: all 1000ms ease-in-out, opacity 1ms ease-in-out, filter 500ms ease-in-out, z-index 0ms ease-in-out 400ms;
  transition: all 1000ms ease-in-out, opacity 1ms ease-in-out, filter 500ms ease-in-out, z-index 0ms ease-in-out 400ms;
}

/* line 662, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/astronauts-sprite-0.svg");
  background-size: 750px 200px;
  width: 750px;
  height: 200px;
  width: 160px;
  height: 150px;
  background-position: -250px 0px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  width: 120px;
  height: 170px;
  background-position: -500px 0px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  width: 211px;
  height: 178px;
  background-position: 0px 0px;
}

/* line 662, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/astronauts-sprite-1.svg");
  background-size: 750px 200px;
  width: 750px;
  height: 200px;
  width: 160px;
  height: 150px;
  background-position: -250px 0px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  width: 120px;
  height: 170px;
  background-position: -500px 0px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  width: 211px;
  height: 178px;
  background-position: 0px 0px;
}

/* line 662, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/astronauts-sprite-2.svg");
  background-size: 750px 200px;
  width: 750px;
  height: 200px;
  width: 160px;
  height: 150px;
  background-position: -250px 0px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  width: 120px;
  height: 170px;
  background-position: -500px 0px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  width: 211px;
  height: 178px;
  background-position: 0px 0px;
}

/* line 662, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/astronauts-sprite-3.svg");
  background-size: 750px 200px;
  width: 750px;
  height: 200px;
  width: 160px;
  height: 150px;
  background-position: -250px 0px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  width: 120px;
  height: 170px;
  background-position: -500px 0px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  width: 211px;
  height: 178px;
  background-position: 0px 0px;
}

/* line 662, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/astronauts-sprite-4.svg");
  background-size: 750px 200px;
  width: 750px;
  height: 200px;
  width: 160px;
  height: 150px;
  background-position: -250px 0px;
}

/* line 669, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  width: 120px;
  height: 170px;
  background-position: -500px 0px;
}

/* line 674, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  width: 211px;
  height: 178px;
  background-position: 0px 0px;
}

/* line 682, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.inactive {
  opacity: 0;
  top: 440px;
  z-index: 3;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/* line 689, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.floating {
  -webkit-animation: floatAstronaut 2500ms ease-in-out infinite;
  -moz-animation: floatAstronaut 2500ms ease-in-out infinite;
  -ms-animation: floatAstronaut 2500ms ease-in-out infinite;
  -o-animation: floatAstronaut 2500ms ease-in-out infinite;
  animation: floatAstronaut 2500ms ease-in-out infinite;
}

@-webkit-keyframes floatAstronaut {
  0%, 100% {
    top: 68px;
  }
  50% {
    top: 78px;
  }
}

@-moz-keyframes floatAstronaut {
  0%, 100% {
    top: 68px;
  }
  50% {
    top: 78px;
  }
}

@-o-keyframes floatAstronaut {
  0%, 100% {
    top: 68px;
  }
  50% {
    top: 78px;
  }
}

@keyframes floatAstronaut {
  0%, 100% {
    top: 68px;
  }
  50% {
    top: 78px;
  }
}

/* line 701, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.on-home-planet {
  top: 91px;
  -webkit-transform: rotate(-21deg);
  -moz-transform: rotate(-21deg);
  -ms-transform: rotate(-21deg);
  -o-transform: rotate(-21deg);
  transform: rotate(-21deg);
}

/* line 705, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.on-home-planet.count-up {
  left: 499px;
}

/* line 708, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.on-home-planet.count-down {
  left: 299px;
}

/* line 713, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success {
  top: 85px;
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  -o-transition: none;
  transition: none;
}

/* line 717, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.count-up {
  left: 528px;
}

/* line 720, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.count-down {
  left: 328px;
}

/* line 724, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.final {
  top: 81px;
}

/* line 728, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .ns-main .astronaut.success.finish {
  -webkit-transition: all 1000ms ease-in-out;
  -moz-transition: all 1000ms ease-in-out;
  -ms-transition: all 1000ms ease-in-out;
  -o-transition: all 1000ms ease-in-out;
  transition: all 1000ms ease-in-out;
  left: 428px;
  top: 148px;
  -webkit-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -moz-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -ms-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  -o-animation: floatCenterPlanet 2000ms ease-in-out infinite;
  animation: floatCenterPlanet 2000ms ease-in-out infinite;
}

/* line 738, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .blur-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #2b004d;
  opacity: 0;
  -webkit-transition: all 500ms ease-in-out, z-index 0ms ease-in-out;
  -moz-transition: all 500ms ease-in-out, z-index 0ms ease-in-out;
  -ms-transition: all 500ms ease-in-out, z-index 0ms ease-in-out;
  -o-transition: all 500ms ease-in-out, z-index 0ms ease-in-out;
  transition: all 500ms ease-in-out, z-index 0ms ease-in-out;
}

/* line 747, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish {
  display: none;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background-color: transparent;
}

/* line 756, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet {
  position: absolute;
  top: 200px;
  -webkit-transition: top 1000ms ease-in-out;
  -moz-transition: top 1000ms ease-in-out;
  -ms-transition: top 1000ms ease-in-out;
  -o-transition: top 1000ms ease-in-out;
  transition: top 1000ms ease-in-out;
}

/* line 762, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet[data-num='0'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/zearned-planet-0.svg");
  background-size: 100px 190px;
  width: 100px;
  height: 190px;
}

/* line 762, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet[data-num='1'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/zearned-planet-1.svg");
  background-size: 100px 190px;
  width: 100px;
  height: 190px;
}

/* line 762, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet[data-num='2'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/zearned-planet-2.svg");
  background-size: 100px 190px;
  width: 100px;
  height: 190px;
}

/* line 762, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet[data-num='3'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/zearned-planet-3.svg");
  background-size: 100px 190px;
  width: 100px;
  height: 190px;
}

/* line 762, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet[data-num='4'] {
  background-repeat: no-repeat;
  background-color: transparent;
  background-position: center;
  background-image: url("//webassets.zearn.org/app_assets/number_sense/skip_counting/zearned-planet-4.svg");
  background-size: 100px 190px;
  width: 100px;
  height: 190px;
}

/* line 767, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet:nth-child(1) {
  left: 605px;
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  -o-transform: rotate(10deg);
  transform: rotate(10deg);
  -webkit-animation: floatPlanets1 2000ms ease-in-out infinite;
  -moz-animation: floatPlanets1 2000ms ease-in-out infinite;
  -ms-animation: floatPlanets1 2000ms ease-in-out infinite;
  -o-animation: floatPlanets1 2000ms ease-in-out infinite;
  animation: floatPlanets1 2000ms ease-in-out infinite;
}

/* line 773, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet:nth-child(2) {
  left: 255px;
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  -o-transform: rotate(-10deg);
  transform: rotate(-10deg);
  -webkit-animation: floatPlanets1 2000ms ease-in-out infinite;
  -moz-animation: floatPlanets1 2000ms ease-in-out infinite;
  -ms-animation: floatPlanets1 2000ms ease-in-out infinite;
  -o-animation: floatPlanets1 2000ms ease-in-out infinite;
  animation: floatPlanets1 2000ms ease-in-out infinite;
}

/* line 779, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet:nth-child(3) {
  left: 722px;
  -webkit-transform: rotate(20deg) scale(0.75);
  -moz-transform: rotate(20deg) scale(0.75);
  -ms-transform: rotate(20deg) scale(0.75);
  -o-transform: rotate(20deg) scale(0.75);
  transform: rotate(20deg) scale(0.75);
  -webkit-animation: floatPlanets2 2000ms ease-in-out infinite;
  -moz-animation: floatPlanets2 2000ms ease-in-out infinite;
  -ms-animation: floatPlanets2 2000ms ease-in-out infinite;
  -o-animation: floatPlanets2 2000ms ease-in-out infinite;
  animation: floatPlanets2 2000ms ease-in-out infinite;
}

/* line 785, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet:nth-child(4) {
  left: 137px;
  -webkit-transform: rotate(-20deg) scale(0.75);
  -moz-transform: rotate(-20deg) scale(0.75);
  -ms-transform: rotate(-20deg) scale(0.75);
  -o-transform: rotate(-20deg) scale(0.75);
  transform: rotate(-20deg) scale(0.75);
  -webkit-animation: floatPlanets2 2000ms ease-in-out infinite;
  -moz-animation: floatPlanets2 2000ms ease-in-out infinite;
  -ms-animation: floatPlanets2 2000ms ease-in-out infinite;
  -o-animation: floatPlanets2 2000ms ease-in-out infinite;
  animation: floatPlanets2 2000ms ease-in-out infinite;
}

/* line 791, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .zearned-planet.off-screen {
  top: 590px;
}

/* line 796, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .fluency-complete-buttons {
  z-index: 2;
  display: block;
  position: relative;
  top: 180px;
  opacity: 0;
}

/* line 803, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .fluency-complete-buttons.fade-in {
  opacity: 1;
  -webkit-transition: opacity 500ms ease-in-out;
  -moz-transition: opacity 500ms ease-in-out;
  -ms-transition: opacity 500ms ease-in-out;
  -o-transition: opacity 500ms ease-in-out;
  transition: opacity 500ms ease-in-out;
}

/* line 808, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area {
  width: 450px;
}

/* line 811, app/assets/stylesheets/number_sense_activities/skip_counting.scss */
.skip-counting.number-sense-task-group .number-sense-finish .fluency-complete-buttons .activity-complete-buttons-area .acb-zearned-it {
  color: #ffff73;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  font-size: 90px;
  font-weight: lighter;
  position: relative;
  top: -284px;
}
/* line 4, app/assets/stylesheets/curriculum/curriculum.scss */
body.curriculum .main-content {
  margin: 0;
}
/* line 7, app/assets/stylesheets/teacher_welcome/teacher_welcome.scss */
body.teacher_welcome {
  background-color: #ebebeb;
}

/* line 10, app/assets/stylesheets/teacher_welcome/teacher_welcome.scss */
body.teacher_welcome .main-content {
  margin: 0px auto;
  width: 1024px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 16, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  background-color: #ebebeb;
}

/* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session #top-space {
  height: 70px;
  margin-bottom: 8px;
}

@media only screen and (device-width: 768px) {
  /* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
  body.pd-session #top-space {
    /* For iPad */
    height: 0px;
  }
}

/* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar {
  position: fixed;
  width: 100%;
  height: 70px;
  background-color: #fff;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
  z-index: 16000;
  -webkit-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -moz-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -ms-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -o-box-shadow: 1px 5px 6px -1px #b3b3b3;
  box-shadow: 1px 5px 6px -1px #b3b3b3;
}

@media only screen and (device-width: 768px) {
  /* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
  body.pd-session .navbar {
    /* For iPad */
    position: relative;
  }
}

/* line 31, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .back {
  display: inline-block;
  height: 70px;
}

/* line 35, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .back .zearn-logo, body.pd-session .navbar .back .zearn-home {
  display: inline-block;
  position: relative;
  top: -2px;
}

/* line 42, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .actions {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 2;
  font-size: 0;
}

/* line 50, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a {
  height: 70px;
  display: inline-block;
  margin-left: 8px;
}

/* line 55, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a:hover .btn, body.pd-session .navbar a:active .btn {
  border: 2px solid #005c73;
  color: #005c73;
}

/* line 59, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a:hover .btn.signout-btn, body.pd-session .navbar a:hover .btn.action-btn, body.pd-session .navbar a:active .btn.signout-btn, body.pd-session .navbar a:active .btn.action-btn {
  color: white;
  background-color: #005c73;
}

/* line 67, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .btn {
  display: inline-block;
  height: 29px;
  line-height: 25px;
  border: 1px solid #007b94;
  color: #007b94;
  min-width: 104px;
  text-align: center;
  border-radius: 15px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  position: relative;
  top: -2px;
}

/* line 82, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .btn.signout-btn, body.pd-session .navbar .btn.action-btn {
  background-color: #007b94;
  color: #fff;
}

/* line 21, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .main-content {
  margin-top: 90px;
}

/* line 26, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice {
  width: 960px;
}

/* line 29, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice .tasks-page {
  width: 960px;
}

/* line 33, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice .zearn-keypad {
  width: 960px;
}

/* line 38, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad {
  background-color: #f6f6f6;
}

/* line 41, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button, body.pd-session .zearn-keypad .zearn-keypad-choice {
  border-radius: 25px;
}

/* line 44, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter {
  width: 125px;
}

/* line 47, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .standard-button-inner > span::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .standard-button-inner > span::before {
  content: 'Continue';
  font-weight: normal;
}

/* line 51, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .zearn-keypad-enter-text, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .zearn-keypad-enter-text {
  display: none;
}

/* line 52, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .zearn-keypad-enter-icon, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .zearn-keypad-enter-icon {
  transform: translatey(2px);
}

/* line 55, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back {
  position: relative;
  width: 125px;
  color: #007b94;
  border: 2px solid #007b94;
  background: none;
}

/* line 62, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back::before {
  position: absolute;
  content: '';
  width: 18px;
  height: 18px;
  left: 18px;
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -15px -53px;
}

/* line 70, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back::after, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back::after {
  content: "Back";
  font-size: 18px;
  font-weight: normal;
  margin-left: 18px;
}

/* line 76, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back:hover, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back:hover {
  border-color: #005c73;
  color: #005c73;
}

/* line 79, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back:hover::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back:hover::before {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -53px -53px;
}

/* line 83, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back.inactive, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back.inactive {
  color: #cccccc;
  border-color: #cccccc;
}

/* line 86, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back.inactive::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back.inactive::before {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -91px -53px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 16, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  background-color: #ebebeb;
}

/* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session #top-space {
  height: 70px;
  margin-bottom: 8px;
}

@media only screen and (device-width: 768px) {
  /* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
  body.pd-session #top-space {
    /* For iPad */
    height: 0px;
  }
}

/* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar {
  position: fixed;
  width: 100%;
  height: 70px;
  background-color: #fff;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
  z-index: 16000;
  -webkit-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -moz-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -ms-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -o-box-shadow: 1px 5px 6px -1px #b3b3b3;
  box-shadow: 1px 5px 6px -1px #b3b3b3;
}

@media only screen and (device-width: 768px) {
  /* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
  body.pd-session .navbar {
    /* For iPad */
    position: relative;
  }
}

/* line 31, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .back {
  display: inline-block;
  height: 70px;
}

/* line 35, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .back .zearn-logo, body.pd-session .navbar .back .zearn-home {
  display: inline-block;
  position: relative;
  top: -2px;
}

/* line 42, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .actions {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 2;
  font-size: 0;
}

/* line 50, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a {
  height: 70px;
  display: inline-block;
  margin-left: 8px;
}

/* line 55, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a:hover .btn, body.pd-session .navbar a:active .btn {
  border: 2px solid #005c73;
  color: #005c73;
}

/* line 59, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar a:hover .btn.signout-btn, body.pd-session .navbar a:hover .btn.action-btn, body.pd-session .navbar a:active .btn.signout-btn, body.pd-session .navbar a:active .btn.action-btn {
  color: white;
  background-color: #005c73;
}

/* line 67, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .btn {
  display: inline-block;
  height: 29px;
  line-height: 25px;
  border: 1px solid #007b94;
  color: #007b94;
  min-width: 104px;
  text-align: center;
  border-radius: 15px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  position: relative;
  top: -2px;
}

/* line 82, app/assets/stylesheets/shared/guided_practice_nav.scss */
body.pd-session .navbar .btn.signout-btn, body.pd-session .navbar .btn.action-btn {
  background-color: #007b94;
  color: #fff;
}

/* line 21, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .main-content {
  margin-top: 90px;
}

/* line 26, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice {
  width: 960px;
}

/* line 29, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice .tasks-page {
  width: 960px;
}

/* line 33, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session #guided-practice .zearn-keypad {
  width: 960px;
}

/* line 38, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad {
  background-color: #f6f6f6;
}

/* line 41, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button, body.pd-session .zearn-keypad .zearn-keypad-choice {
  border-radius: 25px;
}

/* line 44, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter {
  width: 125px;
}

/* line 47, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .standard-button-inner > span::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .standard-button-inner > span::before {
  content: 'Continue';
  font-weight: normal;
}

/* line 51, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .zearn-keypad-enter-text, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .zearn-keypad-enter-text {
  display: none;
}

/* line 52, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-enter .zearn-keypad-enter-icon, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-enter .zearn-keypad-enter-icon {
  transform: translatey(2px);
}

/* line 55, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back {
  position: relative;
  width: 125px;
  color: #007b94;
  border: 2px solid #007b94;
  background: none;
}

/* line 62, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back::before {
  position: absolute;
  content: '';
  width: 18px;
  height: 18px;
  left: 18px;
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -15px -53px;
}

/* line 70, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back::after, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back::after {
  content: "Back";
  font-size: 18px;
  font-weight: normal;
  margin-left: 18px;
}

/* line 76, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back:hover, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back:hover {
  border-color: #005c73;
  color: #005c73;
}

/* line 79, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back:hover::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back:hover::before {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -53px -53px;
}

/* line 83, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back.inactive, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back.inactive {
  color: #cccccc;
  border-color: #cccccc;
}

/* line 86, app/assets/stylesheets/professional_development/pd_session.scss */
body.pd-session .zearn-keypad .standard-button.zearn-keypad-back.inactive::before, body.pd-session .zearn-keypad .zearn-keypad-choice.zearn-keypad-back.inactive::before {
  background-repeat: no-repeat;
  background-image: url("//webassets.zearn.org/app_assets/keypad/keypad_buttons.svg");
  background-size: 124px 120px;
  background-position: -91px -53px;
}

/* line 6, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .pages-image-container {
  width: 53%;
  height: 100%;
}

/* line 11, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .pages-image-container img {
  max-width: 100%;
  max-height: 100%;
}

/* line 20, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .teacher-materials .teacher-materials-note {
  font-size: 14px;
  font-weight: lighter;
  color: white;
  margin-top: 60px;
}

/* line 26, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .teacher-materials .teacher-materials-note a {
  font-weight: bold;
  color: #007b94;
}

/* line 29, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .teacher-materials .teacher-materials-note a:hover {
  color: #005c73;
}

/* line 34, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .teacher-materials .directions {
  min-height: 355px;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

/* line 39, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .teacher-materials .directions .directions-content {
  width: 100%;
}

/* line 43, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .directions {
  position: relative;
  border-top: 1px solid #303b40;
  font-size: 25px;
  line-height: 33px;
  margin-top: 15px;
  padding-top: 15px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-flex-grow: 1;
  flex-grow: 1;
}

/* line 56, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .directions.wide-padding {
  margin-top: 20px;
  padding-top: 35px;
}

/* line 61, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .directions.large {
  padding-bottom: 15px;
  font-weight: lighter;
  font-size: 36px;
  line-height: 40px;
  min-height: 300px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 70, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .directions.small {
  font-size: 25px;
}

/* line 75, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container {
  min-height: 585px;
  width: 960px;
}

/* line 80, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-container {
  width: 45%;
  height: 100%;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  text-align: left;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* line 90, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header {
  margin-top: 40px;
  font-size: 25px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

/* line 95, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header .header-text {
  font-weight: bold;
}

/* line 99, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header .top-aligned {
  position: relative;
  top: -8px;
}

/* line 105, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header {
  color: #fad232;
  font-size: 20px;
  text-transform: uppercase;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

/* line 111, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header .clock {
  background-image: url("//webassets.zearn.org/app_assets/professional_development/clock_yellow1.svg");
  width: 50px;
  height: 50px;
}

/* line 116, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header .notebook {
  background-image: url("//webassets.zearn.org/app_assets/professional_development/notebook_yellow1.svg");
  margin-left: 35px;
  height: 45px;
  width: 45px;
}

/* line 122, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-header .pages-to-read, body.pd-session .task-container.professional-development-directions .directions-header .clock-time {
  padding-left: 10px;
}

/* line 127, app/assets/stylesheets/professional_development/pd_tasks.scss */
body.pd-session .task-container.professional-development-directions .directions-container {
  padding-right: 40px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 3, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development {
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  background-color: #ebebeb;
}

/* line 7, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .icon-text-pair {
  display: flex;
}

/* line 10, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .icon-text-pair .pair-icon {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* line 17, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .icon-text-pair .pair-text {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 20px;
  width: 100%;
}

/* line 29, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .icon-text-pair .pair-text p {
  margin: 0;
}

/* line 31, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .icon-text-pair .pair-text p:not(.label) {
  font-size: 18px;
  font-weight: 100;
  color: #303b40;
}

/* line 40, app/assets/stylesheets/professional_development/professional_development.scss */
body.professional_development .instruction-item {
  margin-top: 20px;
  line-height: 21px;
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-moz-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-o-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes pulse {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
}

@-webkit-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-moz-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-o-keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@keyframes wobble {
  0% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  50% {
    -webkit-transform: rotate(4deg);
    -moz-transform: rotate(4deg);
    -ms-transform: rotate(4deg);
    -o-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  100% {
    -webkit-transform: rotate(-4deg);
    -moz-transform: rotate(-4deg);
    -ms-transform: rotate(-4deg);
    -o-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
}

@-webkit-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-moz-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-o-keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@keyframes jiggle {
  0% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(10deg);
    -moz-transform: translateX(2px) rotate(10deg);
    -ms-transform: translateX(2px) rotate(10deg);
    -o-transform: translateX(2px) rotate(10deg);
    transform: translateX(2px) rotate(10deg);
  }
  100% {
    -webkit-transform: translateX(-2px) rotate(-10deg);
    -moz-transform: translateX(-2px) rotate(-10deg);
    -ms-transform: translateX(-2px) rotate(-10deg);
    -o-transform: translateX(-2px) rotate(-10deg);
    transform: translateX(-2px) rotate(-10deg);
  }
}

@-webkit-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-moz-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-o-keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@keyframes nod {
  0% {
    margin-top: 0;
  }
  25% {
    margin-top: 3px;
  }
  50% {
    margin-top: 0;
  }
  75% {
    margin-top: -3px;
  }
  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-moz-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-o-keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@keyframes shake {
  0% {
    margin-left: 0;
  }
  25% {
    margin-left: 3px;
  }
  50% {
    margin-left: 0;
  }
  75% {
    margin-left: -3px;
  }
  100% {
    margin-left: 0;
  }
}

@-webkit-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashCorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-moz-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-o-keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@keyframes matBackgroundFlashIncorrect {
  0% {
    background-color: #f3fdff;
  }
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: #f3fdff;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashCorrect {
  50% {
    background-color: #ccffd9;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-moz-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-o-keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@keyframes whiteMatBackgroundFlashIncorrect {
  50% {
    background-color: #ffe3ee;
  }
  100% {
    background-color: white;
  }
}

@-webkit-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes initialInFadeOut {
  0% {
    opacity: 1;
  }
  83% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-moz-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-o-keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes initialOutFadeIn {
  0% {
    opacity: 0;
  }
  83% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* line 7, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations {
  font-family: "Source Sans Pro", Verdana, Geneva, sans-serif;
  background-color: #ebebeb;
}

/* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations #top-space {
  height: 46px;
  margin-bottom: 8px;
}

@media only screen and (device-width: 768px) {
  /* line 7, app/assets/stylesheets/shared/guided_practice_nav.scss */
  .classroom_presentations #top-space {
    /* For iPad */
    height: 0px;
  }
}

/* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar {
  position: fixed;
  width: 100%;
  height: 46px;
  background-color: #fff;
  font-family: Oxygen, Verdana, Geneva, sans-serif;
  -webkit-font-smoothing: subpixel-antialiased;
  z-index: 16000;
  -webkit-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -moz-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -ms-box-shadow: 1px 5px 6px -1px #b3b3b3;
  -o-box-shadow: 1px 5px 6px -1px #b3b3b3;
  box-shadow: 1px 5px 6px -1px #b3b3b3;
}

@media only screen and (device-width: 768px) {
  /* line 16, app/assets/stylesheets/shared/guided_practice_nav.scss */
  .classroom_presentations .navbar {
    /* For iPad */
    position: relative;
  }
}

/* line 31, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar .back {
  display: inline-block;
  height: 46px;
}

/* line 35, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar .back .zearn-logo, .classroom_presentations .navbar .back .zearn-home {
  display: inline-block;
  position: relative;
  top: -2px;
}

/* line 42, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar .actions {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 2;
  font-size: 0;
}

/* line 50, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar a {
  height: 46px;
  display: inline-block;
  margin-left: 8px;
}

/* line 55, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar a:hover .btn, .classroom_presentations .navbar a:active .btn {
  border: 2px solid #005c73;
  color: #005c73;
}

/* line 59, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar a:hover .btn.signout-btn, .classroom_presentations .navbar a:hover .btn.action-btn, .classroom_presentations .navbar a:active .btn.signout-btn, .classroom_presentations .navbar a:active .btn.action-btn {
  color: white;
  background-color: #005c73;
}

/* line 67, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar .btn {
  display: inline-block;
  height: 29px;
  line-height: 25px;
  border: 1px solid #007b94;
  color: #007b94;
  min-width: 104px;
  text-align: center;
  border-radius: 15px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  position: relative;
  top: -2px;
}

/* line 82, app/assets/stylesheets/shared/guided_practice_nav.scss */
.classroom_presentations .navbar .btn.signout-btn, .classroom_presentations .navbar .btn.action-btn {
  background-color: #007b94;
  color: #fff;
}

/* line 12, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .navbar-cp {
  line-height: 46px;
}

/* line 9, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back-links {
  position: absolute;
  width: 136px;
  height: 46px;
  left: 1px;
  top: 0px;
  z-index: 3;
}

/* line 18, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back {
  width: 64px;
  height: 100%;
  padding: 0 14px;
  margin: 0;
}

/* line 24, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back:not(:last-of-type) {
  border-right: 1px solid #cccccc;
}

/* line 28, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back .zearn-logo {
  width: 36px;
  height: 36px;
  background-image: url("//webassets.zearn.org/app_assets/general/logos/zearn-icon.svg");
  background-size: 32px 32px;
  background-repeat: no-repeat;
  vertical-align: middle;
}

/* line 37, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back .zearn-home {
  width: 36px;
  height: 36px;
  background-image: url("//webassets.zearn.org/app_assets/general/logos/zearn-home-icons2.svg");
  background-size: cover;
  vertical-align: middle;
  background-position: left;
}

/* line 47, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back:hover .zearn-home {
  background-position: center;
}

/* line 53, app/assets/stylesheets/shared/_back_nav.scss */
.classroom_presentations .navbar-cp .back:active .zearn-home {
  background-position: right;
}

/* line 15, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .navbar-cp .header-content {
  width: 1024px;
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
}

/* line 22, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .navbar-cp .title {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  white-space: nowrap;
  text-align: center;
  color: #303b40;
  font-family: "Source Sans Pro", Verdana, Geneva, sans-serif;
  font-size: 22px;
  z-index: 1;
}

/* line 24, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-k, .classroom_presentations .navbar-cp .title .mission.grade-0 {
  color: #136fcb;
}

/* line 25, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-1 {
  color: #f75e00;
}

/* line 26, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-2 {
  color: #0497e7;
}

/* line 27, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-3 {
  color: #a96dd2;
}

/* line 28, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-4 {
  color: #ff4d76;
}

/* line 29, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-5 {
  color: #0fa566;
}

/* line 30, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-6 {
  color: #8d55ec;
}

/* line 31, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-7 {
  color: #d53965;
}

/* line 32, app/assets/stylesheets/shared/general/grade_colors.scss */
.classroom_presentations .navbar-cp .title .mission.grade-8 {
  color: #899400;
}

/* line 38, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .navbar-cp .title .mission, .classroom_presentations .navbar-cp .title .lesson {
  font-weight: 600;
}

/* line 44, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .main-content {
  margin: 20px auto;
  width: 1024px;
}

/* line 49, app/assets/stylesheets/classroom_presentations/classroom_presentations.scss */
.classroom_presentations .presentation-box {
  min-height: 585px;
}
/* Slider */
.slick-slider
{
  position: relative;

  display: block;
  box-sizing: border-box;

  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list
{
  position: relative;

  display: block;
  overflow: hidden;

  margin: 0;
  padding: 0;
}
.slick-list:focus
{
  outline: none;
}
.slick-list.dragging
{
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track
{
  position: relative;
  top: 0;
  left: 0;

  display: block;
  margin-left: auto;
  margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
  display: table;

  content: '';
}
.slick-track:after
{
  clear: both;
}
.slick-loading .slick-track
{
  visibility: hidden;
}

.slick-slide
{
  display: none;
  float: left;

  height: 100%;
  min-height: 1px;
}
[dir='rtl'] .slick-slide
{
  float: right;
}
.slick-slide img
{
  display: block;
}
.slick-slide.slick-loading img
{
  display: none;
}
.slick-slide.dragging img
{
  pointer-events: none;
}
.slick-initialized .slick-slide
{
  display: block;
}
.slick-loading .slick-slide
{
  visibility: hidden;
}
.slick-vertical .slick-slide
{
  display: block;

  height: auto;

  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}