@charset "UTF-8";
.hidden {
  display: none; }

.invisible {
  visibility: hidden; }

@-webkit-keyframes conflict {
  0% {
    border-color: #cc5756; }

  50% {
    border-color: #6e150f; }

  100% {
    border-color: #cc5756; } }

@keyframes conflict {
  0% {
    border-color: #cc5756; }

  50% {
    border-color: #6e150f; }

  100% {
    border-color: #cc5756; } }

.game {
  position: relative;
  width: 100%;
  height: 100%;
  /* Disable selection/Copy of UIWebView */ }
  .game * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none; }

.grid {
  width: 100%;
  height: 100%;
  border: 3px solid #0053ad;
  box-sizing: border-box;
}

.grid__row {
  /* height par javascript */ }
  .grid__row:before, .grid__row:after {
    display: table;
    content: "";
    line-height: 0; }
  .grid__row:after {
    clear: both; }

.grid__cell {
  float: left;
  height: 100%;
  /* width par javascript */
}

.pawn-container {
  position: relative; }

.pawn {
  display: block;
  width: 100%;
  height: 100%;
    margin:0;
  color: #333;
 /* font-weight: bold; */
  font-size: 40px;
  border: 3px solid #0053ad;
  transition: background-color .5s ease;

}
.pawn.bTop { border-top: 1px solid #C6DDEB; }
.pawn.bBottom { border-bottom: 1px solid #C6DDEB; }
.pawn.bLeft { border-left: 1px solid #C6DDEB; }
.pawn.bRight { border-right: 1px solid #C6DDEB; 
}


.pawn__value {
  position: absolute;
  top: 50%;
  left: 50%;
  cursor: default;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }

.pawn--tofind {
  color: #888; }

.pawn--cursor {
  background-color: white; }

.pawn--value {
}

.pawn--blank {
  background-color: #071f69; }

.pawn--total {
}

.pawn--initial {

}
.pawn--correct {
    background:#ffcc33;
     color: #000;     
 }
 
 
.pawn--correct.bTop { border-top: 1px solid #EBB81F; }
.pawn--correct.bBottom { border-bottom: 1px solid #EBB81F; }
.pawn--correct.bLeft { border-left: 1px solid #EBB81F; }
.pawn--correct.bRight { border-right: 1px solid #EBB81F; }
 
 
.pawn--identical {
  color: #2C75FF; }

.pawn--panic {
  background-color: #FFF;
  z-index: 2; }

.conflict-total .pawn__indice-right {
  color: red; }

.conflict-identical {
  color: red; }

.conflict-errors .pawn__value {
  color: red; }

.conflict-failure {
  background-color: red;
  color: red; }

.pawn__indice-right {
    font-size:24px;
  position: absolute;
  top: 5%;
  left: 10%; }


.pawn--highlight {
  background:white;
}

    
.keynum {
  display: inline-block;
  background-color: #ececec;
  color: #333;
  padding: 7px 16px;
  font-size: 30px; }

.pawn--animation--1 { background: rgba(255, 204, 51, 1); }
.pawn--animation--2 { background: rgba(255, 255, 255, 1); }

@media (max-height: 450px) {
  .pawn, .keynum {
    font-size: 25px; }
  .grid--9 .pawn, .grid--10 .pawn, .grid--11 .pawn, .grid--12 .pawn {
    font-size: 25px; }
    .pawn__indice-right {
        font-size: 15px;
    }}