@font-face {
  font-family: 'Kids';
  src: url("../fonts/ikastapp_punteada.woff2") format("woff2");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'Primary';
  src: url("../fonts/kg_primary_penmanship.woff2") format("woff2");
  font-weight: normal;
  font-style: normal; }

* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
  /* make transparent link selection, adjust last value opacity 0 to 1.0 */
  outline: 0 !important; }
  *:focus {
    outline: 0 !important;
    box-shadow: none !important; }

body {
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-shadow: none; }

.globalContainer {
  position: relative; }

html.height100 {
  padding: env(safe-area-inset);
  min-height: 100%;
  height: 100%; }
  html.height100.ios {
    min-height: calc(100% + constant(safe-area-inset-top));
    min-height: calc(100% + env(safe-area-inset-top)); }
  html.height100 body {
    min-height: 100%;
    height: 100%; }

html.minHeight100 {
  padding: env(safe-area-inset);
  min-height: 100%; }
  html.minHeight100.ios {
    min-height: calc(100% + constant(safe-area-inset-top));
    min-height: calc(100% + env(safe-area-inset-top)); }
  html.minHeight100 body {
    min-height: 100%; }

body.fixed100-100 {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden; }

body.no-touch {
  /*overflow: hidden;*/
  touch-action: none; }

body.content100-100-center .globalContainer {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  body.content100-100-center .globalContainer .page-content {
    flex: none;
    width: 100%; }

body.content100-100-stretch .globalContainer {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center; }
  body.content100-100-stretch .globalContainer .page-content {
    flex: 1 0 auto;
    width: 100%;
    min-height: 100%; }

/*
justify-content: center;
align-items: stretch;*/
.loading-layer-full {
  position: absolute;
  z-index: 99999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.85);
  opacity: 0;
  transition: opacity .3s ease-in-out; }
  .loading-layer-full + .loading-layer-full {
    opacity: 0; }
  .loading-layer-full.global {
    position: fixed; }
  .loading-layer-full.show-layer {
    opacity: 1; }
  .loading-layer-full .pict {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    /*width:200px;
		height:44px;
		background-image:url("/static/images/postwall-loading.gif?v=2");
		background-size:cover;*/
    margin-top: 0px;
    opacity: 0;
    transition: opacity .3s ease-in-out, margin-top .3s ease-in-out; }
  .loading-layer-full.show-layer .pict {
    transition: opacity .3s ease-in-out .1s, margin-top .3s ease-in-out .1s;
    margin-top: -30px;
    opacity: 1; }
  .loading-layer-full .label {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin-top: 80px;
    color: #AAA;
    font-size: 11px;
    letter-spacing: 2px;
    text-transform: uppercase;
    opacity: 0;
    font-weight: 500;
    transition: opacity .3s ease-in-out, margin-top .3s ease-in-out; }
  .loading-layer-full.show-layer .label {
    transition: opacity .3s ease-in-out .15s, margin-top .3s ease-in-out .15s;
    margin-top: 50px;
    opacity: 1; }

/* Elipsis Loader */
.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 64px;
  height: 64px; }

.lds-ellipsis div {
  position: absolute;
  top: 27px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #fff;
  animation-timing-function: cubic-bezier(0, 1, 1, 0); }

.lds-ellipsis div:nth-child(1) {
  left: 6px;
  animation: lds-ellipsis1 0.6s infinite; }

.lds-ellipsis div:nth-child(2) {
  left: 6px;
  animation: lds-ellipsis2 0.6s infinite; }

.lds-ellipsis div:nth-child(3) {
  left: 26px;
  animation: lds-ellipsis2 0.6s infinite; }

.lds-ellipsis div:nth-child(4) {
  left: 45px;
  animation: lds-ellipsis3 0.6s infinite; }

@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1); }
  100% {
    transform: scale(0); } }

@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0); }
  100% {
    transform: translate(19px, 0); } }

