.game {
  user-select: none; }
  .game .game__info {
    user-select: none;
    color: #15202b; }
  .game__container {
    display: flex;
    justify-content: center;
    width: 100%; }
  .game__content {
    position: relative;
    background: #fff;
    overflow: auto;
    border: 1px solid; }

.app__container {
  display: flex;
  justify-content: center; }
  .app__container #next {
    display: flex;
    padding-left: 20px;
    width: 100px;
    flex-direction: column; }
    .app__container #next.version-2, .app__container #next.version-3 {
      flex-direction: column-reverse; }
    .app__container #next .row {
      display: flex;
      flex-direction: row; }
  .app__container #tetro {
    display: flex;
    flex-direction: column;
    background-color: grey;
    border: 1px solid grey; }
    .app__container #tetro.version-2, .app__container #tetro.version-3 {
      flex-direction: column-reverse; }
    .app__container #tetro.version-3 .row {
      flex-direction: row-reverse; }
    .app__container #tetro .row {
      display: flex;
      flex-direction: row; }
  .app__container.show-shadow .shadow {
    opacity: 0.5 !important; }
  .app__container.show-grid #tetro {
    gap: 1px;
    background-color: grey;
    border: 1px solid grey; }
    .app__container.show-grid #tetro .row {
      gap: 1px; }
  .app__container.show-grid #next .row {
    margin-top: -1px; }
    .app__container.show-grid #next .row .brick-box {
      background: transparent;
      margin-right: -1px; }
    .app__container.show-grid #next .row .brick {
      border: 1px solid black;
      margin-right: -1px; }

.row {
  height: 20px; }

.brick-box,
.brick,
.cell,
.shadow {
  display: inline-block;
  height: 20px;
  width: 20px;
  position: relative; }
  .brick-box:after,
  .brick:after,
  .cell:after,
  .shadow:after {
    content: ' ';
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute; }

.brick-box {
  background-color: lightgrey; }

.brick {
  background-color: #baefba; }
  .brick-color-1 {
    background-color: blue; }
  .brick-color-2 {
    background-color: red; }
  .brick-color-3 {
    background-color: yellow; }
  .brick-color-4 {
    background-color: purple; }
  .brick-color-5 {
    background-color: #57ffd3; }
  .brick-color-6 {
    background-color: white; }
  .brick-color-7 {
    background-color: #ff0000; }
  .brick-color-10:after {
    border: 0 !important; }

.cell,
.shadow {
  background-color: lightgrey; }


/*# sourceMappingURL=tetro.css.map*/