.btn.disabled {
  opacity: 0.5;
  cursor: default;
}
.code-block__input-row {
  position: relative;
}
.code-block__input-row .check {
  position: absolute;
  right: -24px;
  top: 35%;
  display: none;
}

@media only screen and (max-width: 480px) {
  .code-block__input-row .check {
    right: 166px;
    top: 68px;
  }
}

@media only screen and (max-width: 350px) {
  .code-block__input-row .check {
    right: 111px;
    top: 52px;
  }
}

.code-block__input-row .check.show {
  display: block;
}
.step-progress span {
  transition: width 1s;
  transition-delay: 0.1s;
}
#overlay {
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: #fafafa;
  transition: 1s 0.4s;
}
#progress {
  height: 1px;
  background: #18417e;
  position: absolute;
  width: 0;
  top: 50%;
}

#progstat {
  font-size: 20px;
  letter-spacing: 3px;
  position: absolute;
  top: 50%;
  margin-top: -40px;
  width: 100%;
  text-align: center;
  color: #18417e;
}

.sliding-image {
  transition: opacity 0.3s;
  -webkit-transition: opacity 0.3s;
  opacity: 1;
}

.sliding-image__bg.step-6 {
  opacity: 1 !important;
}

.sliding-image.fade {
  opacity: 0.1;
}

.game-cards__content {
  max-width: 850px;
}

#screen-3 .title--h1 {
  font-size: 60px;
}

@media (max-height: 1000px) and (min-width: 1141px) {
  #screen-3 .title--h1 {
    font-size: 40px;
  }
}

@media (max-height: 800px) and (min-width: 1023px) {
  .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 26);
  }
  .grid__item:nth-child(2) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 28);
  }
  .grid__item:nth-child(4) .grid__item-imgwrap,
  .grid__item:nth-child(5) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 30);
  }
}

@media (max-width: 1141px) {
  .game-cards__content {
    max-width: 700px;
  }
  #screen-3 .title--h1 {
    font-size: 34px;
    line-height: 1.1;
  }
}

@media (max-width: 767px) {
  .grid__item.is-moved {
    transform: translate(0, -35vh);
  }
  .breadcrumbs__item:last-child {
    padding-right: calc(50vw - 30px);
  }
  #screen-3 .title--h1 {
    font-size: 32px;
  }
  .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 34);
  }
  .grid__item:nth-child(2) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 36);
  }
  .grid__item:nth-child(4) .grid__item-imgwrap,
  .grid__item:nth-child(5) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 38);
  }
  .grid {
    grid-template-columns: repeat(5, 230px);
  }
}

@media (max-width: 375px) {
  #screen-3 .title h1 {
    font-size: 29px;
  }
}

@media (max-width: 320px) {
  #screen-3 .title h1 {
    font-size: 22px;
  }
}

@media (max-width: 766px) and (orientation: landscape) {
  #screen-3 .title--h1 {
    font-size: 22px;
  }
  .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 24);
  }
  .grid__item:nth-child(2) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 26);
  }
  .grid__item:nth-child(4) .grid__item-imgwrap,
  .grid__item:nth-child(5) .grid__item-imgwrap {
    height: calc(var(--vh, 1vh) * 28);
  }
}