[page-id="login"] {
  position: relative;
  z-index: 2;
  padding: 20px;
  justify-content: space-around;
  display: flex;
  flex-direction: column;
  align-items: center; }
  html.portrait [page-id="login"] {
    justify-content: space-evenly; }
  @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) {
    [page-id="login"] {
      display: grid;
      grid-template-columns: 20px 1fr 40px 1fr 20px;
      grid-template-rows: 10px auto 10px;
      align-content: space-evenly; } }
  @media (orientation: landscape) and (max-height: 800px) and (min-width: 900px) {
    [page-id="login"] {
      grid-template-columns: 60px 1fr 0px 1.5fr 20px; } }
  [page-id="login"] .animation-letters {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 2; }
    [page-id="login"] .animation-letters .bg-letter {
      position: absolute;
      font-family: "Kids";
      font-size: 190px;
      transform-origin: center; }
      [page-id="login"] .animation-letters .bg-letter.color1 {
        color: #ffa500; }
      [page-id="login"] .animation-letters .bg-letter.color2 {
        color: #009a70; }
      [page-id="login"] .animation-letters .bg-letter.color3 {
        color: #ff543f; }
  [page-id="login"] .logo {
    max-width: 240px;
    min-width: 200px;
    width: 13vw;
    height: auto;
    position: relative;
    z-index: 3;
    margin: 0 auto 30px; }
    @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) {
      [page-id="login"] .logo {
        grid-column-start: 4;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 2;
        align-self: start; } }
  @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) and (max-height: 500px) {
    [page-id="login"] .logo {
      margin-bottom: 10px; } }
    @media (orientation: landscape) and (max-height: 800px) and (min-width: 900px) {
      [page-id="login"] .logo {
        max-width: none;
        width: 20vw; } }
  [page-id="login"] .container {
    position: relative;
    z-index: 3; }
    @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) {
      [page-id="login"] .container {
        grid-column-start: 2;
        grid-column-end: 2;
        grid-row-start: 2;
        grid-row-end: 2;
        align-self: center; }
        [page-id="login"] .container .col-12 {
          flex: none;
          max-width: none; } }
    [page-id="login"] .container .feedback {
      max-width: 460px;
      margin-left: auto;
      margin-right: auto;
      padding: 1em 0;
      font-size: 14px; }
      @media (orientation: landscape) and (max-height: 800px) and (min-height: 500px) {
        [page-id="login"] .container .feedback {
          min-height: 5em; } }
      [page-id="login"] .container .feedback > div {
        font-weight: 700;
        color: #FFF;
        font-size: 14px;
        padding: .7em 1em;
        text-align: center;
        display: none;
        opacity: 0;
        transition: opacity .5s ease-in-out; }
        [page-id="login"] .container .feedback > div.show {
          opacity: 1; }
        [page-id="login"] .container .feedback > div.feedback-ok {
          background-color: #48ae64; }
        [page-id="login"] .container .feedback > div.feedback-nok {
          background-color: #da3851; }
    [page-id="login"] .container form {
      max-width: 360px;
      padding: 30px 40px 30px;
      margin: 0 auto;
      opacity: 0;
      transform: translate(0, 7%);
      transition: opacity .6s ease-in-out, transform .6s ease-in-out;
      pointer-events: none;
      /*@media (max-width:$maxXS) {
          padding-top:145px;
        }*/ }
      @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) {
        [page-id="login"] .container form {
          padding: 30px 20px 30px; } }
      [page-id="login"] .container form.show {
        pointer-events: auto;
        transform: translate(0, 0%);
        opacity: 1; }
      [page-id="login"] .container form input[type=text],
      [page-id="login"] .container form input[type=password] {
        background-color: rgba(255, 255, 255, 0.9) !important;
        font-size: 14px !important;
        border: none;
        border-radius: 3px;
        color: #888;
        padding: .6em .8em;
        resize: none;
        min-height: 43px;
        text-align: center;
        border-bottom: #dfece7 solid 2px; }
        [page-id="login"] .container form input[type=text]:-webkit-autofill, [page-id="login"] .container form input[type=text]:-webkit-autofill:hover, [page-id="login"] .container form input[type=text]:-webkit-autofill:focus, [page-id="login"] .container form input[type=text]:-webkit-autofill:active,
        [page-id="login"] .container form input[type=password]:-webkit-autofill,
        [page-id="login"] .container form input[type=password]:-webkit-autofill:hover,
        [page-id="login"] .container form input[type=password]:-webkit-autofill:focus,
        [page-id="login"] .container form input[type=password]:-webkit-autofill:active {
          transition: background-color 5000s ease-in-out 0s; }
        [page-id="login"] .container form input[type=text]:-internal-autofill-previewed,
        [page-id="login"] .container form input[type=password]:-internal-autofill-previewed {
          font-size: 14px !important; }
      [page-id="login"] .container form ::placeholder {
        color: #999 !important; }
      [page-id="login"] .container form .btn {
        background-color: #029b81;
        border: #029b81 solid 1px;
        color: #FFF;
        padding: .6em 1.2em;
        font-size: 14px !important; }
  [page-id="login"] .img-bg {
    position: relative;
    z-index: 3;
    max-width: 550px;
    width: 100%;
    height: auto;
    display: inline-block;
    margin-top: 0px; }
    @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) {
      [page-id="login"] .img-bg {
        grid-column-start: 4;
        grid-column-end: 4;
        grid-row-start: 2;
        grid-row-end: 2;
        align-self: end;
        margin-top: 100px; } }
  @media (orientation: landscape) and (max-height: 800px) and (min-width: 500px) and (max-height: 500px) {
    [page-id="login"] .img-bg {
      margin-top: 10px; } }
    @media (orientation: landscape) and (max-height: 800px) and (min-width: 900px) {
      [page-id="login"] .img-bg {
        margin-top: 14vw;
        max-width: none;
        transform: translate(2%, 0); } }

[page-id="login"] {
  background-color: #009774; }
  [page-id="login"] .container form .btn {
    font-weight: 700;
    border-color: #333333;
    background-color: #333333; }

/* HEADER */
.kt-header-mobile {
  background-color: #009774; }
  .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span,
  .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler.kt-header-mobile__toolbar-toggler--active span {
    background: #FFF; }
    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span:before, .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler span:after,
    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler.kt-header-mobile__toolbar-toggler--active span:before,
    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toolbar-toggler.kt-header-mobile__toolbar-toggler--active span:after {
      background: #FFF; }
  .kt-header-mobile #kt_header_mobile_topbar_toggler i {
    color: #ffe40b; }
  .kt-header-mobile .kt-header-mobile__logo img {
    width: 170px;
    height: auto; }

.kt-header {
  background-color: #009774; }
  .kt-header .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-welcome {
    color: #ffe40b; }
  .kt-header .kt-header__brand-logo img {
    width: 250px;
    height: auto; }

.kt-subheader .select2-container--default .select2-selection__rendered {
  padding-top: .45rem;
  padding-bottom: .45rem; }

.form-group {
  margin-bottom: 1rem; }

.text-box {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center; }
  .text-box p {
    flex: none;
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative; }
    .text-box p span {
      position: relative;
      z-index: 2;
      display: inline-block; }
  .text-box .grid {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-top: #F3F3F3 solid .008em;
    border-bottom: #F3F3F3 solid .008em; }
    .text-box .grid:before {
      content: "";
      position: absolute;
      background-color: #F3F3F3;
      height: .008em;
      margin-top: -.004em;
      left: 0;
      width: 100%; }
    .text-box .grid:after {
      content: "";
      position: absolute;
      background-color: #F3F3F3;
      height: .008em;
      margin-top: -.004em;
      left: 0;
      width: 100%; }
    .text-box .grid .line {
      position: absolute;
      top: -.004em;
      left: 0;
      height: calc(100% + .008em);
      width: .008em;
      margin-left: -.004em;
      background-color: #F3F3F3; }
  .text-box[data-mode="basic"] p span {
    color: transparent !important;
    display: block; }
  .text-box[data-case="all-upper"] .grid {
    border-bottom: none;
    border-left: none;
    border-right: none; }
    .text-box[data-case="all-upper"] .grid:before {
      display: none; }
  .text-box[data-font="kids_ligature"] {
    font-family: "Kids";
    color: #BBB; }
    .text-box[data-font="kids_ligature"] p {
      line-height: 1em; }
      .text-box[data-font="kids_ligature"] p span {
        transform: translate(0, -0.07em); }
    .text-box[data-font="kids_ligature"] .grid:before {
      top: 31%; }
    .text-box[data-font="kids_ligature"] .grid:after {
      top: 68.4%; }
    .text-box[data-font="kids_ligature"][data-case="all-upper"] {
      transform: translate(0, 0.155em); }
      .text-box[data-font="kids_ligature"][data-case="all-upper"] .grid .line {
        height: 68.4%; }
  .text-box[data-font="kids_primary"] {
    font-family: "Primary";
    color: #E2E2E2;
    font-feature-settings: "kern" 0; }
    .text-box[data-font="kids_primary"] p {
      line-height: .8em; }
      .text-box[data-font="kids_primary"] p span {
        transform: translate(0, -0.05em); }
    .text-box[data-font="kids_primary"] .grid:before {
      top: 31%; }
    .text-box[data-font="kids_primary"] .grid:after {
      top: 78.5%; }
    .text-box[data-font="kids_primary"][data-case="all-upper"] {
      transform: translate(0, 0.084em); }
      .text-box[data-font="kids_primary"][data-case="all-upper"] .grid .line {
        height: 79%; }

[page-id="pattern-editor"] #main-container {
  position: relative;
  display: flex;
  justify-content: center; }
  [page-id="pattern-editor"] #main-container .editor {
    flex: 0;
    width: 650px; }
    [page-id="pattern-editor"] #main-container .editor .board {
      position: relative;
      width: 650px;
      height: 460px;
      background-color: #EEE;
      border: #DDD solid 1px; }
      [page-id="pattern-editor"] #main-container .editor .board .point {
        position: absolute;
        z-index: 3;
        line-height: 1em;
        top: 0;
        left: 0;
        cursor: pointer; }
        [page-id="pattern-editor"] #main-container .editor .board .point:after {
          content: "";
          position: absolute;
          left: -6px;
          top: -6px;
          width: 12px;
          height: 12px;
          background-color: #dc3545;
          border-radius: 50%;
          z-index: -1;
          opacity: .3;
          transform-origin: center center;
          transition: transform .4s ease-in-out; }
        [page-id="pattern-editor"] #main-container .editor .board .point:before {
          content: "";
          position: absolute;
          right: -12px;
          top: -12px;
          width: 4px;
          height: 4px;
          background-color: #17a2b8;
          border-radius: 50%;
          z-index: 10;
          transform-origin: center center;
          transition: transform .4s ease-in-out;
          transform: scale(0, 0); }
        [page-id="pattern-editor"] #main-container .editor .board .point[data-color="1"]:after {
          background-color: #dc3545; }
        [page-id="pattern-editor"] #main-container .editor .board .point[data-color="2"]:after {
          background-color: #558c3d; }
        [page-id="pattern-editor"] #main-container .editor .board .point[data-color="3"]:after {
          background-color: #3bb2e3; }
        [page-id="pattern-editor"] #main-container .editor .board .point[data-color="4"]:after {
          background-color: #c864c4; }
        [page-id="pattern-editor"] #main-container .editor .board .point[data-color="5"]:after {
          background-color: #64473e; }
        [page-id="pattern-editor"] #main-container .editor .board .point.isStart:after {
          transform: scale(1.4, 1.4); }
        [page-id="pattern-editor"] #main-container .editor .board .point.isBounce:before {
          transform: scale(1.6, 1.6); }
        [page-id="pattern-editor"] #main-container .editor .board .point span {
          position: absolute;
          top: 0;
          left: 0;
          display: inline-block;
          z-index: 2;
          transform: translate(-50%, -50%);
          font-size: 10px;
          line-height: 1em; }
      [page-id="pattern-editor"] #main-container .editor .board .dividers {
        position: absolute;
        z-index: 2;
        top: 0;
        height: 100%;
        width: 100%;
        left: 0; }
      [page-id="pattern-editor"] #main-container .editor .board .divider {
        position: absolute;
        line-height: 1em;
        top: 0;
        left: 0;
        height: 100%;
        width: 4px;
        transform: translate(-2px, 0);
        cursor: default;
        background-color: rgba(0, 0, 0, 0.1);
        pointer-events: none; }
        [page-id="pattern-editor"] #main-container .editor .board .divider .trigger {
          pointer-events: all;
          content: "";
          position: absolute;
          z-index: 1;
          width: 18px;
          height: 18px;
          top: 0;
          left: -7px;
          background-color: #555;
          border-radius: 50%; }
        [page-id="pattern-editor"] #main-container .editor .board .divider span {
          pointer-events: none;
          position: absolute;
          top: 2px;
          left: -7px;
          z-index: 2;
          width: 18px;
          text-align: center;
          color: #FFF;
          font-size: 11px; }
      [page-id="pattern-editor"] #main-container .editor .board canvas {
        position: absolute;
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
    [page-id="pattern-editor"] #main-container .editor .actions {
      margin-top: 20px;
      text-align: right;
      position: relative; }
      [page-id="pattern-editor"] #main-container .editor .actions .action-point-mode {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 4;
        white-space: nowrap; }
  [page-id="pattern-editor"] #main-container .result {
    flex: 0 1 auto;
    border: #EEE solid 1px;
    margin-left: 30px;
    padding: 30px;
    width: 420px; }
    [page-id="pattern-editor"] #main-container .result.reading {
      pointer-events: none;
      opacity: .3; }
    [page-id="pattern-editor"] #main-container .result .details {
      margin-bottom: 10px; }
      [page-id="pattern-editor"] #main-container .result .details p {
        margin: 0; }
    [page-id="pattern-editor"] #main-container .result .json {
      font-size: 10px;
      word-break: break-all;
      display: none; }
    [page-id="pattern-editor"] #main-container .result .action-save.off {
      opacity: .3; }

/*# sourceMappingURL=admin.min.css.map */
