:root {
  --color-white: #fff;
  --color-black: #1f232b; }

html, body, * {
  margin: 0;
  padding: 0;
  outline: none;
  touch-action: manipulation; }

html, body {
  min-height: 100vh; }

html {
  padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }

html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

.wrap {
  max-width: 470px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 100px;
  overflow: hidden; }

body.standalone {
  padding-top: constant(safe-area-inset-top);
  padding-top: env(safe-area-inset-top); }
  body.standalone * {
    -webkit-tap-highlight-color: transparent; }

.standalone-header {
  display: none; }

body.standalone .standalone-header {
  height: constant(safe-area-inset-top);
  height: env(safe-area-inset-top);
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  display: block;
  background-color: #1f232b;
  z-index: 100; }

body.standalone .header {
  display: none; }

a.feature:hover, .list__item:hover {
  cursor: pointer;
  background-color: rgba(35, 37, 50, 0.1); }

body {
  background-color: #232532;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-left: auto;
  margin-right: auto; }

.fonts-wrap {
  padding: 20px; }

.font--title {
  font-size: 24px;
  color: #fff; }

.font--subtitle {
  font-size: 20px;
  color: #b9bbcc; }

.font--text {
  font-size: 18px;
  color: #8b8fa7; }

.page__item {
  position: relative;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  margin-left: auto;
  margin-right: auto; }

.page__item + .page__item--fullwidth {
  border-bottom: none; }

.page__item.no-support {
  background-color: rgba(212, 70, 96, 0.72);
  color: #fff; }
  .page__item.no-support * {
    color: #fff; }

.page__item.has-support {
  background-color: #44774a;
  color: #fff; }
  .page__item.has-support * {
    color: #fff; }

.page__item--fullwidth {
  width: 100%;
  background-color: #1c1e28;
  border-bottom: none;
  margin-top: -1px; }
  .page__item--fullwidth .page__item__inner {
    width: calc(100% - 20px*2);
    margin-left: auto;
    margin-right: auto; }

.page__item--transparent {
  background-color: transparent; }

.wrap--v2 {
  background-color: #1c1e28;
  border-radius: 6.5px; }

.page__item--push {
  margin-bottom: 20px; }

.page__item--noborder {
  border: none; }

.page__item--end {
  border-bottom-right-radius: 13px;
  border-bottom-left-radius: 13px;
  display: flex;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0) !important; }

.page__item--end-2 {
  border-bottom-right-radius: 13px;
  border-bottom-left-radius: 13px;
  padding: 0px; }

.page__item--padded {
  padding: 20px 0; }

.page__item--highlight {
  background-color: rgba(26, 26, 26, 0) !important; }

.header {
  color: #fff;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 20px; }

.icon--controller, .icon--controller_alt {
  fill: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 20px; }
  .icon--controller svg, .icon--controller_alt svg {
    width: 60px;
    height: auto; }

.search {
  border-radius: 6.5px;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05);
  overflow: hidden;
  background-color: #1c1e28;
  margin-left: 20px;
  margin-right: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  max-height: 50px;
  transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55); }

.search--expanded {
  max-height: 170px; }

.search__filters {
  overflow: hidden;
  display: flex;
  flex-direction: column; }

.search__filters__item {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #232532; }

.search__field {
  padding-bottom: 15px;
  padding-top: 14px;
  padding-left: 17px;
  padding-right: 10px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid #232532;
  border-radius: 6.5px; }

.search .icon--search {
  flex-shrink: 0;
  margin-right: 10px;
  margin-top: auto;
  margin-bottom: auto;
  transform: translateY(2px); }
  .search .icon--search svg {
    width: 15px;
    height: auto;
    fill: #b9bbcc; }

.search__field__input {
  flex-grow: 1;
  font-size: 16px;
  border: 0;
  font-weight: 500;
  color: #b9bbcc;
  margin-left: 3px;
  background: transparent;
  -webkit-appearance: none;
  text-align: left; }

::placeholder {
  color: #8b8fa7; }

.feature {
  border-radius: 6.5px;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05);
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  color: #fff;
  padding: 20px;
  position: relative;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  min-height: 215px;
  display: flex;
  flex-direction: column;
  background-size: cover;
  background-position: center center;
  text-decoration: none; }
  .feature.feature--short {
    min-height: 110px; }
  .feature.half {
    width: 47%; }
    .feature.half .feature__text {
      font-size: 18px; }
  .feature.full {
    width: 100%; }

.feature--header {
  border-bottom-right-radius: 0px;
  border-bottom-left-radius: 0px;
  margin-bottom: 1px; }

.entries {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-left: 20px;
  margin-right: 20px;
  justify-content: space-between; }
  .entries .feature {
    margin-left: 0;
    margin-right: 0; }

.list--collection .feature {
  margin-bottom: 1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0; }

.feature .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.15);
  display: none; }

.feature--single {
  position: relative; }
  .feature--single .image {
    mix-blend-mode: hard-light;
    box-shadow: -10px 10px 30px -5px rgba(0, 0, 0, 0.1) !important; }

.feature .image {
  position: absolute;
  top: 20px;
  left: 200px;
  width: 200px;
  height: 200px;
  opacity: 1;
  border-radius: 39px;
  background-size: cover;
  transition: opacity 1s linear;
  background-position: center center;
  transform: rotate(-21deg) translate(6%, 0%);
  box-shadow: -10px 10px 30px -5px #000;
  animation: iconRotate 180s alternate;
  animation-timing-function: linear; }

.feature__headline {
  text-transform: uppercase;
  font-size: 14px;
  position: relative;
  z-index: 2;
  font-weight: 800; }

.feature__meta {
  opacity: 0.85;
  font-size: 14px;
  font-weight: 500;
  padding-top: 5px; }

.feature__text {
  font-size: 25px;
  font-weight: 800;
  position: relative;
  z-index: 2;
  max-width: 70%;
  margin-top: auto; }

@keyframes scaleAni {
  0% {
    transform: rotate(-21deg) translate(20%, 2%); }

  100% {
    transform: rotate(-21deg) translate(20%, -50%); } }

@keyframes kenBurnsAni {
  0% {
    transform: rotate(-21deg) translate(20%, -2%); }

  100% {
    transform: rotate(-21deg) translate(20%, -50%); } }

@keyframes iconRotate {
  0% {
    transform: rotate(-21deg) translate(6%, -30%); }

  100% {
    transform: rotate(-8deg) translate(0%, 40%); } }

img.grid {
  position: absolute;
  transform: rotate(-21deg) translate(20%, 2%);
  z-index: 1;
  opacity: 0;
  mix-blend-mode: hard-light;
  transition: opacity 2s linear;
  animation-timing-function: linear; }

img.grid.shadow {
  margin-left: -2px;
  margin-top: 5px;
  z-index: 0;
  filter: blur(4px) brightness(-70%);
  opacity: 0.08 !important; }

.feature.animation-scale img.grid {
  animation: scaleAni 250s normal; }

.feature.animation-ken-burns img.grid {
  animation: kenBurnsAni 250s normal; }

img.grid[src] {
  opacity: 0.25; }

body.loaded img.grid {
  opacity: 0.25; }

body.loaded .feature .image {
  opacity: 0.4; }

.loading {
  color: #fff !important;
  display: block !important;
  text-align: center !important;
  padding: 25px 0px !important; }

.appgrid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 500px; }

.appgrid__app {
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 17px;
  margin-bottom: 20px;
  margin-right: 20px;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05);
  pointer-events: none;
  user-select: none;
  background-size: 100% 100%; }

.list, .discover {
  display: flex;
  flex-direction: column;
  margin: 0; }

.list {
  margin-bottom: 20px; }

.column-row .list {
  margin-bottom: 0px; }

.listing__headline {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-left: 20px;
  margin-bottom: 10px; }

.item-count {
  font-size: 11px;
  color: #d3c6c8;
  width: 100%;
  text-align: center;
  /* margin-bottom: 10px; */
  padding-bottom: 10px;
  background-color: #d9e1e8;
  display: none; }

.list__item {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding-top: 10px;
  padding-bottom: 10px;
  text-decoration: none;
  color: #fff;
  margin-bottom: 1px;
  background-color: transparent;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05); }
  .list__item:first-child {
    border-top-left-radius: 13px;
    border-top-right-radius: 13px; }
  .list__item:last-child {
    border-bottom-left-radius: 13px;
    border-bottom-right-radius: 13px; }
  .list__item.list__item--separator {
    background-color: #1c1e28;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 14px;
    color: #b9bbcc; }

.list__item {
  box-shadow: none; }
  .list__item .appicon {
    margin-right: 15px; }
  .list__item.list__item--header {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 800;
    padding: 15px 20px; }
  .list__item .list__item__title {
    font-size: 16px;
    margin-bottom: 4px;
    padding-right: 10px;
    flex-shrink: 0; }
  .list__item .badges {
    display: inline-flex;
    width: 100%;
    flex-direction: row;
    flex-wrap: wrap; }
    .list__item .badges .badge {
      display: inline-block;
      font-size: 11px;
      font-weight: 900;
      white-space: nowrap;
      padding: 1px 3px 2px 3px;
      border-radius: 2px;
      letter-spacing: -0.4px;
      text-transform: uppercase;
      margin: 1px 0px 4px 0px; }
      .list__item .badges .badge:not(:last-child) {
        margin-right: 5px; }
      .list__item .badges .badge.alert {
        background-color: #eb3b5a;
        color: #191b24; }
      .list__item .badges .badge.info {
        background-color: #1e94e0;
        color: #191b24; }
      .list__item .badges .badge.highlight {
        background-color: #fa8100;
        color: #191b24; }
  .list__item .trending-now {
    display: inline;
    margin: 1px 0px 4px 0px;
    background-color: #2771bf;
    color: #191b24;
    padding: 1px 3px 2px 3px;
    border-radius: 2px;
    font-size: 11px;
    letter-spacing: -0.4px;
    text-transform: uppercase;
    font-weight: 900;
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.1); }
  .list__item.on-sale {
    position: relative; }
  .list__item:hover .on-sale {
    background-color: #fff; }

.list.small .list__item .appicon {
  border-radius: 7px;
  width: 40px;
  height: 40px; }

body.template-collection.on-sale .list__item.on-sale:after {
  display: none; }

.list__item--header {
  background-color: rgba(0, 0, 0, 0);
  display: block;
  color: rgba(255, 255, 255, 1);
  padding-top: 10px;
  padding-bottom: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between; }
  .list__item--footer {
    background-color: rgba(0, 0, 0, 0);
    display: block;
    color: rgba(255, 255, 255, 1);
    padding: 15px;
    display: flex;
    flex-direction: row;
    justify-content: space-between; }
  .list__item--footer a {
    color: #fff;
    text-decoration: none; }
    .list__item--footer a:hover {
      opacity: 0.5; }
  .list__item--footer span {
    opacity: 0.5; }
    .list__item--footer span.num {
      opacity: 1; }

.list__item--genre {
  box-shadow: none; }
  .list__item--genre .list__item__title {
    font-size: 18px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; }

.emoji-icon {
  font-size: 26px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  margin-right: 10px;
  overflow: hidden;
  height: 1.3em;
  flex-shrink: 0; }

.list__item__info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow: hidden;
  margin-top: auto;
  margin-bottom: auto; }

.list__item__title {
  font-size: 15.4px;
  margin-bottom: 3px;
  font-weight: 700; }

.list__item__description {
  font-size: 13px;
  margin-bottom: 8px;
  display: none; }

.list__item__rating {
  font-size: 11px; }

.list__item__price {
  font-size: 11px;
  margin-left: auto;
  align-self: center;
  padding-left: 20px; }

.list__item__meta {
  font-size: 13px;
  display: flex;
  flex-direction: row; }

.list__item__meta__item {
  color: #b9bbcc;
  font-size: 13.3px; }
  .list__item__meta__item:not(:last-child) {
    margin-right: 4.7619047619px; }
  .list__item__meta__item--spaced:after {
    content: '·';
    display: inline-block;
    margin-left: 4.7619047619px; }
  .list__item__meta__item--strikethrough {
    opacity: 0.6; }
  .list__item__meta__item--highlight {
    opacity: 1;
    color: #fff; }

.tag {
  border: 1px solid #d3c6c8;
  color: #d3c6c8;
  border-radius: 3px;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 8px;
  padding-right: 8px; }

.appicon {
  width: 47px;
  height: 47px;
  border-radius: 9.75px;
  background-color: #232532;
  background-size: 50%;
  background-position: center center;
  background-repeat: no-repeat;
  margin-right: 10px;
  flex-shrink: 0;
  border: 0 !important; }

.app__header_v2 {
  display: flex;
  position: relative;
  overflow: hidden;
  flex-direction: column;
  background-color: transparent;
  margin: 0px; }
  .app__header_v2:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    pointer-events: none;
    width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 100%;
    background-repeat: no-repeat;
    z-index: 10;
    background-image: url('../img/shader.svg?v=4');
    background-size: 100% 100%; }
  @media only screen and (min-width: 600px) {
  .app__header_v2 {
    margin: 20px;
    border-top-right-radius: 13px;
    border-top-left-radius: 13px; } }
  .app__header_v2 .inner {
    z-index: 11;
    text-align: center;
    margin: 45px 20px 40px 20px; }
    .app__header_v2 .inner .app__icon {
      margin: 0px auto;
      width: 110px;
      height: 110px;
      border-radius: 25px; }
    .app__header_v2 .inner .info {
      text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
      color: #fff; }
      .app__header_v2 .inner .info .title {
        padding-top: 15px;
        font-size: 23px;
        font-weight: 900;
        color: #fff; }
      .app__header_v2 .inner .info .seller {
        color: #fff;
        font-weight: 600;
        padding-top: 5px;
        opacity: 0.55;
        font-size: 15px; }

.app__header_v3 {
  display: flex;
  position: relative;
  overflow: hidden;
  flex-direction: column;
  background-color: transparent;
  margin: 0px;
  padding: 0px;
  margin-bottom: 20px;
  margin-top: 0px;
  background-color: #1c1e28; }
  .app__header_v3 .header-inner {
    position: relative;
    overflow: hidden; }
    .app__header_v3 .header-inner:before {
      content: "";
      display: block;
      position: absolute;
      z-index: 0;
      pointer-events: none;
      width: 100%;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      height: 100%;
      background-repeat: no-repeat;
      z-index: 10;
      background-image: url('../img/shader-2.svg?v=5');
      background-size: 100% 100%; }
    .app__header_v3 .header-inner .inner {
      position: relative;
      z-index: 11;
      text-align: center;
      margin: 50px 20px 100px 20px; }
      .app__header_v3 .header-inner .inner .app__icon {
        margin: 0px auto;
        width: 110px;
        height: 110px;
        border-radius: 25px; }
      .app__header_v3 .header-inner .inner .info {
        text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
        color: #fff; }
        .app__header_v3 .header-inner .inner .info .title {
          padding-top: 15px;
          font-size: 23px;
          font-weight: 900;
          color: #fff; }
        .app__header_v3 .header-inner .inner .info .seller {
          color: #fff;
          font-weight: 600;
          padding-top: 5px;
          opacity: 0.55;
          font-size: 15px; }
  .app__header_v3 .meta {
    margin: 0 20px 0 20px;
    position: relative;
    z-index: 11;
    margin-top: -50px; }
    .app__header_v3 .meta .segment {
      padding: 20px 0;
      border-top: 1px solid rgba(139, 143, 167, 0.15); }
  .app__header_v3 .app__header__image {
    transition: all 1.6s ease-in-out;
    transform: scale(1.1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-size: cover;
    background-position: top center;
    mix-blend-mode: luminosity;
    opacity: 0.35; }
  .app__header_v3:hover .app__header__image {
    opacity: 0.65;
    transform: scale(1); }

body.is-app.template-single {
  padding-top: 0px; }
  body.is-app.template-single .app__header_v3 {
    background-color: #232532;
    border-radius: 0px;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%; }
    body.is-app.template-single .app__header_v3 .header-inner:before {
      background-image: url(../img/shader-body-bg.svg); }

.support-status-v3 {
  padding: 20px; }
  .support-status-v3 .head {
    letter-spacing: -0.25px;
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    margin-bottom: 4px;
    text-transform: uppercase; }
  .support-status-v3 .app__status__icon {
    position: absolute;
    top: 11.7647058824px;
    right: 5px;
    justify-content: normal;
    transform: scale(0.9); }
  .support-status-v3 h3, .support-status-v3 p {
    max-width: 80%; }
  .support-status-v3 h3 {
    font-size: 24px;
    font-weight: 900;
    line-height: 1.3em;
    margin: 20px 0 10px 0; }
  .support-status-v3 p {
    line-height: 1.4em;
    color: #b9bbcc; }

.app__header {
  display: flex;
  position: relative;
  overflow: hidden;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  flex-direction: column;
  border-radius: 13px;
  background-color: transparent;
  padding: 20px;
  margin-bottom: 1px;
  min-height: 280px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px; }

.app__meta {
  background-color: transparent;
  padding-top: 20px;
  padding-bottom: 20px; }
  .app__meta.row-head {
    background-color: rgba(0, 0, 0, 0);
    padding-top: 10px;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.7);
    padding-bottom: 10px; }
  .app__meta.pull-up {
    position: relative;
    z-index: 10;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    margin-top: -40px; }
  .app__meta.row {
    display: table; }
    .app__meta.row.center .cell {
      text-align: left; }
    .app__meta.row .cell {
      display: table-cell;
      vertical-align: middle; }
  .app__meta div.cell-value {
    color: #fff;
    font-size: 18px;
    font-weight: 600; }
  .app__meta div.cell-key {
    padding-top: 5px;
    color: #8b8fa7;
    max-width: 210px;
    line-height: 1.3em;
    font-size: 14px; }
  .app__meta .buy-button {
    text-align: right; }
  .app__meta .buyers-recommendation {
    opacity: 1;
    font-size: 14px;
    color: #8b8fa7;
    line-height: 1.45em; }

.mapping__button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center; }
  .mapping__button--a .mapping__button__icon {
    background-color: #f74d5a; }
  .mapping__button--b .mapping__button__icon {
    background-color: #519f27; }
  .mapping__button--y .mapping__button__icon {
    background-color: #0071df; }
  .mapping__button--x .mapping__button__icon {
    background-color: #f8b359; }
  .mapping__button--l1 .mapping__button__icon, .mapping__button--l2 .mapping__button__icon, .mapping__button--r1 .mapping__button__icon, .mapping__button--r2 .mapping__button__icon {
    color: #fff;
    border-color: #fff; }

.mapping__right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%; }

.mapping__button__icon {
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 1px solid transparent;
  font-size: 12px;
  line-height: 16px;
  font-weight: bold;
  color: transparent;
  position: relative;
  z-index: 2; }
  .mapping__button__icon--long {
    width: 24px;
    border-radius: 20%; }

.mapping__button__caption {
  height: 24px;
  padding-left: 5px;
  font-size: 14px;
  font-weight: 500;
  color: #fff;
  position: relative;
  z-index: 1; }

.app__header__infos {
  display: flex;
  flex-direction: column;
  z-index: 2; }

.app__header__footer {
  margin-top: auto;
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  position: relative;
  z-index: 2; }

.app__storelink {
  margin-left: auto; }

.app__title {
  color: #fff;
  font-weight: bold;
  font-size: 24px;
  max-width: 70%; }

.app__author {
  color: #fff;
  opacity: 0.85;
  font-size: 14px;
  text-decoration: none; }

.app__icon {
  max-width: 100%;
  height: auto;
  width: 80px;
  height: 80px;
  border-radius: 20px;
  display: block;
  z-index: 2; }

.app__gallery {
  max-width: 100%;
  overflow: hidden;
  padding-top: 20px;
  padding-bottom: 20px;
  -webkit-mask-image: -webkit-radial-gradient(white, black); }

.app__gallery__inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  overflow-X: scroll;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: mandatory; }

.app__gallery__item {
  display: block;
  width: calc(100% - 40px);
  margin-right: 10px;
  height: auto;
  max-height: 230px;
  scroll-snap-align: center center;
  scroll-snap-padding: 20px; }
  .app__gallery__item:first-child {
    margin-left: 20px; }
  .app__category {
    display: none; }

.app__subcategories {
  display: flex;
  flex-direction: row;
  display: none; }

.app__status {
  font-weight: normal;
  line-height: 1.4;
  color: #fff;
  display: flex;
  flex-direction: row; }

.app__status__icon {
  padding-right: 20px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center; }
  .app__status__icon .icon:first-child {
    margin-right: 10px; }
  .app__status__icon svg {
    fill: #fff; }

.app__description {
  color: #fff;
  white-space: normal;
  line-height: 1.4em; }

.app__description--full {
  display: none; }

.app__description.open .app__description--full {
  display: block; }
  .app__description.open .app__description--short {
    display: none; }

.app_description__headline {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px; }

.app__description__more {
  color: #8b8fa7;
  font-size: 14px;
  opacity: 0.7;
  display: block;
  margin-top: 1em;
  text-transform: uppercase;
  text-decoration: none; }

@keyframes bondJamesBond {
  0% {
    border-radius: 75px;
    height: 44px;
    width: 44px; }

  50% {
    border-radius: 20px;
    width: 105%;
    overflow: hidden; }

  100% {
    border-radius: 20px;
    width: 100%; } }

.turbolinks-progress-bar {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  height: 5px;
  background: #d9e1e8;
  z-index: 9999;
  transition: width 300ms ease-out, opacity 150ms 150ms ease-in;
  transform: translate3d(0, 0, 0); }

.pagination {
  margin-top: 20px;
  margin-bottom: 20px; }

.pagination__next {
  display: flex;
  flex-direction: row;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  border: 0;
  font-size: 16px;
  margin-left: auto;
  margin-right: auto;
  border: 2px solid #d9e1e8;
  background-color: transparent;
  text-align: center;
  border-radius: 13px;
  color: #d9e1e8;
  transition: all 0.2s linear;
  cursor: pointer; }
  .pagination__next:hover {
    background-color: #d9e1e8;
    color: #eb3b5a; }

.column-row {
  display: flex;
  flex-direction: row;
  margin-bottom: 20px; }
  .column-row .list {
    width: 50%; }
    .column-row .list:first-child .list__item {
      margin-right: 10px; }
    .column-row .list:last-child .list__item {
      margin-left: 10px; }

.queries {
  color: #fff;
  margin: 20px 20px;
  opacity: 0.4; }

.footernav {
  margin-top: 50px;
  margin-bottom: 50px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: row;
  text-align: center;
  font-size: 11px;
  justify-content: center; }
  .footernav a {
    color: inherit; }

.text-color-success {
  color: #519f27; }

.text-color-fail {
  color: #f74d5a; }

.fixed-tabbar {
  display: none; }

.post__text {
  font-size: 18px;
  line-height: 1.4; }

.post__text p {
  margin: 0px 0px 20px 0px; }

.img--wrapper {
  overflow: auto;
  border-top: 1px solid #232532;
  border-bottom: 1px solid #232532;
  margin-bottom: 20px;
  margin-left: -20px;
  margin-right: -20px; }
  .img--wrapper img {
    width: 100%;
    height: auto;
    line-height: 0px; }

.post__text a {
  color: #fff;
  text-decoration: underline; }

.post__text img {
  max-width: 100%;
  height: auto;
  display: block; }

.post__text .app__description {
  white-space: normal; }

.background-image {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-size: cover;
  background-position: center center;
  opacity: 0.15;
  filter: grayscale(1);
  z-index: -1; }

.banner {
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 13px;
  margin-left: 20px;
  margin-right: 20px;
  padding: 20px;
  color: rgba(26, 26, 26, 0);
  line-height: 1.4; }
  .banner a {
    color: inherit; }

.app__devicelist {
  position: relative;
  background-color: #181c23; }
  .app__devicelist h2 {
    margin-bottom: 20px; }
  .app__devicelist:before {
    content: ' ';
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    right: 0px;
    background: #2b5876;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #4e4376, #2b5876);
    /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to bottom, #4e4376, #2b5876);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    mix-blend-mode: difference;
    pointer-events: none;
    opacity: 0.09;
    z-index: 2; }

.devicelist {
  margin: 0px -20px;
  padding: 7px 0px;
  display: flex;
  flex-direction: row;
  list-style-type: none;
  justify-content: center; }

.devicelist__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 500; }
  .devicelist__item:not(:last-child) {
    margin-right: 20px; }
  .devicelist__item svg {
    width: 45px;
    height: auto;
    fill: #fff;
    margin-bottom: 5px; }

.dim-outer {
  opacity: 0.85; }

.dim-artwork {
  position: absolute;
  top: -20px;
  left: -20px;
  right: -20px;
  bottom: -20px;
  opacity: 0.2;
  z-index: -10;
  filter: grayscale(1);
  background-size: cover; }

.feature--single .image {
  opacity: 1 !important;
  mix-blend-mode: normal;
  box-shadow: -19px 32px 68px -4px rgba(0, 0, 0, 0.3) !important; }

.telegram-channel {
  background: linear-gradient(135deg, #6e8efb, #a777e3);
  text-decoration: none;
  line-height: 1.4;
  display: flex;
  flex-direction: row;
  border-radius: 13px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden; }
  .telegram-channel.red {
    background: linear-gradient(135deg, #ff2900, #b73d02); }

.telegram-channel__icon {
  display: flex;
  background-color: rgba(0, 0, 0, 0.1);
  content: '';
  width: 150px;
  flex: 1 1 auto;
  background-image: url(/assets/img/svg/tile-2.svg);
  background-size: 221px;
  padding-left: 20px;
  padding-right: 25px;
  align-items: center; }
  .telegram-channel__icon .icon {
    margin: 0px auto; }
    .telegram-channel__icon .icon svg {
      fill: #fff;
      width: 38px;
      height: 38px;
      margin: 0px auto; }

.telegram-channel__caption {
  color: #fff;
  padding: 20px; }

.sale-feature {
  background: linear-gradient(135deg, #f54ea2, #ff7676);
  text-decoration: none;
  line-height: 1.4;
  display: flex;
  flex-direction: row;
  border-radius: 13px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  position: relative;
  overflow: hidden;
  min-height: 100px; }
  .sale-feature:before {
    content: '';
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(/assets/img/svg/tile-sale.svg);
    background-size: 221px; }

.sale-feature__caption {
  display: block;
  color: #fff;
  padding: 20px;
  font-size: 22px; }

.genre-toplist {
  margin-bottom: 20px;
  background-color: rgba(0, 0, 0, 0.25);
  color: #d9e1e8;
  padding: 0px;
  min-height: auto;
  transition: transform 0.1s ease-in-out; }
  .genre-toplist .feature__headline {
    color: #fff;
    padding: 20px; }
    .genre-toplist .feature__headline a {
      float: right;
      color: #fff;
      opacity: 0.45;
      text-decoration: none; }
      .genre-toplist .feature__headline a:hover {
        opacity: 1; }
  .genre-toplist .list {
    padding: 0px;
    margin: 0px; }
    .genre-toplist .list .game-item {
      padding: 15px 0px;
      display: table;
      font-weight: 700;
      line-height: 1.3em;
      text-decoration: none;
      border-top: 1px solid #1f232b; }
      .genre-toplist .list .game-item .cell {
        vertical-align: middle;
        display: table-cell; }
        .genre-toplist .list .game-item .cell.icon {
          line-height: 0px;
          width: 1%; }
          .genre-toplist .list .game-item .cell.icon img {
            border-radius: 9px;
            margin: 0px 20px;
            width: 45px !important;
            height: auto !important; }
        .genre-toplist .list .game-item .cell.text {
          color: #fff;
          font-size: 18px; }
      .genre-toplist .list .game-item .publisher {
        display: block;
        font-weight: normal;
        opacity: 0.45;
        padding-top: 1px;
        font-size: 13px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        max-width: 270px; }
      .genre-toplist .list .game-item .title {
        display: block;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
        max-width: 300px; }
        .genre-toplist .list .game-item .title small {
          display: none;
          /*font-size: 14px;*/
          display: none;
          font-family: monospace;
          float: right;
          font-size: 20px !important;
          font-weight: 100;
          opacity: 0.35 !important; }
      .genre-toplist .list .game-item:hover {
        background-color: rgba(0, 0, 0, 0.15); }

.feature.what-we-are-playing {
  padding: 0px;
  overflow: visible !important; }

.slider {
  white-space: nowrap; }
  .slider .item {
    display: inline-block; }
    .slider .item .image-cover {
      width: 180px;
      height: 100px;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center; }

body.template-updates .reddit-listing {
  border-radius: 6.5px;
  margin-left: 20px;
  margin-right: 20px;
  border: 0px;
  padding: 0px;
  margin-bottom: 20px;
  overflow: hidden;
  background-color: #1c1e28;
  color: #d9e1e8; }
  body.template-updates .reddit-listing .post, body.template-updates .reddit-listing .head {
    display: table;
    width: 100%;
    overflow: hidden;
    border-top: 1px solid #232532; }
    body.template-updates .reddit-listing .post.filter, body.template-updates .reddit-listing .head.filter {
      margin: 0px; }
    body.template-updates .reddit-listing .post .cell, body.template-updates .reddit-listing .head .cell {
      padding: 20px;
      vertical-align: top;
      display: table-cell; }
      body.template-updates .reddit-listing .post .cell a, body.template-updates .reddit-listing .head .cell a {
        color: #fff;
        text-decoration: none; }
        body.template-updates .reddit-listing .post .cell a:hover, body.template-updates .reddit-listing .head .cell a:hover {
          opacity: 0.6; }
      body.template-updates .reddit-listing .post .cell h3, body.template-updates .reddit-listing .head .cell h3 {
        margin: 0px;
        max-width: 90%; }
      body.template-updates .reddit-listing .post .cell a.btn, body.template-updates .reddit-listing .head .cell a.btn {
        font-size: 14px;
        white-space: nowrap;
        border-radius: 5px;
        font-weight: 600;
        /*background-color: red;*/
        padding: 10px 20px;
        background: linear-gradient(130deg, #eb3b5a, #cf1536); }
        body.template-updates .reddit-listing .post .cell a.btn:hover, body.template-updates .reddit-listing .head .cell a.btn:hover {
          color: #fff;
          opacity: 1 !important;
          background: linear-gradient(135deg, #4799eb, #1466b8); }
      body.template-updates .reddit-listing .post .cell .appicon, body.template-updates .reddit-listing .head .cell .appicon {
        border-radius: 7px;
        max-width: 100px;
        width: 40px;
        height: 40px; }
        body.template-updates .reddit-listing .post .cell .appicon:hover, body.template-updates .reddit-listing .head .cell .appicon:hover {
          opacity: 0.8; }
      body.template-updates .reddit-listing .post .cell img, body.template-updates .reddit-listing .head .cell img {
        max-width: 60px;
        margin: 0px; }
      body.template-updates .reddit-listing .post .cell .url, body.template-updates .reddit-listing .head .cell .url {
        max-width: 220px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis; }
      body.template-updates .reddit-listing .post .cell .info, body.template-updates .reddit-listing .head .cell .info, body.template-updates .reddit-listing .post .cell .url, body.template-updates .reddit-listing .head .cell .url {
        color: #8b8fa7;
        font-size: 14px;
        margin-top: 5px; }
        body.template-updates .reddit-listing .post .cell .info a, body.template-updates .reddit-listing .head .cell .info a, body.template-updates .reddit-listing .post .cell .url a, body.template-updates .reddit-listing .head .cell .url a, body.template-updates .reddit-listing .post .cell .info span, body.template-updates .reddit-listing .head .cell .info span, body.template-updates .reddit-listing .post .cell .url span, body.template-updates .reddit-listing .head .cell .url span {
          color: #8b8fa7; }
        body.template-updates .reddit-listing .post .cell .info a:hover, body.template-updates .reddit-listing .head .cell .info a:hover, body.template-updates .reddit-listing .post .cell .url a:hover, body.template-updates .reddit-listing .head .cell .url a:hover {
          color: #fff !important;
          text-decoration: underline; }
      body.template-updates .reddit-listing .post .cell.content, body.template-updates .reddit-listing .head .cell.content {
        padding-right: 0px; }
      body.template-updates .reddit-listing .post .cell.upvotes, body.template-updates .reddit-listing .head .cell.upvotes {
        white-space: nowrap;
        padding-right: 0px;
        width: 1%;
        color: #fff;
        font-size: 14px;
        opacity: 0.6; }
      body.template-updates .reddit-listing .post .cell.filter a, body.template-updates .reddit-listing .head .cell.filter a {
        display: inline-block;
        color: #b9bbcc;
        font-weight: 600;
        padding: 4px 8px;
        font-size: 14px; }
        body.template-updates .reddit-listing .post .cell.filter a:hover, body.template-updates .reddit-listing .head .cell.filter a:hover {
          opacity: 1;
          color: #8b8fa7; }
        body.template-updates .reddit-listing .post .cell.filter a.active, body.template-updates .reddit-listing .head .cell.filter a.active {
          opacity: 1;
          font-size: 14px;
          color: #1c1e28;
          background-color: #fff;
          border-radius: 3px; }
      body.template-updates .reddit-listing .post .cell.icon, body.template-updates .reddit-listing .head .cell.icon {
        width: 1%; }
    body.template-updates .reddit-listing .post:first-child, body.template-updates .reddit-listing .head:first-child {
      border-top: 0px; }
  body.template-updates .reddit-listing .head {
    background-color: #191b24; }
    body.template-updates .reddit-listing .head .cell {
      vertical-align: middle; }

.tiny-icon {
  display: inline-block;
  background-color: #51e891;
  color: #fff;
  width: 12px;
  position: relative;
  height: 12px;
  border-radius: 100px; }
  .tiny-icon.red {
    background-color: #ff594d; }

.warning-banner {
  border-radius: 6.5px;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05);
  margin-left: 20px;
  margin-right: 20px;
  color: #fff;
  font-size: 20px;
  line-height: 1.3em;
  padding: 26px 80px 26px 26px;
  position: relative;
  background-position: center center;
  text-decoration: none;
  background-color: #191b24;
  margin-bottom: 20px; }

#js-submit-form .app__description__more {
  text-align: center;
  max-width: 85%;
  margin: 0px auto;
  margin-bottom: 20px;
  padding: 0px %global-padding;
  line-height: 1.4em; }

.upvote-btn {
  margin-top: 20px;
  white-space: nowrap;
  transition: all 0.3s linear;
  margin-left: auto;
  margin-right: auto;
  display: table;
  margin-bottom: 10px; }
  .upvote-btn span {
    transition: all 0.05s linear;
    display: inline-block;
    padding: 10px 15px;
    font-weight: 700;
    cursor: pointer;
    background-color: #ef574d;
    color: #fff;
    border-radius: 4px; }
  .upvote-btn span:hover {
    background-color: #232532; }
  .upvote-btn span.disabled {
    background-color: rgba(77, 77, 77, 0);
    pointer-events: none;
    opacity: 0.3; }

body.is-app {
  padding-top: 20px; }
  body.is-app * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
  body.is-app.template-search .search, body.is-app.template-search .listing__headline {
    display: none; }

.text--warn {
  color: #fd1a57; }

.text--success {
  color: green; }

@keyframes splash {
  from {
    transform: rotate(-3.7deg) translateY(30px) scale(1, 1); }

  to {
    transform: rotate(-3.7deg) translateY(-370px) scale(1.3, 1.3); } }

.search-header {
  border: 0px;
  color: #fff;
  border-radius: 6.5px;
  padding: 20px 20px 30px 20px;
  background: linear-gradient(135deg, #fd0b4c 0%, #af0230 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  overflow: hidden; }
  @media only screen and (max-width: 400px) {
  .search-header {
    width: 100%;
    margin-bottom: 20px;
    border-radius: 0px; } }
  .search-header .background {
    display: none;
    background-image: url('/assets/img/svg/tile-sale.svg');
    background-repeat: repeat;
    position: absolute;
    background-size: 100px 100px;
    z-index: 0;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0; }
  .search-header .inner {
    position: relative;
    z-index: 1;
    padding: 0; }
  .search-header .inner .body {
    padding: 0;
    max-width: 77%;
    padding: 60px 0 20px 0;
    font-size: 20.25px;
    line-height: 1.3em;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.25px; }
    .search-header .inner .body a {
      color: #fff; }
  .search-header .inner .logo .icon {
    margin: 0px;
    display: block;
    padding: 0px; }
    .search-header .inner .logo .icon svg {
      width: 50px; }
  .search-header .inner form input {
    border: 0px;
    font-weight: 400;
    min-width: 240px;
    padding: 11.1111111111px 42px 11.1111111111px 11.1111111111px;
    border-radius: 5.2px;
    font-size: 14.4px;
    background-image: url(/assets/img/lupe.png);
    background-size: auto 50%;
    background-position: right 10px center;
    background-repeat: no-repeat; }
    .search-header .inner form input::placeholder {
      color: #8b8fa7; }

.large-game-feature {
  display: flex;
  flex-direction: column;
  border-bottom: 0px;
  color: #fff;
  text-decoration: none; }
  .large-game-feature .large-game-feature__headline {
    display: flex;
    flex-direction: row;
    border-bottom: 1px solid #232532;
    align-items: flex-end;
    padding: 20px 0 20px 20px; }
  .large-game-feature .large-game-feature__headline h2 {
    letter-spacing: -0.25px;
    font-size: 24.3px; }
  .large-game-feature .game-info {
    display: table; }
  .large-game-feature .game-info div.icon, .large-game-feature .game-info div.data {
    vertical-align: top;
    display: table-cell;
    padding: 20px 0 20px 0; }
  .large-game-feature .game-info img.app-icon {
    margin: 0 20px 0 20px;
    transform: rotate(-2deg);
    max-width: 80px;
    border-radius: 17px; }

.summary {
  background-color: #1c1e28;
  border-radius: 6.5px;
  padding: 18px 20px 20px 20px;
  margin-top: 20px;
  display: flex; }
  .summary .inner {
    max-width: 95%;
    line-height: 1.4em;
    color: #b9bbcc; }
  .summary .inner .app__meta {
    width: 90%;
    padding: 10px 0px 20px 0px; }
  .summary .inner .head {
    letter-spacing: -0.25px;
    color: #fff;
    font-weight: 800;
    font-size: 14px;
    margin-bottom: 4px;
    text-transform: uppercase; }
  .summary .inner p {
    margin-top: 13.3333333333px; }
    .summary .inner p.top {
      font-size: 21px;
      line-height: 1.25em;
      font-weight: 600;
      color: #fff; }

.rating-display {
  color: #fff; }
  .rating-display.rating-display-summary {
    margin-top: 20px; }
  .rating-display.boxed {
    padding: 20px;
    border-bottom: 1px solid #232532; }
  .rating-display .rating-title {
    margin-bottom: 5px;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700; }
  .rating-display .rating {
    margin-bottom: 0px; }
  .rating-display .rating .rating__star {
    font-size: 23px;
    margin-right: 2px; }
    .rating-display .rating .rating__star.rating__star--full {
      color: #fff; }
    .rating-display .rating .rating__star.rating__star--empty {
      opacity: 0.5;
      color: #8b8fa7; }

.review-wrapper {
  background-color: #1c1e28;
  border: 0px;
  padding: 0px; }
  .review-wrapper .product-link {
    padding: 20px;
    border-bottom: 1px solid #232532; }
  .review-wrapper .product-link a {
    display: inline-block;
    width: auto; }
  .review-wrapper .image {
    padding: 20px;
    background-color: #fff;
    text-align: center; }
  .review-wrapper .image img {
    max-width: 90%; }
  .review-wrapper .bullet-list {
    display: block;
    padding: 20px;
    border-bottom: 1px solid #232532; }
  .review-wrapper .bullet-list .list-header {
    font-size: 110%;
    padding: 0px;
    margin: 0px;
    font-weight: 800;
    letter-spacing: -0.25px;
    padding-bottom: 10px; }
    .review-wrapper .bullet-list .list-header span {
      font-size: 88%;
      position: relative;
      top: 1px; }
  .review-wrapper .bullet-list ul {
    padding-left: 20px;
    margin: 10px 0px 0px 0px; }
    .review-wrapper .bullet-list ul li {
      color: #b9bbcc;
      line-height: 1.4em; }
  .review-wrapper .segment {
    padding: 20px;
    border-bottom: 1px solid #232532;
    margin: 0px; }
  .review-wrapper .segment:last-of-type {
    margin-bottom: 0px; }
  .review-wrapper .segment.meta {
    font-size: 14px;
    padding: 13.3333333333px 20px;
    color: #8b8fa7; }
  .review-wrapper .segment.header {
    background-color: #1a1c25;
    border-top-left-radius: 6.5px;
    border-top-right-radius: 6.5px; }
  .review-wrapper .segment .subtitle {
    color: #b9bbcc;
    margin-top: 5px;
    text-transform: capitalize; }
  .review-wrapper .segment .text {
    max-width: 85%;
    line-height: 1.4em;
    color: #b9bbcc; }
  .review-wrapper .segment .link-banner {
    border-radius: 0px;
    border: 1px solid rgba(139, 143, 167, 0.2);
    margin: 0px;
    width: 100%;
    margin-top: 20px; }
    .review-wrapper .segment .link-banner .link-banner__title {
      border-color: rgba(139, 143, 167, 0.2); }
    .review-wrapper .segment .link-banner:hover {
      background-color: transparent; }
    .review-wrapper .segment .link-banner .link-banner__description {
      color: #fff; }

.mfi-controller-list {
  margin: 20px; }
  .mfi-controller-list .mfi-controller-card {
    display: flex;
    border-radius: 6.5px;
    background-color: #1c1e28;
    margin-bottom: 10px;
    color: #fff; }
  .mfi-controller-list .mfi-controller-card .img {
    height: 80px;
    width: 80px;
    margin-left: 0px;
    overflow: hidden;
    background-color: #fff; }
    .mfi-controller-list .mfi-controller-card .img img {
      width: 100px;
      margin: 5px; }
  .mfi-controller-list .mfi-controller-card .text {
    margin-right: 0px; }

.popular-searches {
  border-radius: 0px;
  overflow: visible; }
  .popular-searches h2 {
    font-size: 17px;
    font-weight: 600;
    color: #8b8fa7;
    padding-bottom: 10px; }
  .popular-searches a {
    display: block;
    padding: 10px 0px;
    color: #fff;
    font-size: 19px;
    font-weight: 500;
    text-decoration: none;
    border-top: 1px solid rgba(139, 143, 167, 0.1); }

.bookmark-btn {
  background-color: #eb3b5a !important;
  color: #fff !important;
  cursor: pointer;
  text-transform: none !important; }

.bookmark-btn.processing {
  opacity: 0.8; }

.bookmark-btn.active {
  background-color: #232532 !important;
  color: #eb3b5a !important; }

.js-join-channel {
  background-color: #eb3b5a !important;
  color: #fff !important;
  cursor: pointer;
  text-transform: none !important; }

.js-join-channel.processing {
  opacity: 0.8; }

.js-join-channel.active {
  background-color: #232532 !important;
  color: #eb3b5a !important; }

.wishlist-empty {
  display: block;
  padding: 100px 0px;
  background-color: #1c1e28;
  border-radius: 6.5px;
  text-align: center;
  color: #8b8fa7;
  font-weight: 500; }
  .wishlist-empty .background-tile {
    background-image: url(/assets/img/ghost-items-3.png);
    background-repeat: repeat-y;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-size: 100%;
    opacity: 0.06;
    pointer-events: none; }

[data-vote-object-id] {
  cursor: pointer; }

.loading-wrap {
  text-align: center;
  padding: 40px 0px;
  color: #8b8fa7; }

.queries {
  overflow-wrap: break-word; }

.list-button {
  background-color: #292c40;
  overflow: hidden;
  margin-top: 20px;
  border-radius: 6.5px; }
  .list-button .display {
    display: table;
    width: 100%; }
  .list-button .display .title, .list-button .display .dropdown-toggle {
    display: table-cell;
    font-weight: 600;
    font-size: 17px; }
    .list-button .display .title:hover, .list-button .display .dropdown-toggle:hover {
      cursor: pointer;
      background-color: rgba(0, 0, 0, 0.06); }
  .list-button .display .title {
    position: relative;
    padding: 16px 20px; }
  .list-button .display .dropdown-toggle {
    width: 60px;
    position: relative;
    border-left: 2px solid #1b1d28; }
    .list-button .display .dropdown-toggle svg {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 25px;
      height: 25px;
      transform: translate(-50%, -50%); }
  .list-button span.status {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translate(0%, -50%);
    background-color: #8b8fa7;
    text-transform: uppercase;
    padding: 5px 7px;
    border-radius: 3px;
    color: #313448;
    font-weight: 800;
    font-size: 13px; }
  .list-button .action {
    display: none;
    border-top: 2px solid #1b1d28;
    padding: 16px 20px;
    color: #b9bbcb;
    font-weight: 500; }
  .list-button .action:hover {
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.06); }
  .list-button ul.list {
    margin: 0px;
    padding: 0px;
    display: none;
    list-style-type: none; }
  .list-button ul.list li {
    position: relative;
    border-top: 2px solid #1b1d28;
    padding: 16px 20px;
    cursor: pointer;
    color: #b9bbcb;
    font-weight: 500;
    background-color: rgba(255, 255, 255, 0.04); }
    .list-button ul.list li .actions {
      position: absolute;
      top: 50%;
      right: 15px;
      transform: translateY(-50%); }
    .list-button ul.list li .actions a, .list-button ul.list li .actions span {
      position: static;
      display: inline-block;
      margin-left: 14px;
      transform: none;
      padding: 3px 5px;
      text-decoration: none; }
    .list-button ul.list li .actions span.status {
      font-size: 13px; }
    .list-button ul.list li .actions a {
      padding-left: 0px;
      padding-right: 0px;
      color: #b9bbcb; }
      .list-button ul.list li .actions a:hover {
        opacity: 0.8; }
    .list-button ul.list li:hover {
      cursor: pointer;
      background-color: rgba(0, 0, 0, 0.06); }
  .list-button.active ul.list, .list-button.active .action {
    display: block; }

.question-cards .question-card {
  border-radius: 6.5px;
  display: block;
  background-color: #292c3b;
  padding: 40px;
  margin-bottom: 2px;
  text-align: center; }
  .question-cards .question-card .title {
    font-size: 25px;
    line-height: 1.24em;
    color: #fff;
    font-weight: 700; }
  .question-cards .question-card .answers {
    margin-top: 20px; }
    .question-cards .question-card .answers .answer {
      font-weight: 500;
      font-size: 19px;
      padding-top: 10px;
      cursor: pointer;
      color: rgba(142, 146, 175, 0.7);
      transition: all 0.14s linear;
      background-color: transparent;
      display: inline-block;
      padding: 8px 18px;
      margin: 10px 10px 0px 0px;
      border-radius: 100px;
      box-shadow: inset 0px 0px 0px 2px rgba(142, 146, 175, 0.7); }
    .question-cards .question-card .answers .answer.numeric {
      display: inline-block;
      margin-right: 0px;
      border-radius: 0px; }
      .question-cards .question-card .answers .answer.numeric:first-child {
        border-bottom-left-radius: 100px;
        border-top-left-radius: 100px;
        padding-left: 20px; }
      .question-cards .question-card .answers .answer.numeric:last-child {
        border-bottom-right-radius: 100px;
        border-top-right-radius: 100px;
        padding-right: 20px; }
    .question-cards .question-card .answers .answer.selected {
      background-color: #fff;
      color: #292c3b;
      box-shadow: none; }

.c-banner .c-banner__text {
  font-size: 15px;
  line-height: 1.4em; }

.btn {
  display: inline-flex;
  border-radius: 4px;
  text-decoration: none; }

.btn--has-icon {
  flex-direction: row;
  align-items: center;
  justify-content: center; }
  .btn--has-icon .icon {
    margin-right: 0.5em;
    display: inline-flex;
    align-items: center;
    justify-content: center; }

.btn--small {
  padding: 7px 12px;
  font-size: 0.85em;
  font-weight: 600; }
  .btn--small.btn--has-icon svg {
    width: 14px;
    height: auto; }

.btn--primary {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 12px;
  padding-left: 17px;
  padding-right: 17px;
  font-size: 1.03em;
  border-radius: 4px;
  font-weight: 600; }
  .btn--primary:hover {
    opacity: 0.85; }
  .btn--primary.btn--has-icon svg {
    width: 20px;
    height: auto; }

.btn--medium {
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 17px;
  padding-right: 17px;
  font-size: 1.05em;
  font-weight: bold; }
  .btn--medium.btn--has-icon svg {
    width: 16px;
    height: auto; }

.btn--icon .icon .svg {
  with: 24px;
  height: auto;
  fill: #fff; }

.btn--uppercase {
  text-transform: uppercase; }

.btn--centered {
  margin-left: auto;
  margin-right: auto; }

.btn--inline {
  display: inline-flex;
  width: auto; }

.btn--superwhite {
  background-color: #fff;
  color: #1f232b; }
  .btn--superwhite svg {
    fill: #1f232b; }

.btn--testflight {
  background-color: #0096ff;
  color: #fff; }

.btn--white {
  background-color: #fff;
  color: #1f232b; }
  .btn--white svg {
    fill: #1f232b; }

.btn--light {
  background-color: #292c3b;
  color: #fff; }
  .btn--light svg {
    fill: #1f232b; }
  .btn--light:hover {
    background-color: #2e3041; }

.btn--red {
  background-color: #eb3b5a;
  color: #fff; }
  .btn--red svg {
    fill: #fff; }

.btn--black {
  background-color: #1c1e28;
  color: #fff; }
  .btn--black svg {
    fill: #fff; }
  .btn--black:active {
    background-color: #eb3b5a; }

.btn--appstore {
  background-color: #000;
  color: #fff; }
  .btn--appstore svg {
    fill: #fff; }

.btn--telegram {
  background-color: #08c;
  color: #fff; }
  .btn--telegram svg {
    fill: #fff; }

.btn--whatsapp {
  background-color: #25d366;
  color: #fff; }
  .btn--whatsapp svg {
    fill: #fff; }

.pill {
  border-radius: 100px;
  display: inline-block;
  font-weight: bold;
  text-decoration: none; }

.pill--small {
  font-size: 14px;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 5px;
  padding-bottom: 5px; }

.pill--light {
  color: #fff; }

:root {
  --gradient-red: linear-gradient(135deg, #f5515f, #a1051d);
  --gradient-blue: linear-gradient(135deg, #13f1fc, #0470dc);
  --gradient-orange: linear-gradient(135deg, #f69d26, #f8b55d);
  --gradient-green: linear-gradient(135deg, #b1ea4d, #459522);
  --gradient-red: linear-gradient(135deg, #de5c50, #de5c50);
  --gradient-orange: linear-gradient(135deg, #f69d26, #f8b55d);
  --gradient-green: linear-gradient(135deg, #58b261, #44934c);
  --gradient-blue: linear-gradient(135deg, #3196fb, #0470dc);
  --gradient-purple: linear-gradient(135deg, #6b6ed8, #8344b3); }

.app_pricechart {
  background-color: #353a44;
  color: #d9e1e8;
  padding: 20px 25px 20px 20px; }

.banner {
  border: 0px;
  padding: 0px;
  margin-bottom: 20px;
  overflow: hidden;
  border-radius: 6.5px;
  background-color: #1c1e28;
  color: #b9bbcc; }
  .banner a {
    color: #fff;
    font-weight: 600; }
  .banner .intro, .banner .head {
    padding: 20px; }
  .banner .head {
    font-size: 18px; }
  .banner .intro {
    border-top: 1px solid #232532;
    border-bottom: 1px solid #232532; }
  .banner .external {
    padding: 14px 20px; }
  .banner .external a {
    padding-right: 10px;
    text-decoration: none;
    font-size: 14px; }

.price-development {
  padding-top: 0px;
  padding-bottom: 0px;
  border: 0px; }
  .price-development .page__item__inner {
    padding: 20px; }
  .price-development .graph {
    border-top: 1px solid #232532;
    background-color: rgba(0, 0, 0, 0.15);
    padding: 20px; }
  .price-development .display {
    overflow: hidden; }
  .price-development .display.buyers-recommendation {
    border: 0px !important; }
    .price-development .display.buyers-recommendation .cell {
      border: 0px !important;
      padding: 0 20px 20px 20px !important; }
  .price-development .display .row .cell {
    float: left;
    width: 50%;
    border-top: 1px solid #232532;
    border-right: 1px solid #232532;
    padding: 15px 20px; }
    .price-development .display .row .cell div.value {
      font-size: 18px;
      padding-top: 4px;
      line-height: 1.3em; }
      .price-development .display .row .cell div.value.bold {
        font-weight: bold; }
    .price-development .display .row .cell i {
      font-style: normal;
      font-weight: 400;
      padding-right: 2px;
      font-size: 90%; }
    .price-development .display .row .cell label {
      color: #8b8fa7;
      font-size: 14px; }
    .price-development .display .row .cell.last {
      border-right: 0px solid #1f232b; }
    .price-development .display .row .cell:last-of-type {
      border-right: 0px !important; }
    .price-development .display .row .cell.full-width {
      width: 100%;
      border-right: 0; }
      .price-development .display .row .cell.full-width div.value {
        max-width: 70%;
        line-height: 1.4em; }
    .price-development .display .row .cell .sale-progessbar .label {
      font-size: 14px;
      color: #8b8fa7; }
      .price-development .display .row .cell .sale-progessbar .label span {
        color: #fff;
        font-weight: 700; }
      .price-development .display .row .cell .sale-progessbar .full-bar {
        overflow: hidden;
        border-radius: 4.3333333333px;
        margin-top: 10px;
        background-color: #232532; }
      .price-development .display .row .cell .sale-progessbar .full-bar .inner-bar {
        background-color: #383c50;
        display: inline-block;
        font-size: 14px;
        padding: 5px 10px;
        font-weight: 700;
        white-space: nowrap; }

.headline {
  font-weight: bold; }

.headline--large {
  font-size: 27px; }

.headline--medium {
  font-size: 18px; }

.headline--small {
  font-size: 14px; }

.card {
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px; }

.desktop-nav-v2 {
  display: block;
  background-color: red;
  margin: 20px;
  border-radius: 6.5px; }
  .desktop-nav-v2 .desktop-nav-list {
    display: block;
    overflow: scroll;
    white-space: nowrap;
    padding: 20px; }
  .desktop-nav-v2 .desktop-nav-list .desktop-nav__item {
    color: #fff;
    margin-right: 10px;
    white-space: nowrap;
    display: inline-block;
    border-bottom: 1px solid #fff; }
    .desktop-nav-v2 .desktop-nav-list .desktop-nav__item .desktop-nav__item__caption {
      white-space: nowrap;
      display: inline-block; }

.card--simple {
  display: flex;
  text-decoration: none;
  width: 100%;
  transition: all 0.1s linear;
  background: linear-gradient(135deg, transparent, rgba(0, 0, 0, 0));
  overflow: hidden;
  border-radius: 13px;
  position: relative;
  color: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05);
  min-height: 340px;
  cursor: pointer; }
  .card--simple .inner {
    padding: 10px; }
  .card--simple .inner .type {
    text-transform: uppercase;
    font-size: 14px;
    position: relative;
    z-index: 2;
    font-weight: 800;
    margin-bottom: 3px; }
  .card--simple .inner h1 {
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 20px;
    display: block; }
  .card--simple .inner h2 {
    transition: all 0.1s linear;
    max-width: 80%;
    opacity: 0.74;
    font-size: 23px;
    font-weight: 500;
    display: block; }
  .card--simple .games {
    position: absolute;
    bottom: -30px;
    right: -30px;
    width: 50%;
    transform: rotate(-4deg);
    transition: all 0.1s linear; }
  .card--simple .games img {
    width: 43%;
    height: auto;
    margin: 3%;
    border-radius: 22px;
    filter: grayscale(1);
    opacity: 0.3; }
  .card--simple .games .circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    transition: all 0.12s linear; }
    .card--simple .games .circle.circle--3 {
      width: 350px;
      height: 350px;
      background-color: rgba(255, 255, 255, 0.03);
      transform: translate(-50%, -55%); }
    .card--simple .games .circle.circle--4 {
      width: 590px;
      height: 590px;
      background-color: rgba(0, 0, 0, 0.04);
      transform: translate(-50%, -53%); }
    .card--simple .games .circle.circle--5 {
      width: 460px;
      height: 460px;
      border: 3px solid rgba(255, 255, 255, 0.016);
      transform: translate(-50%, -53%); }
  .card--simple .icon {
    position: absolute;
    bottom: 20px;
    right: -5px; }
  .card--simple .icon .circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    transition: all 0.12s linear; }
    .card--simple .icon .circle.circle--1 {
      width: 270px;
      height: 270px;
      background-color: rgba(255, 255, 255, 0.03);
      transform: translate(-50%, -50%); }
    .card--simple .icon .circle.circle--2 {
      width: 430px;
      height: 430px;
      border: 2px solid rgba(255, 255, 255, 0.025);
      transform: translate(-50%, -58%); }
  .card--simple .icon i {
    transition: all 0.12s linear;
    transform: rotate(-3deg);
    opacity: 0.89;
    color: #fff;
    font-size: 110px;
    text-shadow: 0px 12px 92px rgba(0, 0, 0, 0.05); }
  .card--simple:hover {
    filter: brightness(1.1); }
  .card--simple:hover .games {
    width: 53%; }
    .card--simple:hover .games img {
      opacity: 0.4; }
  .card--simple:hover .circle--1 {
    width: 290px !important;
    height: 290px !important; }
  .card--simple:hover .circle--1 {
    width: 290px !important;
    height: 290px !important; }
  .card--simple:hover .circle--3 {
    width: 370px !important;
    height: 370px !important; }
  .card--simple:hover .circle--4 {
    width: 610px !important;
    height: 610px !important; }
  .card--simple:hover .circle--5 {
    width: 510px !important;
    height: 510px !important; }
  .card--simple:hover .icon i {
    text-shadow: 0px 12px 92px rgba(0, 0, 0, 0.03);
    opacity: 1;
    font-size: 120px; }
  .card--simple.small {
    min-height: auto; }
  .card--simple.small .inner {
    padding-left: 28%; }
    .card--simple.small .inner h1 {
      font-size: 25px;
      margin-bottom: 15px; }
    .card--simple.small .inner h2 {
      max-width: 80%;
      font-size: 18px; }
  .card--simple.small .icon {
    left: -5px;
    right: auto;
    bottom: 10px; }
    .card--simple.small .icon i {
      font-size: 80px; }
  .card--simple.small:hover i {
    font-size: 90px; }

.entries .card--simple {
  margin-right: 0px;
  margin-left: 0px; }

.card__background {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: linear-gradient(135deg, #f54ea2, #ff7676);
  border-radius: 13px;
  z-index: 0; }

.card__foreground {
  z-index: 1;
  position: relative; }

.card--collection {
  border-radius: 13px;
  position: relative;
  overflow: unset;
  color: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px; }

.card--collection__headline {
  margin-bottom: 10px; }
  .card--collection__headline a {
    color: inherit;
    text-decoration: none; }

.card--collection__description {
  margin-bottom: 20px;
  font-size: 18px;
  max-width: 80%;
  opacity: 0.7; }

.card--collection__list {
  display: flex;
  flex-direction: row;
  list-style-type: none; }

.card--collection__list__item {
  display: flex;
  flex-direction: column;
  scroll-snap-align: center center;
  scroll-snap-padding: 20px; }
  .card--collection__list__item:not(:last-child) {
    margin-right: 20px; }

.card--collection__list__item__image {
  border-radius: 13px;
  display: block;
  width: 84px;
  height: auto;
  margin-bottom: 10px; }

.card--collection__list__item__title {
  color: #fff;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  max-width: 9ch; }
  .card--collection__list__item__title a {
    color: inherit;
    text-decoration: none; }

.in-app-as-conversion-container {
  display: none; }

body.is-app .in-app-as-conversion-container {
  display: block;
  position: fixed;
  bottom: 0px;
  left: 0px;
  right: 0px;
  background-color: #1c1e29;
  z-index: 20;
  border-bottom: 1px solid #232532; }
  body.is-app .in-app-as-conversion-container .page__item {
    padding: 12.5px 0px;
    padding-left: 43px;
    max-width: 430px; }
  body.is-app .in-app-as-conversion-container .page__item .app__icon {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 50%;
    left: 0px;
    border-radius: 7px;
    transform: translateY(-50%); }
  body.is-app .in-app-as-conversion-container .page__item .info .title {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -0.25px;
    padding-bottom: 0px; }
    body.is-app .in-app-as-conversion-container .page__item .info .seller {
      font-size: 13px;
      color: #8b8fa7;
      font-weight: 400; }
  body.is-app .in-app-as-conversion-container .page__item .actions {
    position: absolute;
    top: 50%;
    right: 0px;
    transform: translateY(-50%); }

.depth-0 {
  box-shadow: none !important; }

.depth-1 {
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2); }

.depth-2 {
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3); }

.depth-3 {
  box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2); }

.depth-4 {
  --main-bg-color: brown;
  box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2); }

.depth-5 {
  box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2); }

.test:before {
  display: block;
  content: 'test';
  color: var(--test);
  position: absolute;
  top: 0px;
  left: 50%;
  font-size: 50px;
  transform: translateY(var(--tilt-x)); }

.app-header {
  margin-left: 0px;
  margin-right: 0px;
  padding: 180px 20px 20px 20px;
  width: 100%;
  margin-top: -20px;
  margin-bottom: 20px;
  overflow: hidden; }
  .app-header .image {
    position: absolute;
    top: 20px;
    width: 80%;
    right: -50px;
    transform: rotate(-3deg);
    mix-blend-mode: overlay;
    opacity: 0.6; }
  .app-header .image img {
    width: 100%;
    height: auto; }
  .app-header .info {
    position: relative;
    z-index: 10; }
  .app-header .info .title {
    font-size: 32px;
    font-weight: 900;
    color: #fff;
    max-width: 75%;
    padding-bottom: 10px; }
  .app-header .info .subtitle {
    font-size: 20px;
    font-weight: 600;
    color: #b9bbcc; }
  .app-header:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    pointer-events: none;
    width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 100%;
    background-repeat: no-repeat;
    z-index: 10;
    background-image: url(../img/shader-body-bg.svg);
    background-size: 100% 100%; }

.lazy-list .list__item {
  opacity: 0;
  animation: fadeIn 0.2s 1;
  animation-fill-mode: forwards; }

.list__item__tags {
  margin-bottom: 5px; }

.list__item__title i {
  font-style: normal;
  font-weight: 400;
  color: #b9bbcc; }

.app__header_v3 .header-inner .inner .info .title i {
  font-style: normal;
  font-weight: 400;
  color: #b9bbcc; }

.lazy-list .list__item:nth-child(1) {
  animation-delay: 0.1s; }

.lazy-list .list__item:nth-child(2) {
  animation-delay: 0.2s; }

.lazy-list .list__item:nth-child(3) {
  animation-delay: 0.3s; }

.lazy-list .list__item:nth-child(4) {
  animation-delay: 0.4s; }

.lazy-list .list__item:nth-child(5) {
  animation-delay: 0.5s; }

.lazy-list .list__item:nth-child(6) {
  animation-delay: 0.6s; }

.lazy-list .list__item:nth-child(7) {
  animation-delay: 0.7s; }

.lazy-list .list__item:nth-child(8) {
  animation-delay: 0.8s; }

.lazy-list .list__item:nth-child(9) {
  animation-delay: 0.9s; }

.lazy-list .list__item:nth-child(10) {
  animation-delay: 1s; }

.lazy-list .list__item:nth-child(11) {
  animation-delay: 1.1s; }

.lazy-list .list__item:nth-child(12) {
  animation-delay: 1.2s; }

.lazy-list .list__item:nth-child(13) {
  animation-delay: 1.3s; }

.lazy-list .list__item:nth-child(14) {
  animation-delay: 1.4s; }

.lazy-list .list__item:nth-child(15) {
  animation-delay: 1.5s; }

.lazy-list .list__item:nth-child(16) {
  animation-delay: 1.6s; }

.lazy-list .list__item:nth-child(17) {
  animation-delay: 1.7s; }

.lazy-list .list__item:nth-child(18) {
  animation-delay: 1.8s; }

.lazy-list .list__item:nth-child(19) {
  animation-delay: 1.9s; }

.lazy-list .list__item:nth-child(20) {
  animation-delay: 2s; }

.lazy-list .list__item:nth-child(21) {
  animation-delay: 2.1s; }

.lazy-list .list__item:nth-child(22) {
  animation-delay: 2.2s; }

.lazy-list .list__item:nth-child(23) {
  animation-delay: 2.3s; }

.lazy-list .list__item:nth-child(24) {
  animation-delay: 2.4s; }

.lazy-list .list__item:nth-child(25) {
  animation-delay: 2.5s; }

.lazy-list .list__item:nth-child(26) {
  animation-delay: 2.6s; }

.lazy-list .list__item:nth-child(27) {
  animation-delay: 2.7s; }

.lazy-list .list__item:nth-child(28) {
  animation-delay: 2.8s; }

.lazy-list .list__item:nth-child(29) {
  animation-delay: 2.9s; }

.lazy-list .list__item:nth-child(30) {
  animation-delay: 3s; }

@keyframes fadeIn {
  0% {
    opacity: 0;
    transform: translateY(10%) scale(0.98); }

  100% {
    opacity: 1;
    transform: translateY(0) scale(1); } }

@keyframes fadeUp {
  0% {
    transform: translateY(10%); }

  100% {
    transform: translateY(0); } }

.petition .app__meta:first-child {
  border-top-left-radius: 13px;
  border-top-right-radius: 13px; }

.text-smallcaps {
  color: #d9e1e8;
  font-size: 14px;
  opacity: 0.7;
  display: block;
  text-transform: uppercase;
  text-decoration: none;
  font-weight: 600; }

.text-fat {
  color: #fff;
  opacity: 1;
  font-size: 19px;
  display: block;
  text-decoration: none;
  text-transform: none;
  font-weight: 800;
  margin: 0px;
  margin-bottom: 20px; }

h1 {
  font-size: 28px;
  font-weight: 800; }

progress[value] {
  -webkit-appearance: none;
  appearance: none;
  margin-bottom: 10px;
  width: 100%;
  height: 15px;
  border-radius: 13px; }

progress[value]::-webkit-progress-bar {
  background-color: rgba(35, 37, 50, 0.7);
  border-radius: 4px; }

progress[value]::-webkit-progress-value {
  background-color: #eb3b5a;
  z-index: 1;
  animation: move 2s linear infinite;
  border-radius: 4px; }

@keyframes move {
  0% {
    background-position: 0 0; }

  100% {
    background-position: 50px 0px; } }

.form-set {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-bottom: 20px; }
  .form-set:last-child {
    margin-bottom: 0px; }

.form-set--joined .form-item__input:first-child {
  border-top-right-radius: 4px;
  border-top-left-radius: 4px; }
  .form-set--joined .form-item__input:last-child {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px; }
  .form-set--joined .form-item__input:not(:last-child) {
    margin-bottom: 1px; }

.form-set--inline .form-item:first-child {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0; }
  .form-set--inline .form-item:last-child {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0; }

.form-item-100 {
  width: 100%; }

.form-item-80 {
  width: 80%; }

.form-item-20 {
  width: 20%; }

.form-item-70 {
  width: 70%; }

.form-item-30 {
  width: 30%; }

.form-item__label {
  margin-bottom: 5px; }

.form-item__input {
  background-color: rgba(35, 37, 50, 0.7);
  border: 0;
  font-size: inherit;
  padding-top: 14px;
  padding-bottom: 14px;
  padding-left: 17px;
  padding-right: 15px;
  color: #fff; }

.form-item__input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5); }

.form-item__button {
  border-radius: 4px;
  padding-top: 14px;
  padding-bottom: 14px;
  background-color: #1f232b;
  border: 0;
  font-size: inherit;
  font-weight: 600;
  /*text-transform: capitalize;*/
  color: #fff;
  cursor: pointer; }

.form-item__button--inline {
  border-radius: 90px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0px;
  background-color: #1f232b;
  border: 0;
  font-size: inherit;
  font-weight: 600;
  /*text-transform: capitalize;*/
  color: #fff;
  cursor: pointer; }

.form-item__button:hover {
  background-color: #191d23; }

.form-item__button--highlight {
  background-color: #eb3b5a;
  color: #fff; }

.form-item__check {
  position: absolute;
  opacity: 0;
  -webkit-appearance: none;
  visibility: hidden; }

.form-item__check + label {
  position: relative;
  cursor: pointer;
  display: flex;
  flex-direction: row;
  padding: 0; }
  .form-item__check + label a {
    color: inherit; }
  .form-item__check + label small {
    display: inline-block;
    margin-top: 5px;
    line-height: 1.3em;
    font-size: 10px; }

.form-item__check + label:before {
  content: '';
  margin-right: 10px;
  display: inline-block;
  vertical-align: text-top;
  width: 20px;
  height: 20px;
  background-color: #1f232b;
  border: 4px solid #1f232b;
  border-radius: 4px;
  flex-shrink: 0; }

.form-item__check:hover + label:before {
  background: #000; }

.form-item__check:checked + label:before {
  background: #eb3b5a; }

form.disabled {
  opacity: 0.13;
  pointer-events: none;
  filter: grayscale(1) blur(2.5px); }

#js-submit-form {
  line-height: 1.4em;
  overflow: hidden; }
  #js-submit-form form {
    width: 100%;
    transform: translateX(0);
    transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  #js-submit-form .message {
    display: none;
    padding: 30px 0px;
    background-color: rgba(35, 37, 50, 0.7);
    border-radius: 5.2px;
    margin-bottom: 20px;
    color: rgba(255, 255, 255, 0.7); }
  #js-submit-form .message .inner {
    max-width: 75%;
    text-align: center;
    margin: 0px auto; }
    #js-submit-form .message .inner.max {
      max-width: 90%; }
  #js-submit-form .message strong {
    display: block;
    margin-bottom: 6px;
    color: rgba(255, 255, 255, 1); }

.activity__stream {
  font-size: 14px;
  display: block !important; }
  .activity__stream ul, .activity__stream li {
    margin: 0px;
    padding: 0px;
    list-style-type: none; }
  .activity__stream time {
    margin-left: auto; }
  .activity__stream li {
    position: relative;
    background-color: rgba(35, 37, 50, 0.7);
    margin-bottom: 1px;
    padding: 12px 14px;
    color: rgba(255, 255, 255, 0.7); }
  .activity__stream li:last-child {
    -webkit-border-bottom-right-radius: 5.2px;
    -webkit-border-bottom-left-radius: 5.2px;
    -moz-border-radius-bottomright: 5.2px;
    -moz-border-radius-bottomleft: 5.2px;
    border-bottom-right-radius: 5.2px;
    border-bottom-left-radius: 5.2px; }
  .activity__stream li:first-child {
    -webkit-border-top-right-radius: 5.2px;
    -webkit-border-top-left-radius: 5.2px;
    -moz-border-radius-bottomright: 5.2px;
    -moz-border-radius-bottomleft: 5.2px;
    border-top-right-radius: 5.2px;
    border-top-left-radius: 5.2px; }
  .activity__stream li div.inner {
    box-sizing: inherit;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: flex;
    flex-direction: row; }
  .activity__stream li strong {
    color: rgba(255, 255, 255, 0.85); }
  .activity__stream li:after {
    clear: both; }
  .activity__stream li:last-of-type {
    margin-bottom: 0px; }

#js-submit-form.submitted form {
  transform: translateX(-200%); }

.petition__header {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap; }

.petition__icon {
  margin-right: 20px;
  flex-shrink: 0; }

.petition__headline {
  flex: 1; }

.clickparticle {
  z-index: 3000;
  position: absolute;
  color: #fff;
  font-weight: 800;
  font-size: 11px;
  display: block;
  position: absolute;
  animation-name: fadeUp;
  pointer-events: none;
  user-select: none; }

@keyframes fadeUp {
  0% {
    transform: translate(-50%, -50%);
    opacity: 1; }

  100% {
    transform: translate(-50%, -300%);
    opacity: 0; } }

.petition-teaser {
  display: flex;
  flex-direction: column;
  padding-top: 20px;
  padding-bottom: 20px; }

.petition-teaser__caption {
  margin-bottom: 5px; }

.petition-teaser__headline {
  font-size: 24px;
  font-weight: 800;
  color: #fff;
  margin-bottom: 20px;
  text-decoration: none; }
  .petition-teaser__headline a {
    font-size: inherit;
    margin: 0;
    text-decoration: none;
    color: inherit; }

.petition-teaser__progress {
  background-color: #52596a;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 17px;
  padding-bottom: 17px;
  margin-bottom: 20px;
  border-radius: 4px;
  font-size: 14px;
  color: #fff; }

.petition-teaser__progress .petition-status__label {
  margin-bottom: 0; }

.petition-teaser__progress progress {
  margin-bottom: 10px;
  height: 10px; }

.petition-teaser__button-caption {
  font-size: 14px;
  color: rgba(102, 102, 102, 0);
  max-width: 75%; }

.petition-teaser__button {
  margin-left: 20px;
  margin-bottom: 10px; }

.petition-teaser__caption, .petition-teaser__headline, .petition-teaser__button-caption {
  padding-left: 20px;
  padding-right: 20px; }

.is-app .tab-bar, .is-app .header, .is-app .banner, .is-app .search-header, .is-app .search__header, .is-app .footernav, .is-app .app__header_v3 .meta, .is-app .beta-banner {
  display: none; }
  .is-app.on-sale .listing__headline, .is-app.on-sale .card-slider {
    display: none; }
  body.is-app.template-single .app__header_v3 .header-inner .inner {
    margin-top: 70px !important;
    margin-bottom: 50px !important; }

.is-app .list__item__meta, .is-app .price-development, .is-app .list__item__info .on-sale {
  display: none; }
  .is-app.template-discover-v2 .search-header + .link-banner {
    display: none; }

.beta-banner {
  background-image: url('http://51e3d489f1e.s3.amazonaws.com/b7lOfD6M.png');
  background-size: cover;
  background-repeat: no-repeat;
  border: 0px;
  border-radius: 6.5px; }
  .beta-banner .inner {
    padding: 30px; }
  .beta-banner .inner h2, .beta-banner .inner p {
    max-width: 290px; }
  .beta-banner .inner h2 {
    margin-bottom: 8px;
    font-size: 21px;
    font-weight: 700; }
  .beta-banner .inner p {
    line-height: 1.45em;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px; }
  .beta-banner .inner a {
    background-color: #fff;
    color: #9571bb; }

.controller-mapping-block {
  border: 0px; }
  .controller-mapping-block .page__item__inner {
    padding: 20px; }

.controller-mapping {
  background-color: transparent;
  border-top: 1px solid #232532;
  color: #fff;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; }
  .controller-mapping {
    display: block;
    column-count: 2; }

.mapping__item {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 13.3333333333px;
  break-inside: avoid-column; }

.mapping__item__icon {
  margin-right: 13.3333333333px; }
  .mapping__item__icon svg {
    width: 27px; }

.mapping__item__label {
  position: relative;
  top: -1px;
  height: auto;
  margin-top: auto;
  font-size: 15px;
  margin-bottom: auto;
  word-break: break-word;
  color: #8b8fa7; }

.game-tags {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #181c23; }

.carousel {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  overflow-X: scroll;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: mandatory;
  position: relative; }
  .carousel::-webkit-scrollbar {
    display: none; }

.carousel__item {
  scroll-snap-align: center center;
  scroll-snap-padding: 20px;
  flex-shrink: 0; }

.c-carousel--fullwidth .carousel__item {
  width: calc(100vw - 20px); }
  @media (min-width: 470px) {
    .c-carousel--fullwidth .carousel__item {
      max-width: 430px; } }

.carousel__next {
  position: sticky;
  right: 0;
  top: 0;
  height: 100%;
  width: 80px;
  background-color: rgba(0, 0, 0, 0.5);
  color: #fff;
  background-image: url('/assets/img/svg/xyz/chevron-right.svg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 32px 32px;
  border: none;
  padding: 20px;
  transform: translateX(1px);
  display: none;
  cursor: pointer;
  pointer-events: none;
  opacity: 0;
  transition: opacity ease-in-out 1s; }

.carousel:hover .carousel__next {
  display: block;
  pointer-events: all;
  opacity: 1; }

.date-graph__wrap {
  padding-left: 45px;
  padding-bottom: 20px; }
  .date-graph__wrap .date-graph {
    width: 100%;
    min-height: 140px;
    position: relative; }
  .date-graph__wrap .date-graph .t {
    color: #8b8fa7;
    position: absolute;
    /*outline: 1px solid red;*/
    font-size: 10px; }
  .date-graph__wrap .date-graph .warning {
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: rgba(0, 0, 0, 0.7);
    color: #fff;
    padding: 7px 12px;
    font-size: 14px;
    border-radius: 100px;
    transform: translate(-50%, -50%);
    z-index: 1;
    white-space: nowrap; }
  .date-graph__wrap .date-graph .axis {
    animation: fade-in 1.2s ease; }
    .date-graph__wrap .date-graph .axis.x {
      position: absolute;
      left: 0px;
      bottom: -10px;
      height: 0px;
      text-transform: uppercase;
      right: 0px; }
    .date-graph__wrap .date-graph .axis.x .t {
      transform: translateX(-50%); }
    .date-graph__wrap .date-graph .axis.y .t {
      transform: translateX(-100%) translateY(50%); }
      .date-graph__wrap .date-graph .axis.y .t.current {
        color: #b9bbcc;
        font-weight: 700; }
      .date-graph__wrap .date-graph .axis.y .t:first-child {
        transform: translateX(-100%) translateY(0%); }

.date-graph .axis.x .t:first-child {
  transform: translateX(0%) translateY(0%); }

.date-graph .axis.x .t:last-child {
  transform: translateX(-100%) translateY(0%); }
/*.date-graph .axis.y .t:last-child {
 transform: translateX(0%) translateY(0%);
 }*/
@keyframes slide-up {
  0% {
    opacity: 0;
    transform: scale(1, 0.95); }

  100% {
    opacity: 1;
    transform: scale(1, 1); } }

@keyframes fade-in {
  0% {
    opacity: 0; }

  10% {
    opacity: 0; }

  100% {
    opacity: 1; } }

.date-graph .stage .element {
  position: absolute;
  bottom: 0px;
  background-color: #232532;
  border-top: 2px solid #b1b1b1;
  animation: slide-up 1.2s ease;
  transform-origin: 0% 100%;
  box-shadow: 4px 4px 0px #000 1f; }

.date-graph .stage .element:last-of-type:after {
  content: ' ';
  display: block;
  position: absolute;
  right: -5px;
  width: 10px;
  background-color: #181c23;
  height: 10px;
  top: -6px;
  border-radius: 90px;
  border: 2px solid #b1b1b1; }

.date-graph .stage .sale-marker {
  /*height: 100%;*/
  position: absolute; }

.date-graph .stage .sale-marker span {
  position: absolute;
  background-color: red;
  color: #fff;
  /*opacity: 0.8;*/
  font-weight: 800;
  padding: 2px 3.5px;
  border-radius: 2px;
  color: #fff;
  /*position: absolute;*/
  /*outline: 1px solid red;*/
  font-size: 10px;
  transform: translate(-50%, -27px);
  z-index: 3;
  box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.1); }

.date-graph .stage .sale-marker span:after {
  content: ' ';
  width: 0;
  height: 0;
  position: absolute;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid #f00;
  transform: translate(-50%, 0%);
  top: 100%;
  left: 50%; }

.date-graph.fake .stage .element {
  /*background-color: rgba(0,0,0, 0.05);*/
  background-color: rgba(255, 255, 255, 0.05); }

.date-graph .grid .line {
  position: absolute;
  top: 0px;
  bottom: 0px;
  width: 1px;
  background-color: rgba(0, 0, 0, 0.2); }

.date-graph .axis.y {
  position: absolute;
  bottom: 0px;
  left: -10px;
  top: 0px;
  width: 0px; }

.date__graph {
  position: relative;
  background-color: #181c23; }

.date__graph:before {
  content: ' ';
  position: absolute;
  top: 0px;
  left: 0px;
  bottom: 0px;
  right: 0px;
  background: #2b5876;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, #4e4376, #2b5876);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, #4e4376, #2b5876);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  mix-blend-mode: difference;
  pointer-events: none;
  opacity: 0.09;
  z-index: 2; }

.card-slider {
  display: flex;
  flex-direction: column;
  border-bottom: 0px;
  padding-bottom: 20px; }

.card-slider__description {
  padding: 0 0 20px 20px;
  font-size: 16.2px;
  font-weight: 500;
  color: #8b8fa7; }

.card-slider__header {
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  padding: 20px 0 20px 20px;
  background-color: #1a1c25;
  padding: 20px;
  border-top-left-radius: 6.5px;
  border-top-right-radius: 6.5px; }

.card-slider__title {
  letter-spacing: -0.25px;
  font-size: 24.3px; }

.card-slider__link {
  margin-left: auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  text-decoration: none;
  color: inherit;
  color: #8b8fa7; }
  .card-slider__link .icon {
    margin-left: 10px;
    flex-shrink: 0; }
  .card-slider__link .icon svg {
    fill: #8b8fa7; }

.card-slider__items {
  display: flex;
  flex-direction: row;
  width: 100%;
  padding: 20px 20px 0 20px;
  border-top: 1px solid #232532; }

.card-slider__item {
  display: flex;
  flex-direction: column;
  width: 130px;
  flex-shrink: 0;
  text-decoration: none;
  color: inherit;
  position: relative; }
  .card-slider__item:not(:last-child) {
    margin-right: 15px; }
  .card-slider__item:last-child {
    margin-right: 0;
    border-right: 20px solid transparent;
    box-sizing: content-box; }

.card-slider__items--grid {
  flex-wrap: wrap;
  justify-content: space-around; }
  .card-slider__items--grid .card-slider__item {
    margin-bottom: 20px;
    border: 0; }
  .card-slider__items--grid .card-slider__item:nth-child(even) {
    margin-right: 0; }

.card-slider__item__image {
  margin-bottom: 10.4px;
  position: relative;
  overflow: hidden;
  border-radius: 6.5px; }
  .card-slider__item__image:before {
    content: '';
    padding-top: 133%;
    display: block; }
  .card-slider__item__image img {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    object-fit: cover;
    width: 100%;
    height: 100%; }
  .card-slider__item__image img.crop {
    opacity: 0.65;
    top: 40px;
    width: 210px;
    transform: rotate(-11.5deg);
    mix-blend-mode: luminosity; }

.card-slider__item.has-title img.crop {
  opacity: 0.15 !important; }

.card__slider__item__card_title {
  position: absolute;
  bottom: 10px;
  left: 10px;
  text-align: left;
  font-weight: 900;
  letter-spacing: -0.25px;
  font-size: 20px;
  max-width: 80%; }

.card__slider__item__emoji {
  font-size: 50px;
  margin-top: 20px;
  mix-blend-mode: hard-light;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center; }

.card__slider__item__char {
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 60px;
  font-weight: 800; }

.card-slider__item__title {
  font-weight: 700;
  padding-bottom: 3px; }

.card-slider__item__subtitle {
  font-size: 13.3px;
  font-weight: 500;
  color: #8b8fa7; }

.games-banner {
  border: 0px; }

.games-banner__headline {
  font-size: 14px;
  color: #8b8fa7;
  padding-bottom: 9.0909090909px;
  font-weight: 600; }

.games-banner__header {
  background-color: #1a1c25;
  padding: 20px;
  border-top-left-radius: 6.5px;
  border-top-right-radius: 6.5px; }

.games-banner__description {
  padding: 20px 0 0 0;
  font-size: 15.3px;
  font-weight: 500;
  max-width: 75%;
  line-height: 1.4em;
  color: #8b8fa7; }

.games-banner .games-banner__list .btn {
  margin: 10px 0px;
  background-color: #232532; }
  .games-banner .games-banner__list .btn:hover {
    background-color: #2e3041; }

.games-banner__subtitle {
  text-transform: uppercase;
  margin-bottom: 2.8571428571px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 800; }

.games-banner__title {
  display: block;
  font-size: 30px;
  width: 70%;
  font-weight: 800;
  color: #fff;
  text-decoration: none; }

a.games-banner__title:hover {
  text-decoration: underline; }

.games-banner__actions {
  padding: 20px;
  border-top: 1px solid #232532; }

.games-banner__list .list__item {
  border-radius: 0px;
  border-top: 1px solid #232532;
  padding-left: 20px;
  margin: 0px; }
  .compact .games-banner__title {
    font-size: 24.3px;
    font-weight: 700; }
  .compact .games-banner__description {
    padding-top: 4px; }
  .compact .list__item {
    padding: 12px 20px; }
  .compact .list__item .list__item__meta {
    display: none; }
  .compact .list__item .on-sale {
    margin: 0px; }
  .compact .list__item .trending-now {
    display: none; }
  .compact .list__item .list__item__title {
    margin: 0px;
    font-size: 15px; }
    .compact .list__item .list__item__title br {
      display: none; }
  .compact .list__item .list__item__info {
    width: 100%;
    flex-direction: row; }
    .compact .list__item .list__item__info .list__item__title {
      margin-left: 0px;
      margin-right: auto;
      font-size: 15px; }
    .compact .list__item .list__item__info .list__item__meta {
      margin-right: 0px;
      margin-left: auto;
      font-size: 15px; }
  .compact .list__item .appicon {
    width: 22px;
    height: 22px;
    border-radius: 4px; }

.link-banner {
  background-color: #1c1e28;
  border-radius: 6.5px;
  margin-bottom: 20px;
  color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  overflow: hidden;
  align-items: center;
  text-decoration: none; }
  .link-banner:hover {
    background-color: #191b24; }
  .link-banner:hover .link-banner__more {
    transform: translate(2px, 0px); }

.link-banner__text {
  width: 100%;
  display: flex;
  flex-direction: column; }

.link-banner__title {
  border-bottom: 1px solid #232532;
  font-weight: 700;
  display: flex;
  padding: 10px 20px;
  flex-direction: row;
  align-items: center;
  font-size: inherit; }

.link-banner__emoji {
  margin-right: 5px;
  font-size: 0.9em; }

.link-banner__description_text {
  margin-right: 20px; }

.link-banner__description {
  font-size: 15.4px;
  line-height: 1.45em;
  padding-top: 5px;
  font-weight: 500;
  flex-direction: row;
  display: flex;
  justify-content: space-between;
  color: #b9bbcc;
  padding: 10px 30px 12px 20px;
  font-size: 15.3px;
  font-weight: 500;
  line-height: 1.4em;
  color: #8b8fa7; }

.link-banner__more {
  display: flex;
  flex-direction: row;
  font-size: 15.4px;
  transition: all 0.06s linear;
  color: #8b8fa7; }
  .link-banner__more .icon {
    margin-left: 10px; }
  .link-banner__more .icon svg {
    opacity: 0.5;
    fill: #8b8fa7; }

.link-banner p {
  margin-bottom: 20px; }

.link-banner a {
  color: inherit; }

.link-banner ul, ol {
  list-style-position: inside; }

.search__header {
  display: flex;
  flex-direction: row; }

.search__header__form {
  position: relative;
  flex: 1; }
  .search__header__form .icon {
    display: none;
    fill: #fff;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%); }
  .search__header__form .icon svg {
    width: 24px;
    height: auto;
    fill: #b9bbcc; }

.search-filters {
  background-color: transparent !important;
  max-height: 0;
  overflow: hidden;
  transition: all 0.55s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  margin-bottom: 0; }
  .search-filters label {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    color: #b9bbcc; }
  .search-filters.open {
    max-height: 400px;
    margin-bottom: 10px; }
  .search-filters .group {
    margin-bottom: 10px; }
  .search-filters .tags a {
    border-radius: 4.3333333333px;
    background-color: #1c1e28;
    color: rgba(139, 143, 167, 0.7);
    padding: 5px 10px;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    margin-top: 6px; }
    .search-filters .tags a.active {
      background-color: rgba(139, 143, 167, 0.3);
      color: #fff; }

.search-header__input {
  background-color: #191b24;
  border: none;
  padding: 20px;
  padding-top: 13.3333333333px;
  padding-bottom: 13.3333333333px;
  font-size: inherit;
  padding-left: 76px;
  color: #fff;
  border-radius: 6.5px;
  width: 100%;
  background-image: url(/assets/img/lupe.png);
  background-size: auto 36%;
  background-position: left 15px center;
  background-repeat: no-repeat; }

.btn--filter {
  background-color: transparent;
  border: none;
  flex-shrink: 0; }
  .btn--filter svg {
    width: 24px;
    height: auto;
    fill: #b9bbcc; }

.modal-bg {
  opacity: 0;
  pointer-events: none;
  background-color: #232532;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 11;
  animation-name: fade-in;
  animation-duration: 0.4s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards; }
  .modal-bg.remove {
    animation-name: fade-out !important; }

@keyframes fade-in {
  from {
    opacity: 0; }

  to {
    opacity: 1; } }

@keyframes fade-out {
  from {
    opacity: 1; }

  to {
    opacity: 0; } }

.search-filters-wrap {
  background-color: transparent;
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 12;
  padding: 20px;
  transform: translateY(100%);
  transition: all 0.45s ease-in-out; }
  .search-filters-wrap.open {
    pointer-events: all;
    transform: translateY(0); }

.search-filters {
  background-color: #191b24; }

.search-filters__title {
  letter-spacing: -0.25px;
  font-size: 24.3px;
  margin-right: auto;
  margin-left: auto; }

.search-filters__header {
  border-bottom: 1px solid #232532;
  display: flex;
  flex-direction: row;
  align-items: flex-end; }

.search-filters__close {
  display: flex;
  flex-direction: row;
  margin-right: auto;
  position: absolute;
  left: 0; }
  .search-filters__close .icon svg {
    fill: #b9bbcc;
    width: 24px;
    height: auto; }
/* Reset Select */
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background-color: #2e3041;
  background-image: none; }
/* Custom Select */
.select {
  position: relative;
  display: block;
  width: 100%;
  height: 44px;
  line-height: 1;
  background: transparent;
  overflow: hidden;
  border-bottom: 1px solid #232532;
  border-top: 1px solid #232532; }

select {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0 0 0 0.5em;
  padding-left: 20px;
  color: #fff;
  cursor: pointer;
  font-size: inherit;
  background-color: transparent;
  transform: translateY(1px); }

select::-ms-expand {
  display: none; }
/* Arrow */
.select__icon {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 0 1em;
  background: transparent;
  pointer-events: none;
  display: flex; }
  .select__icon .icon {
    display: flex;
    align-items: center;
    justify-content: center; }
  .select__icon svg {
    width: 24px;
    height: auto;
    fill: #b9bbcc; }

.input-group {
  display: flex;
  flex-direction: row;
  align-items: center; }

.input-group__input {
  margin-right: 10px; }

.filter {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px; }

.filter__title {
  font-weight: 700;
  margin-bottom: 10px; }

.filter__item {
  margin-bottom: 10px; }

.search-tags {
  display: none;
  margin-bottom: 20px; }

.search-tags__item {
  height: 27px;
  background-color: #2e3041;
  margin-right: 10px;
  text-decoration: none;
  border-radius: 6.5px;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  display: flex;
  flex-direction: row;
  align-items: center; }
  .search-tags__item .icon {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex: 1;
    border-left: 1px solid #232532;
    height: 100%;
    padding-left: 5px;
    padding-right: 10px; }
  .search-tags__item .icon svg {
    width: 15px;
    height: auto;
    fill: #fff;
    transform: translateX(1px); }

.search-tags__item__title {
  padding: 10px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-right: 5px; }

.empty-search {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 10vh;
  margin-bottom: 10vh; }
  .empty-search .icon svg {
    fill: #191b24; }

.empty-search__title {
  font-weight: 700;
  font-size: 18px;
  color: #b9bbcc;
  margin-bottom: 5px; }

.empty-search__caption {
  font-size: 15.4px;
  color: #8b8fa7; }

.template-search-v2 .footernav {
  margin-top: 100vh; }

.app-feature {
  border-top-right-radius: 13px;
  border-top-left-radius: 13px;
  overflow: hidden; }

.app-feature__header {
  height: 300px;
  position: relative;
  display: flex;
  flex-direction: column; }

.app-feature__image {
  position: absolute;
  height: 100%;
  width: 100%;
  background-size: cover;
  background-position: top center;
  mix-blend-mode: overlay; }

.app-feature__title {
  font-size: 50px;
  text-transform: uppercase;
  max-width: 5em;
  font-weight: 900;
  line-height: 0.9em;
  margin-top: auto;
  padding: 20px;
  z-index: 20;
  font-family: 'Raleway', sans-serif; }

.app-feature__info {
  padding-left: 20px;
  padding-right: 20px;
  border-bottom-right-radius: 13px;
  border-bottom-left-radius: 13px; }

.shapes-container svg {
  fill: inherit !important; }

@keyframes load {
  0% {
    opacity: 1; }

  50% {
    opacity: 0.5; }

  100% {
    opacity: 1; } }

.js-loading-indicator.animation {
  transition: transform 0.1 ease-in-out;
  animation: load 1s infinite;
  animation-delay: 0 !important; }

.text p:not(:last-child), .text ul:not(:last-child), .text ol:not(:last-child) {
  margin-bottom: 20px; }
  .text h1, .text h2, .text h3, .text h4, .text h5, .text h6 {
    margin-bottom: 10px; }
  .text ul, .text ol {
    padding-left: 20px; }

body.standalone .standalone-header {
  background-color: #151721 !important; }

.page {
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 820px) {
  .page {
    max-width: 820px;
    display: flex;
    flex-direction: row; } }

.c-sidebar {
  display: none; }
  @media (min-width: 820px) {
  .c-sidebar {
    order: 1;
    display: block;
    margin-right: 20px; } }

.section-page {
  margin-left: 20px;
  margin-right: 20px; }
  .section-page.no-padding {
    margin-left: 0;
    margin-right: 0; }
  @media (min-width: 820px) {
  .section-page {
    order: 2;
    width: 100%;
    max-width: 580px;
    margin-left: auto;
    margin-right: auto; } }
/* heebo-900 - latin */
@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-display: swap;
  font-weight: 900;
  src: url('../fonts/heebo-v4-latin-900.eot');
  /* IE9 Compat Modes */
  src: local('Heebo Black'), local('Heebo-Black'), url('../fonts/heebo-v4-latin-900.eot?#iefix') format('embedded-opentype'), url('../fonts/heebo-v4-latin-900.woff2') format('woff2'), url('../fonts/heebo-v4-latin-900.woff') format('woff'), url('../fonts/heebo-v4-latin-900.ttf') format('truetype'), url('../fonts/heebo-v4-latin-900.svg#Heebo') format('svg');
  /* IE6-IE8 */
  /* Super Modern Browsers */
  /* Modern Browsers */
  /* Safari, Android, iOS */
  /* Legacy iOS */ }

.c-title, .c-modal__title {
  font-size: 30px;
  line-height: 1.1em; }

.c-btn--big, .c-rating, .c-game-list--feature__title {
  font-size: 23px;
  line-height: 1.4em; }

.c-btn--medium, .c-subline, .c-modal__subline, .c-text h2, .c-profile__name, .c-banner__title, .c-banner__badge, .c-modal__action, .c-list ul li, .thread__title {
  font-size: 18px;
  line-height: 1.2em; }

.c-btn--normal, .c-text, .c-nav__item, .c-banner, .search__label, .c-card__title, .thread__footer, .thread__header {
  font-size: 16px;
  line-height: 1.4em; }

.c-btn--tiny, .c-btn--small, .c-topline, .c-modal__topline, .c-smallcaps, .c-text h3, .c-game-list--feature__publisher, .c-mega-menu-title, .c-profile__title, .c-banner__text, .c-card__meta, .c-comment__date, .field__label, .toggle__label, .field__description, .op__meta {
  font-size: 13px;
  font-weight: 500; }

.c-btn {
  display: inline-flex;
  border-radius: 3.25px;
  text-decoration: none !important;
  border: 0;
  font-weight: bold;
  justify-content: center;
  -webkit-appearance: none;
  border: 2px solid transparent;
  cursor: pointer; }
  .c-btn .icon {
    display: inline-flex;
    height: 100%;
    width: auto; }
  .c-btn .icon:not(.is-btn) {
    margin-right: 5px; }
  .c-btn .icon svg {
    height: 100%;
    width: 100%; }
  .c-btn:hover {
    filter: brightness(1.08); }

.c-btn--fullwidth {
  width: 100%; }

.c-btn--tiny {
  padding: 3px 8px;
  font-size: 13px; }
  .c-btn--tiny .icon svg {
    height: 16px;
    width: auto; }

.c-btn--small {
  padding: 5px 10px;
  font-size: 13px; }
  .c-btn--small .icon svg {
    height: 16px;
    width: auto; }

.c-btn--normal {
  line-height: 1.3em;
  font-size: 14.5px;
  padding: 6.8965517241px 15.3846153846px; }
  .c-btn--normal .icon svg {
    height: 17px;
    width: auto; }

.c-btn--medium {
  padding: 10px 10px; }
  .c-btn--medium .icon svg {
    height: 32px;
    width: auto; }

.c-btn--big {
  padding: 20px 20px; }

.c-btn--red {
  background-color: #eb3b5a;
  color: #fff; }

.c-btn--transparent {
  background-color: transparent;
  color: #fff;
  border: 1px solid transparent; }
  .c-btn--transparent svg {
    stroke: #fff; }

.c-btn--transparent-white {
  background-color: #fff;
  color: #1c1e28;
  border: 1px solid #fff; }

.c-btn--unauffaellig {
  background-color: #232532;
  color: #8b8fa7;
  stroke: #8b8fa7; }

.c-btn-gray, .c-btn--gray, .c-btn-group__btn--active {
  color: #fff;
  background-color: #292c40;
  border: 2px solid #32354c; }

.c-btn-blue, .c-btn--blue {
  color: #fff;
  background-color: #41497a;
  border: 2px solid #515a93; }

.c-btn--darkgray {
  background-color: #1c1e28;
  color: #fff; }

.c-btn--black {
  background-color: #1a1c25;
  color: #fff;
  border: 1px solid #232532; }

.c-btn--inactive, .c-btn-group__btn--inactive {
  background-color: #1c1e28;
  color: #8b8fa7; }

.c-btn--text {
  background-color: transparent;
  color: #fff;
  border-color: transparent;
  padding-left: 0;
  padding-right: 0; }

.c-btn--loading {
  color: transparent;
  position: relative; }
  .c-btn--loading .c-btn__indicator {
    display: inline; }

.c-btn__indicator, .c-btn__indicator:before, .c-btn__indicator:after {
  border-radius: 50%;
  width: 2.5em;
  height: 2.5em;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation: load7 1.8s infinite ease-in-out;
  animation: load7 1.8s infinite ease-in-out; }

.c-btn__indicator {
  color: #fff;
  font-size: 2px;
  position: relative;
  text-indent: -9999em;
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -140%) translateZ(0);
  display: none; }

.c-btn__indicator:before, .c-btn__indicator:after {
  content: '';
  position: absolute;
  top: 0; }

.c-btn__indicator:before {
  left: -3.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s; }

.c-btn__indicator:after {
  left: 3.5em; }

@-webkit-keyframes load7 {
  0%, 80%, 100% {
    box-shadow: 0 2.5em 0 -1.3em; }

  40% {
    box-shadow: 0 2.5em 0 0; } }

@keyframes load7 {
  0%, 80%, 100% {
    box-shadow: 0 2.5em 0 -1.3em; }

  40% {
    box-shadow: 0 2.5em 0 0; } }

.c-btn--share {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  display: none; }

.c-btn--share.visible {
  display: block; }

.c-btn-bar {
  display: flex;
  flex-direction: row;
  justify-content: space-between; }

.c-btn-group {
  display: flex;
  flex-direction: row; }
  .c-btn-group .c-btn {
    border-radius: 0; }
  .c-btn-group .c-btn:not(:last-child) {
    margin-right: -2px; }
  .c-btn-group .c-btn:last-child {
    border-top-right-radius: 3.25px;
    border-bottom-right-radius: 3.25px; }
  .c-btn-group .c-btn:first-child {
    border-top-left-radius: 3.25px;
    border-bottom-left-radius: 3.25px; }
  .c-btn-group__btn--active {
    cursor: default; }
  .box {
    background-color: #1c1e28;
    margin-bottom: 20px;
    border-radius: 6.5px;
    overflow: hidden;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box; }
  .box:not(:first-child) {
    margin-top: 20px; }
  .box:blank {
    display: none; }
  @media (max-width: 620px) {
    .box.box--fullwidth {
      margin-left: -20px;
      margin-right: -20px;
      border-radius: 0; } }

.box--standalone + .box {
  display: none; }

.box--transparent {
  background-color: transparent;
  padding-top: 0;
  padding-bottom: 0; }

.c-box--noclip, .box--noclip {
  overflow: visible; }

.c-box--nopad-t {
  margin-top: 0; }

.c-box--nopad {
  margin-top: 0;
  margin-bottom: 0; }

.c-box--pull-d {
  margin-bottom: -20px; }

.page-builder-element {
  padding-right: 20px;
  padding-left: 20px;
  margin-bottom: 20px;
  margin-top: 20px; }
  .page-builder-element--nopadX {
    padding-left: 0;
    padding-right: 0; }
  .page-builder-element--nopad {
    padding: 0; }

.c-title, .c-modal__title {
  display: block;
  max-width: 80%;
  font-weight: 800 !important;
  color: #fff;
  text-decoration: none;
  font-size: 30px !important; }
  .c-title a, .c-modal__title a {
    text-decoration: none !important; }

.c-title + .c-subline, .c-modal__title + .c-subline, .c-modal__title + .c-modal__subline, .c-title + .c-modal__subline {
  margin-top: 10px; }

.c-topline + .c-title, .c-modal__topline + .c-title, .c-modal__topline + .c-modal__title, .c-topline + .c-modal__title {
  margin-top: 5px; }

.c-topline, .c-modal__topline {
  text-transform: uppercase;
  font-weight: 900;
  color: #fff; }

.c-subline, .c-modal__subline {
  font-weight: 500;
  line-height: 1.35em;
  font-size: 16px;
  max-width: 80%;
  color: #8b8fa7;
  margin-bottom: 20px; }
  .c-subline a, .c-modal__subline a {
    color: #fff; }

.c-smallcaps {
  text-transform: uppercase;
  color: #fff;
  font-weight: 700; }

.c-text--standalone {
  background-color: #232532;
  padding: 0;
  max-width: 400px; }
  @media (min-width: 820px) {
  .c-text--standalone {
    margin-bottom: -20px; } }

.c-text:first-child:last-child figure {
  margin-bottom: -20px; }

.c-text {
  color: #b9bbcc; }
  .c-text--transparent {
    background: transparent; }
  .c-text h2 + figure {
    margin-top: 20px; }
  .c-text figure {
    display: block;
    margin-left: -20px;
    margin-right: -20px; }
  .c-text figure img {
    max-width: 100%;
    width: 100%;
    height: auto;
    display: block; }
  .c-text figure.illustration {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0 !important; }
    .c-text figure.illustration img {
      max-width: 80%;
      height: auto; }
  .c-text p:not(:last-child), .c-text figure:not(:last-child), .c-text blockquote:not(:last-child) {
    margin-bottom: 20px; }
  .c-text > figure:first-child {
    margin-top: -20px; }
  .c-text blockquote {
    margin: 0;
    position: relative;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 38px;
    font-style: italic;
    padding-right: 40px; }
  .c-text blockquote em {
    color: #fff;
    padding: 0px 2px;
    font-style: normal;
    background-color: rgba(255, 255, 255, 0.1); }
  .c-text blockquote::before {
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 20px;
    content: ' ';
    width: 3px;
    border-radius: 90px;
    background-color: rgba(255, 255, 255, 0.8); }
  .c-text a {
    color: #fff;
    text-decoration: underline; }
  .c-text a:hover {
    text-decoration: none; }
  .c-text h2 {
    color: #fff;
    font-weight: 700;
    margin-bottom: 10px; }
  .c-text h3 {
    text-transform: uppercase;
    color: #fff;
    font-weight: 700; }
  .c-text ul, .c-text ol {
    margin-left: 30px;
    margin-bottom: 20px; }
  .c-text ul li, .c-text ol li {
    margin-bottom: 10px; }
    .c-text ul li:last-child, .c-text ol li:last-child {
      margin-bottom: 0px; }
  .c-text li strong {
    color: #fff; }

.c-line {
  display: block;
  height: 1px;
  border: 0;
  border-bottom: 1px solid #2d3040;
  padding: 0; }

.c-children {
  margin-left: -20px;
  margin-right: -20px; }
  .c-children .card-slider__items {
    border-top: none; }
  .c-children:first-child {
    margin-top: -20px; }
  .c-children:first-child:last-child {
    margin-top: -20px;
    margin-bottom: -20px; }

.c-carousel {
  overflow: hidden; }
  .c-carousel .c-game-list:first-child:last-child {
    margin-top: 0;
    margin-bottom: 0; }

.c-game-list {
  padding-left: 0;
  padding-right: 0; }
  .c-game-list:first-child:last-child {
    margin-top: -20px;
    margin-bottom: -20px; }
  .c-game-list:first-child:last-child .list__item:last-child {
    border-bottom: none; }
  .c-game-list:last-child {
    margin-bottom: 0; }
  .c-game-list:last-child .list__item {
    border-bottom: 0; }
  .c-game-list--feature {
    position: relative;
    padding: 20px;
    display: flex;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;
    color: #fff;
    text-decoration: none;
    height: 180px; }
  .c-game-list--feature.theme--dark .c-game-list--feature__title, .c-game-list--feature.theme--dark .c-game-list--feature__publisher {
    color: #000; }
    .c-game-list--feature.theme--dark .c-game-list--feature__button {
      border-color: #000;
      background-color: #000;
      color: #fff; }
  .c-game-list--feature__button {
    margin-right: auto;
    margin-top: 20px; }
  .c-game-list--feature__text {
    display: flex;
    flex-direction: column; }
  .c-game-list--feature__icon {
    width: 70px;
    height: 70px;
    border-radius: 15px; }
  .c-game-list--feature__title {
    font-size: 23px;
    font-weight: 900;
    color: #fff;
    text-decoration: none;
    line-height: 1.1em;
    margin-bottom: 4px; }
  .c-game-list--feature__mfi_support {
    background-color: rgba(0, 0, 0, 0.8);
    margin: 20px 0px;
    line-height: 1em; }
    .c-game-list--feature__mfi_support div {
      display: inline-block; }
    .c-game-list--feature__mfi_support svg {
      fill: #fff; }
  .c-game-list--feature__publisher {
    color: #fff;
    text-decoration: none;
    color: #fff;
    font-weight: 600;
    opacity: 0.75;
    font-size: 15px; }
  .c-game-list--feature__inner {
    position: relative;
    z-index: 11; }
  .c-game-list--feature:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 0;
    pointer-events: none;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    background-repeat: no-repeat;
    z-index: 10;
    background-size: cover;
    transform: scale(1.1); }
  .c-game-list--feature__image {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-size: cover;
    background-position: center center;
    opacity: 1; }
  .c-game-list .list__item {
    border-bottom: 1px solid #232532;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 0; }
  .c-game-list .list__item:first-child {
    border-top: 1px solid #232532; }

.c-text + .c-rating {
  margin-top: -20px;
  margin-bottom: 0; }

.c-page-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50; }

body.standalone .c-page-header {
  top: env(safe-area-inset-top); }

.c-top-bar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 20px;
  padding-right: 20px;
  background: #151721;
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 820px) {
  .c-top-bar {
    max-width: 100%; } }
  .c-top-bar .icon--controller_logo {
    height: 45px;
    position: relative;
    top: 3px; }
  .c-top-bar .icon--controller_logo svg {
    height: 100%;
    width: auto;
    fill: #fff; }
  .c-top-bar .c-btn {
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.16); }

.c-top-bar__inner {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 820px) {
  .c-top-bar__inner {
    max-width: 820px; } }

.c-top-bar__item {
  width: 33.33%;
  display: flex;
  flex-direction: row;
  align-items: center; }
  .c-top-bar__item--center {
    justify-content: center; }
  .c-top-bar__item--left {
    justify-content: flex-start; }
  .c-top-bar__item--right {
    justify-content: flex-end; }

.c-top-bar__home-link {
  display: block;
  text-decoration: none;
  color: inherit; }

.c-nav {
  display: flex;
  flex-direction: row;
  overflow: scroll;
  position: relative;
  justify-content: flex-start;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #1c1e28;
  margin-left: auto;
  margin-right: auto; }
  @media (min-width: 820px) {
  .c-nav {
    display: none; } }
  .c-nav::-webkit-scrollbar {
    display: none; }

.c-nav__item {
  white-space: nowrap;
  margin-right: 20px;
  line-height: 1;
  text-decoration: none;
  color: #8b8fa7;
  padding-top: 10px;
  padding-bottom: 10px; }
  .c-nav__item.active {
    color: #fff;
    border-bottom: 1px solid #eb3b5a; }
  .c-nav-mega-menu__toggle {
    display: block;
    border: none;
    background: transparent;
    border-radius: 3.25px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0; }
  .c-nav-mega-menu__toggle.active {
    background-color: #343643; }

.c-mega-menu {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  background-color: #1c1e28;
  max-height: 0;
  overflow: hidden;
  padding-top: 0;
  padding-bottom: 0;
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  @media (min-width: 820px) {
  .c-mega-menu {
    max-width: 820px;
    margin-left: auto;
    margin-right: auto; } }
  .c-mega-menu.open {
    max-height: 300px;
    padding-top: 20px;
    padding-bottom: 20px; }

.c-mega-menu-title {
  margin-bottom: 10px;
  text-transform: uppercase;
  font-weight: 700;
  color: #8b8fa7; }

.c-mega-menu__group {
  width: 33.3333%;
  overflow: hidden;
  padding-left: 10px;
  padding-right: 10px; }
  .c-mega-menu__group:first-child {
    padding-left: 20px; }
  .c-mega-menu__group:last-child {
    padding-right: 20px; }
  .c-mega-menu__group ul {
    list-style-type: none; }
  .c-mega-menu__group ul li {
    margin-bottom: 6.6666666667px; }
    .c-mega-menu__group ul li a {
      text-decoration: none;
      color: inherit;
      display: block; }

#burg {
  cursor: pointer;
  width: 26.6px;
  height: 38px;
  padding: 0;
  margin: 0;
  outline: 0;
  border: 0;
  border-radius: 3px;
  background: transparent;
  position: relative; }
  #burg i {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 8%;
    border-radius: 999em;
    box-shadow: inset 0 0 0 999px #fff;
    transform: translate(-50%, -50%);
    transition: box-shadow 0ms linear 200ms; }
  #burg i:before, #burg i:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    background: #fff; }
  #burg i:before {
    transform: rotate(0deg) translateY(-300%); }
  #burg i:after {
    transform: rotate(0deg) translateY(300%); }
  #burg.open i {
    box-shadow: inset 0 0 0 999px #fff; }
  #burg.open i:before {
    animation: topBarOpen 400ms forwards; }
  #burg.open i:after {
    animation: bottomBarOpen 400ms forwards; }
  #burg.close i {
    box-shadow: inset 0 0 0 999px transparent; }
  #burg.close i:before {
    animation: topBarClose 400ms forwards; }
  #burg.close i:after {
    animation: bottomBarClose 400ms forwards; }

@keyframes topBarOpen {
  0%, 25% {
    transform: rotate(45deg) translateY(0); }

  50% {
    transform: rotate(0deg) translateY(0); }

  75%, 100% {
    transform: rotate(0deg) translateY(-300%); } }

@keyframes topBarClose {
  25%, 50% {
    transform: rotate(0deg) translateY(0); }

  75%, 100% {
    transform: rotate(45deg) translateY(0); } }

@keyframes bottomBarOpen {
  0%, 25% {
    transform: rotate(-45deg) translateY(0); }

  50% {
    transform: rotate(0deg) translateY(0); }

  75%, 100% {
    transform: rotate(0deg) translateY(300%); } }

@keyframes bottomBarClose {
  25%, 50% {
    transform: rotate(0deg) translateY(0); }

  75%, 100% {
    transform: rotate(-45deg) translateY(0); } }

.js-profile-button-container {
  min-width: 28px;
  min-height: 28px;
  background-color: #1c1e28;
  border-radius: 50%; }

.profile-icon {
  display: block;
  text-decoration: none;
  color: inherit; }
  .profile-icon img {
    display: block;
    max-height: 28px;
    width: auto;
    border-radius: 50%; }

.c-tabs {
  width: 100%;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px; }
  .c-tabs nav {
    border-bottom: 1px solid #232532;
    margin-left: -20px;
    margin-right: -20px;
    padding-left: 20px;
    padding-right: 20px; }
  .c-tabs ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    margin-bottom: -1px; }
  .c-tabs ul li label {
    color: inherit;
    padding: 10px 0;
    font-size: 15px;
    display: block;
    color: #8b8fa7;
    font-weight: 500; }
    .c-tabs ul li label:hover {
      cursor: pointer; }
    .c-tabs ul li label:active {
      color: #fff; }
    .c-tabs ul li:not(:last-child) label {
      margin-right: 14px; }

nav .tab {
  color: #8b8fa7; }

.c-tabs > input, .c-tabs section > div {
  display: none; }

#tab1:checked ~ section .tab1, #tab2:checked ~ section .tab2, #tab3:checked ~ section .tab3 {
  display: block; }

#tab1:checked ~ nav .tab1 label, #tab2:checked ~ nav .tab2 label, #tab3:checked ~ nav .tab3 label {
  color: #fff;
  border-bottom: 2px solid #fff; }

.c-profile {
  padding-left: 0px;
  padding-right: 0px;
  margin-top: -20px; }

.c-profile__header {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #303543; }

.c-profile__avatar {
  width: 120px;
  height: 120px;
  position: relative;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  overflow: hidden; }
  .c-profile__avatar:before {
    content: '';
    display: block;
    width: 180px;
    height: 180px;
    position: absolute;
    box-shadow: inset 0 0 10px #303543;
    border-radius: 100px; }

.c-profile__avatar__background {
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 100px;
  overflow: hidden; }

.c-profile__avatar__image {
  position: absolute;
  display: block;
  width: 90px;
  height: 90px;
  border-radius: 100px; }

.c-profile__avatar__progress {
  position: absolute;
  display: block;
  width: 120px;
  height: 120px; }

.c-profile__name {
  color: #fff;
  font-weight: bold;
  margin-bottom: 5px; }

.c-profile__title {
  color: #8b8fa7; }

.c-image-header {
  margin-top: 0px;
  margin-bottom: 0px;
  height: 220px;
  display: flex;
  flex-direction: column;
  padding-bottom: 20px;
  justify-content: flex-end;
  position: relative; }
  .c-image-header .c-title, .c-image-header .c-modal__title, .c-image-header .c-topline, .c-image-header .c-modal__topline, .c-image-header .c-subline, .c-image-header .c-modal__subline {
    z-index: 2; }
  .c-image-header.color-dark .c-title, .c-image-header.color-dark .c-modal__title, .c-image-header.color-dark .c-topline, .c-image-header.color-dark .c-modal__topline, .c-image-header.color-dark .c-subline, .c-image-header.color-dark .c-modal__subline {
    color: #1c1e28; }

.c-image-header__image {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center center;
  pointer-events: none;
  background-repeat: no-repeat; }

.c-image-preview__image {
  display: block;
  width: 60px;
  height: 60px;
  background-size: cover;
  background-position: center center;
  pointer-events: none;
  background-repeat: no-repeat;
  border-radius: 130px;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
  display: none; }

.c-game-feature {
  margin-top: 0px;
  margin-bottom: 0px;
  padding: 0; }

.c-game-feature__header {
  height: 250px;
  width: 100%;
  display: flex;
  flex-direction: column;
  padding-top: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
  padding-right: 20px;
  position: relative; }

.c-game-feature__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: top center;
  mix-blend-mode: soft-light; }

.c-game-feature__title {
  margin-top: auto;
  font-size: 40px;
  max-width: 60%;
  font-weight: 900;
  font-family: 'Heebo';
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: 2px 1px 3px rgba(0, 0, 0, 0.24); }

.c-game-feature__game {
  padding-left: 20px;
  padding-right: 20px; }

.c-text + .c-children .carousel {
  margin-top: -25px; }

.c-banner {
  display: flex;
  text-decoration: none;
  flex-direction: column;
  padding: 15px 20px;
  position: relative;
  color: #fff;
  background-color: #292c40;
  border: 2px solid #32354c;
  border-radius: 6.5px; }
  .c-banner:hover {
    filter: brightness(1.08); }

.c-banner__title {
  font-weight: 700; }

.c-banner__badge {
  display: inline-block;
  background-color: #40445f;
  padding: 1px 4px;
  font-size: 78%;
  border-radius: 2px;
  color: #fff;
  margin-left: 3px;
  text-transform: uppercase; }

.c-banner__text {
  color: #8b8fa7;
  padding-right: 80px;
  line-height: 1.25em;
  padding-top: 5px; }

.c-banner__emoji {
  position: absolute;
  top: 50%;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 40px;
  transform: translateY(-50%) rotate(0deg);
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.18); }

.c-collectiongrid {
  padding: 0px; }
  .c-collectiongrid .collection-grid {
    display: block;
    margin-top: -15px; }
  .c-collectiongrid .collection-grid-row {
    margin-bottom: 20px; }
  .c-collectiongrid .collection-grid-row .collection-grid-item {
    position: relative;
    background-color: #1c1e28;
    display: block;
    height: 170px;
    float: left;
    background-size: cover;
    background-position: center center;
    border-radius: 6.5px;
    text-decoration: none; }
    .c-collectiongrid .collection-grid-row .collection-grid-item .title {
      position: absolute;
      bottom: 20px;
      left: 20px;
      right: 20px;
      text-shadow: 0px 2px 11px rgba(0, 0, 0, 0.321);
      font-size: 20px;
      font-weight: 700;
      color: #fff; }
    .c-collectiongrid .collection-grid-row .collection-grid-item.item-1 {
      width: calc(40% - 20px); }
    .c-collectiongrid .collection-grid-row .collection-grid-item.item-2 {
      width: 60%;
      margin-left: 20px; }
    .c-collectiongrid .collection-grid-row .collection-grid-item.item-3 {
      width: calc(60% - 20px); }
    .c-collectiongrid .collection-grid-row .collection-grid-item.item-4 {
      width: 40%;
      margin-left: 20px; }
    .c-collectiongrid .collection-grid-row .collection-grid-item.color-dark .title {
      color: #1c1e28; }
  .c-collectiongrid .collection-grid-row:last-child {
    margin-bottom: 0px; }

.c-pagination a {
  text-decoration: none;
  color: #8b8fa7;
  font-weight: 500;
  font-size: 16px;
  margin-right: 20px; }
  .c-pagination a:hover {
    color: #fff; }

.c-instagramstories .story-slider {
  margin: -20px -20px 0px -20px; }
  .c-instagramstories .story-slider-indicators {
    margin: 0 auto 0 auto;
    margin-top: 20px;
    display: table;
    width: 100%;
    max-width: 330px; }
  .c-instagramstories .story-slider-indicators .indicator {
    display: table-cell;
    padding: 0px 1.5px;
    cursor: pointer; }
    .c-instagramstories .story-slider-indicators .indicator div.bar {
      width: 100%;
      overflow: hidden;
      height: 10px;
      background-color: rgba(255, 255, 255, 0.13); }
    .c-instagramstories .story-slider-indicators .indicator div.fill {
      height: 10px;
      width: 0%;
      background-color: rgba(255, 255, 255, 0.7); }
    .c-instagramstories .story-slider-indicators .indicator:hover div.bar {
      background-color: rgba(255, 255, 255, 0.16); }
    .c-instagramstories .story-slider-indicators .indicator:hover div.fill {
      background-color: #7851d4; }
    .c-instagramstories .story-slider-indicators .indicator:first-child div.bar {
      border-top-left-radius: 20px;
      border-bottom-left-radius: 20px; }
    .c-instagramstories .story-slider-indicators .indicator:last-child div.bar {
      border-top-right-radius: 20px;
      border-bottom-right-radius: 20px; }
  .c-instagramstories .story-slider-item {
    padding: 50px 0px;
    background-size: cover;
    background-position: center center;
    pointer-events: none; }
  .c-instagramstories .story-slider-item video, .c-instagramstories .story-slider-item img {
    display: block;
    height: 550px;
    width: auto;
    margin: 0px auto;
    border-radius: 6.5px;
    box-shadow: 16px 16px 0px rgba(0, 0, 0, 0.12);
    position: relative; }
  @media (max-width: 430px) {
    .c-instagramstories .story-slider-item {
      padding: 40px 0px; }
      .c-instagramstories .story-slider-item video, .c-instagramstories .story-slider-item img {
        width: 80%;
        height: auto;
        box-shadow: 11px 11px 0px rgba(0, 0, 0, 0.12); } }
  .c-instagramstories .follow-banner {
    font-weight: 500;
    max-width: 430px;
    line-height: 1.4em;
    margin: 20px auto;
    text-align: center;
    color: #8b8fa7; }
  .c-instagramstories .follow-banner a {
    color: #fff; }

body.has-modal {
  -webkit-overflow-scrolling: touch;
  overflow: hidden; }
  body.has-modal .page, body.has-modal .header, body.has-modal .tab-bar, body.has-modal .fixed-tabbar, body.has-modal .c-page-header, body.has-modal .standalone-header {
    filter: blur(3px);
    transition: filter 0.5s ease-in-out; }

.c-modal__bg {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  bottom: 0;
  right: 0;
  background: rgba(35, 37, 50, 0);
  z-index: 9999;
  pointer-events: none;
  transition: background 0.5s linear; }
  .c-modal__bg.active {
    background: rgba(35, 37, 50, 0.8);
    pointer-events: all; }

.c-modal {
  position: absolute;
  left: 50%;
  transform: translateY(calc(100% + 20px)) translateX(-50%);
  bottom: 12px;
  max-width: 470px;
  border-radius: 13px;
  background-color: #1c1e28;
  color: #8b8fa7;
  stroke: #8b8fa7;
  padding: 20px;
  width: calc(100% - 24px);
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
  .c-modal.mode-fullscreen {
    padding: 0px;
    max-height: auto;
    max-width: 490px;
    border-radius: 6.5px; }
  .c-modal.mode-fullscreen.active {
    top: 30px;
    bottom: auto;
    transform: translateY(0%) translateX(-50%); }
  .c-modal.active {
    transform: translateY(0%) translateX(-50%);
    opacity: 1;
    pointer-events: all; }

.c-modal.mode-fullscreen .page__item {
  margin-left: 0px !important;
  margin-right: 0px !important;
  width: 100% !important; }

.c-modal__title {
  margin-bottom: 30px; }

.c-modal__body {
  margin-bottom: 10px; }

.c-modal__list {
  list-style-type: none;
  margin-bottom: 20px; }
  .c-modal__list li {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 5px;
    color: #fff;
    font-weight: 500; }
  .c-modal__list li .icon {
    margin-right: 6.6666666667px;
    transform: scale(0.8); }
    .c-modal__list li .icon svg {
      position: relative;
      top: 1px;
      stroke: #fff; }

.c-modal__actions {
  display: flex;
  flex-direction: column;
  margin-bottom: -20px;
  padding: 20px;
  padding-top: 0px; }

.c-modal__action {
  min-width: 100%;
  display: flex;
  padding-top: 16.6666666667px;
  padding-bottom: 16.6666666667px;
  padding-right: 20px;
  padding-left: 20px;
  border: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  margin-left: -20px;
  margin-right: -20px;
  line-height: 1;
  text-align: center;
  justify-content: center;
  text-decoration: none;
  font-weight: 800;
  font-size: 16px;
  cursor: pointer;
  margin-bottom: 10px;
  border-radius: 6.5px; }
  .c-modal__action:last-child {
    margin-bottom: 0px; }
  .c-modal__action--neutral {
    background-color: rgba(139, 143, 167, 0.18);
    color: rgba(255, 255, 255, 0.67);
    font-weight: 500; }
  .c-modal__action--highlight {
    background-color: #eb3b5a;
    color: #fff; }
  .c-modal__action:hover {
    filter: brightness(1.1); }

.search__wrap {
  display: flex;
  flex-direction: column; }

.search__input {
  border: 0px;
  font-weight: 400;
  min-width: 240px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  padding-right: 10px;
  background-color: #292c3f;
  color: #fff;
  border-radius: 5.2px !important;
  font-size: 14.4px;
  background-image: url(/assets/img/lupe.png);
  background-size: auto 40%;
  background-position: right 10px center;
  background-repeat: no-repeat;
  -webkit-appearance: none; }
  .search__input::-webkit-textfield-decoration-container {
    color: red; }
  .search__input::-webkit-calendar-picker-indicator {
    color: transparent;
    background-image: url('/assets/img/svg/xyz/chevron-down.svg');
    background-size: cover;
    height: 16px;
    width: 16px;
    display: none; }
  .search__input::-webkit-calendar-picker-indicator:hover {
    background-color: transparent; }
  .search__input::placeholder {
    color: #8b8fa7; }
  .search__input::-webkit-search-cancel-button {
    opacity: 1;
    /* Remove default */
    -webkit-appearance: none;
    /* Now your own custom styles */
    height: 24px;
    width: 24px;
    background-image: url('/assets/img/svg/xyz/x-circle--gray.svg');
    background-size: cover;
    margin: 0; }
  .search__input:not(:placeholder-shown) {
    background-image: none; }

.search__label {
  margin-bottom: 5px;
  display: none; }

.game-list {
  border-bottom: 1px solid #232532;
  margin-bottom: 20px;
  margin-left: -20px;
  margin-right: -20px; }
  .game-list .list__item {
    border-radius: 0px;
    border-top: 1px solid #232532;
    padding-left: 20px;
    margin: 0px; }

.mfi-game-search {
  position: relative; }

.mfi-game-search__form {
  display: block; }

.mfi-game-search__input {
  width: 100%; }
/*===== The CSS =====*/
.progress .track, .progress .fill {
  fill: rgba(0, 0, 0, 0);
  stroke-width: 3;
  transform: rotate(90deg) translate(0px, -80px); }

.progress .fill {
  stroke: #fff;
  stroke-dasharray: 219.9907836914;
  stroke-dashoffset: -219.9907836914;
  transition: stroke-dashoffset 1s;
  stroke-linecap: round; }

.progress.blue .fill {
  stroke: #008ce2; }

.progress.green .fill {
  stroke: #badfac; }

.progress .value, .progress .text {
  font-family: 'Open Sans';
  fill: #fff;
  text-anchor: middle; }

.progress .text {
  font-size: 12px; }

.noselect {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default; }

.c-children--standalone {
  background-color: #232532;
  margin-left: -20px;
  margin-right: -20px;
  margin-bottom: 0;
  padding-right: 0; }
  @media (min-width: 620px) {
  .c-children--standalone {
    margin-right: 0;
    margin-left: 0;
    padding-left: 0;
    border-radius: 6.5px; } }

.c-card {
  text-decoration: none;
  width: 230px;
  height: auto;
  display: block;
  border-radius: 6.5px;
  overflow: hidden;
  margin-right: 20px; }
  @media (min-width: 820px) {
  .c-card {
    width: 230px; } }

.c-card__image {
  width: 100%;
  height: 180px;
  display: block;
  background-position: bottom center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  padding-left: 3.3333333333px;
  padding-right: 3.3333333333px;
  padding-top: 3.3333333333px;
  padding-bottom: 3.3333333333px;
  padding-bottom: 0px; }

.c-card__body {
  padding-top: 14px;
  padding-bottom: 14px;
  padding-left: 20px;
  padding-right: 20px;
  background-color: #1c1e28;
  display: flex;
  flex-direction: column; }

.c-card__label {
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 900;
  background-color: #1c1e28;
  border-radius: 4px;
  margin-left: auto;
  margin-bottom: auto;
  padding: 4px 6px;
  font-size: 12px;
  color: #8a8ea6;
  border-top-right-radius: 5px; }
  .c-card__label .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 5px; }
  .c-card__label .icon svg {
    fill: #fff !important;
    width: 13px;
    height: 13px; }
    .c-card__label .icon svg path {
      fill: #8a8ea6; }

.c-card__title {
  font-weight: 800;
  color: #fff;
  margin-bottom: 4px;
  margin-top: auto;
  line-height: 1.25em; }

.c-card__meta {
  color: #8b8fa7;
  display: flex;
  flex-direction: row; }

.c-card__meta__item:not(:last-child):after {
  content: "·";
  display: inline;
  margin-left: 5px; }

.c-sidebar {
  width: 220px;
  position: sticky; }
  .c-sidebar .sidebar-element {
    line-height: 1.3em;
    font-size: 15px;
    font-weight: 700;
    font-weight: 500;
    line-height: 1.35em;
    font-size: 16px;
    display: block;
    margin-bottom: 20px;
    color: #8b8fa7; }
  .c-sidebar .sidebar-element a.active {
    filter: brightness(1.5); }

.c-sidebar-info .info-title {
  display: block;
  font-weight: 800;
  margin-bottom: 7px;
  color: #fff;
  font-size: 20px; }
  .c-sidebar-info .info-site-description {
    display: block;
    color: #8b8fa7; }

.sidebar-search input {
  background-color: #292c3c;
  min-width: 0px;
  border-radius: 6.5px; }

.sidebar-signup-banner {
  background-color: #292c3c;
  border-radius: 6.5px;
  padding: 13.3333333333px 16.6666666667px; }
  .sidebar-signup-banner .dim {
    opacity: 0.6;
    font-size: 90%; }
  .sidebar-signup-banner ul, .sidebar-signup-banner li {
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    font-weight: 600;
    font-size: 14px !important; }
  .sidebar-signup-banner li {
    background-image: url(/assets/img/signup-check.png);
    background-size: 14px;
    background-repeat: no-repeat;
    padding-left: 21px;
    background-position: left center;
    margin: 0px 0px 5px 0px;
    font-size: inherit; }
  .sidebar-signup-banner li:last-child {
    margin-bottom: 0px; }
  .sidebar-signup-banner .signup-btn, .sidebar-signup-banner a {
    display: inline-block;
    margin-top: 8px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    border-bottom: 1.5px solid rgba(139, 143, 167, 0.2);
    color: #8b8fa7;
    font-size: 14px !important; }
  .sidebar-signup-banner .signup-btn:hover, .sidebar-signup-banner a:hover {
    border-color: #8b8fa7;
    filter: brightness(1.5); }

.sidebar-lists ul, .sidebar-lists li {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
  color: #8b8fa7;
  line-height: 1.35em; }
  .sidebar-lists .list-title {
    text-transform: uppercase;
    color: #fff;
    font-size: 12.5px;
    font-weight: 900;
    margin-bottom: 5px; }
  .sidebar-lists .sidebar-list {
    margin-bottom: 20px; }
  .sidebar-lists .sidebar-list ul li {
    position: relative;
    margin: 0px 0px 3px 0px; }
    .sidebar-lists .sidebar-list ul li:last-child {
      margin-bottom: 0px; }
  .sidebar-lists .sidebar-list .dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 100px;
    top: 52%;
    transform: translateY(-23%);
    margin-right: 3px; }
  .sidebar-lists a {
    color: #8b8fa7;
    font-weight: 500;
    text-decoration: none;
    transition: filter 0.06s linear; }
  .sidebar-lists a:hover {
    filter: brightness(1.5); }

.c-app-icon--large {
  width: 110px;
  height: 110px;
  border-radius: 25px;
  display: block; }

.c-support-status p {
  color: #b9bbcc; }

.c-score {
  float: right;
  width: 200px;
  height: 200px; }

.c-score .progress {
  display: block;
  width: 100%;
  height: 100%; }

#action-bar .small-bottom {
  margin: 20px 20px 0px 20px;
  padding-top: 16px;
  border-top: 1px solid rgba(139, 143, 167, 0.15);
  font-size: 13px;
  text-align: center;
  color: #b9bbcc; }

#action-bar .small-bottom a {
  color: #b9bbcc; }

#action-bar .top-action-items {
  text-align: center; }

#action-bar .top-action-items svg path {
  stroke-width: 1.3px; }

#action-bar .top-action-items svg circle {
  stroke-width: 1.3px; }

#action-bar .action-icon {
  display: block;
  width: 30px;
  height: 30px;
  margin: 0px auto; }

#action-bar .top-action-items .action {
  display: inline-block;
  font-size: 14px;
  color: #b9bbcc;
  line-height: 1.4em;
  text-decoration: none;
  padding: 0px 10px;
  cursor: pointer; }

#action-bar .top-action-items .action:hover {
  color: #fff;
  text-decoration: none; }

@media (max-width: 500px) {
  #action-bar .small-bottom {
    max-width: 60%;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.4em; }

  #action-bar .top-action-items .action {
    font-size: 11px;
    padding: 0px 5px; } }

.c-comment-level {
  margin-bottom: 20px; }

.c-comment {
  margin-bottom: 20px;
  margin-top: 20px; }

.c-comment__header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px; }

.c-comment__user {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: bold; }

.c-comment__avatar {
  display: block;
  width: 16px;
  height: auto;
  margin-right: 10px;
  border-radius: 50%; }

.c-comment__date {
  margin-left: auto;
  color: #8b8fa7; }

.c-comment__body {
  margin-bottom: 10px;
  color: #b9bbcc;
  line-height: 1.4em;
  word-break: break-word; }

.c-comment__body a {
  color: #b9bbcc; }

.c-comment__badge {
  display: inline-block;
  font-size: 80%;
  background-color: #232532;
  color: #8689a0;
  text-transform: uppercase;
  margin-left: 10px;
  padding: 2px 5px;
  border-radius: 2px; }

.c-comment__footer > * {
  margin-right: 6.6666666667px; }

.c-comment-seperator {
  margin-left: -20px;
  margin-right: -20px;
  border: 1px solid #232532;
  margin-top: 20px; }

.c-comment__reply-form .form--component {
  display: none; }
  .c-comment__reply-form.active .form--component {
    padding: 10px 0;
    display: block !important; }

.tab-bar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  position: fixed;
  width: 100%;
  bottom: 0;
  left: 0;
  border-top: 1px solid #232532;
  padding-left: 20px;
  padding-right: 20px;
  -webkit-backdrop-filter: blur(30px);
  z-index: 220;
  padding-bottom: constant(safe-area-inset-bottom);
  padding-bottom: env(safe-area-inset-bottom); }
  .tab-bar.mobile {
    display: none; }
  .tab-bar.desktop {
    display: flex;
    position: static;
    margin: 20px;
    background-color: #191b24;
    border-radius: 6.5px;
    width: auto;
    overflow: hidden;
    justify-content: left;
    padding: 0px;
    box-shadow: 0 13px 34px 0 rgba(0, 0, 0, 0.05); }
  .tab-bar.desktop .tab-bar__item__icon svg {
    fill: #b9bbcc !important; }
  .tab-bar.desktop .tab-bar__item__caption {
    color: #b9bbcc !important; }
  .tab-bar.desktop .tab-bar__item {
    width: 33.333333333%;
    color: #8b8fa7;
    padding-left: 20px;
    padding-right: 20px;
    transition: background-color 0.1s linear; }
    .tab-bar.desktop .tab-bar__item:not(.tab-bar__item--active):hover {
      background-color: rgba(0, 0, 0, 0.12); }
  .tab-bar.desktop .tab-bar__item--active {
    opacity: 1;
    box-shadow: 0 0px 34px 0 rgba(0, 0, 0, 0.18);
    background-color: #1c1e28; }
    .tab-bar.desktop .tab-bar__item--active .tab-bar__item__icon svg {
      fill: #b9bbcc !important; }
    .tab-bar.desktop .tab-bar__item--active .tab-bar__item__caption {
      color: #b9bbcc !important; }

.fixed-tabbar {
  padding: 20px; }
  .fixed-tabbar .tab-bar {
    position: static;
    border-radius: 13px;
    background-color: transparent;
    padding-left: 40px;
    padding-right: 40px; }
  .fixed-tabbar .tab-bar .tab-bar__item {
    padding: 13px 500px; }
    .fixed-tabbar .tab-bar .tab-bar__item .tab-bar__item__caption {
      color: #9fa6b7 !important; }
    .fixed-tabbar .tab-bar .tab-bar__item .tab-bar__item__icon svg {
      fill: #9fa6b7 !important; }
    .fixed-tabbar .tab-bar .tab-bar__item.tab-bar__item--active {
      background-color: rgba(255, 255, 255, 0.05);
      font-weight: bold; }
    .fixed-tabbar .tab-bar .tab-bar__item.tab-bar__item--active .tab-bar__item__caption {
      color: #fff !important; }
    .fixed-tabbar .tab-bar .tab-bar__item.tab-bar__item--active .tab-bar__item__icon svg {
      fill: #fff !important; }

.tab-bar__item {
  opacity: 0.65;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  padding-top: 10px;
  padding-bottom: 11.7647058824px;
  padding-left: 20px;
  padding-right: 20px; }

.tab-bar__item:hover {
  background-color: rgba(255, 255, 255, 0.05); }

.tab-bar__item__icon .icon {
  display: flex;
  justify-content: center;
  align-items: center; }
  .tab-bar__item__icon svg {
    width: 26px;
    height: auto;
    height: 30px;
    fill: #fff !important;
    margin-left: auto;
    margin-right: auto; }

.tab-bar__item__caption {
  font-size: 11px;
  color: #fff;
  font-weight: 700;
  text-align: center; }

.tab-bar__item--active {
  opacity: 1; }
  .tab-bar__item--active .tab-bar__item__caption {
    color: #eb3b5a !important; }
  .tab-bar__item--active .tab-bar__item__icon svg {
    fill: #eb3b5a !important; }

@media (min-width: 600px) {
  .tab-bar {
    justify-content: center;
    border: 0px; }

  .tab-bar__item {
    padding: 12px 40px; } }

@media (min-width: 600px) {
  .tab-bar.desktop {
    display: flex; }
    .tab-bar.mobile {
      display: none; } }
/* slightly transparent fallback */
.backdrop-blur {
  background-color: rgba(0, 0, 0, 0.8); }

@media only screen and (max-width: 360px) {
  .tab-bar__item {
    padding-left: 0px;
    padding-right: 0px; }
    .tab-bar__item:hover {
      background: none !important; }

  .tab-bar__item--active {
    background: none !important; }

  a.btn {
    padding: 7px 11px !important; } }
/* if backdrop support: very transparent and blurred */
@supports ((-webkit-backdrop-filter: blur(30px)) or (backdrop-filter: blur(30px))) {
  .backdrop-blur {
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px); } }

.c-list {
  padding: 0px;
  margin-bottom: -18px; }
  .c-list ul li {
    border-top: 1px solid #232532;
    display: block;
    padding: 11px 20px; }
    .c-list ul li a {
      text-decoration: none; }
    .c-list {
      list-style-type: none; }

.c-list__item {
  display: flex;
  flex-direction: row;
  border-top: 1px solid #232532; }
  .c-list__item a {
    padding: 12px 20px;
    width: 100%;
    color: #fff;
    text-decoration: none;
    display: flex;
    font-weight: 500;
    flex-direction: row;
    justify-content: space-between;
    align-items: center; }
  .c-list__item a svg {
    width: 24px;
    height: auto;
    stroke: #8b8fa7; }
  .c-list__item.not-seen {
    padding-left: 20px; }

a.c-list__item--notification {
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start; }

.c-list__item__header {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 5px; }

.c-list__item__date {
  margin-left: auto;
  font-size: 13px;
  color: #8b8fa7;
  flex-shrink: 0;
  white-space: nowrap; }

.c-list__item__title {
  font-size: 13px;
  font-weight: 900;
  margin-right: 5px;
  text-transform: uppercase; }

.c-list__item__description {
  font-size: 13px;
  color: #b9bbcc; }

.c-btn--notifications {
  margin-right: 10px;
  position: relative; }

.c-btn--notifications[data-count]:before {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  content: attr(data-count);
  border-radius: 3px;
  min-width: 16px;
  padding-left: 2px;
  padding-right: 2px;
  height: 16px;
  background-color: #eb3b5a;
  color: #fff;
  font-size: 11px;
  font-weight: bold;
  top: 1px;
  right: 1px;
  transform: translate(50%, -50%); }

.not-seen .c-list__item__header:before {
  display: block;
  content: ' ';
  width: 8px;
  height: 8px;
  position: absolute;
  margin-left: -20px;
  background-color: #1e94e0;
  border-radius: 5px;
  transform: translateY(7px); }

div.label {
  padding: 10px 20px;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 0px;
  text-transform: uppercase;
  font-weight: 900;
  color: #fff; }
  div.label span {
    color: #8b8fa7; }

.rating {
  display: flex;
  flex-direction: row;
  margin-bottom: 20px; }

.rating__star {
  margin-right: 5px; }

.c-rating--user-rating .rating__star {
  margin-right: 0; }
  .c-rating--user-rating .message {
    margin-bottom: 10px;
    padding: 5.5px 8px;
    background-color: rgba(138, 142, 166, 0.38);
    color: #1b1d28;
    border-radius: 3.5px;
    font-size: 12.5px;
    font-weight: 600;
    display: inline-block; }
  .c-rating--user-rating .message {
    max-height: 40px;
    transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    overflow: hidden; }
  .c-rating--user-rating .message.hidden {
    max-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important; }
  .c-rating--user-rating .message.success {
    background-color: #20bf6b; }
  .c-rating--user-rating .message.warning {
    background-color: #eb3b5a; }
/*padding: 0px 20px;*/
.form--messages .message {
  /*margin-bottom: 20px;
   padding: 10px;
   background-color: rgba(255,255,255,0.1);*/
  /*margin-bottom: 10px;
   padding: 10px 13px;
   background-color: rgba(138, 142, 166, 0.38);
   color: #fff;
   border-radius: 6.5px;
   font-size: 15px;*/
  margin-bottom: 10px;
  padding: 5.5px 8px;
  background-color: rgba(138, 142, 166, 0.38);
  color: #1b1d28;
  border-radius: 3.5px;
  font-size: 12.5px;
  font-weight: 600;
  display: inline-block; }

.message {
  max-height: 40px;
  transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  overflow: hidden; }

.message.hidden {
  max-height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important; }

.message.success {
  background-color: #20bf6b; }

.message.warning {
  background-color: #eb3b5a; }

.form--component .form--title {
  font-size: 23px;
  font-weight: 700;
  margin-bottom: 20px; }

input::placeholder, textarea::placeholder {
  color: #888; }

.form--component input[type=text], .form--component select, .form--component textarea {
  background-color: #232532;
  border-radius: 3px;
  color: #fff;
  border: 0px;
  font-size: 15px;
  padding: 5px;
  display: block;
  width: 100%;
  padding: 9px 13px; }

textarea {
  min-height: 100px; }

.form--component input[type=submit] {
  width: auto;
  /*color: #fff;*/ }

.form--component .field {
  margin-bottom: 10px; }

.form--component .field.hidden {
  display: none; }

.form--component .field:last-child {
  margin-bottom: 0px; }

.field__label {
  margin-bottom: 5.7142857143px;
  display: block;
  color: #8b8fa7; }

.field {
  margin-bottom: 10px; }

.field__input {
  background-color: #232532;
  margin-bottom: 5px; }
  .field__input::placeholder {
    color: #8b8fa7; }

::placeholder {
  color: #8b8fa7; }

.field__description {
  color: #8b8fa7;
  display: block; }

.toggle {
  cursor: pointer;
  display: inline-block; }

.toggle-switch {
  display: inline-block;
  background: #43486b;
  border-radius: 16px;
  width: 54px;
  height: 28px;
  position: relative;
  vertical-align: middle;
  transition: background 0.25s; }
  .toggle-switch:before, .toggle-switch:after {
    content: ""; }
  .toggle-switch:before {
    display: block;
    background: #e5e9ff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 4px;
    left: 4px;
    transition: left 0.25s; }
  .toggle:hover .toggle-switch:before {
    background: #e5e9ff; }
  .toggle-checkbox:checked + .toggle-switch {
    background: #20bf6b; }
  .toggle-checkbox:checked + .toggle-switch:before {
    left: 30px; }

.toggle-checkbox {
  position: absolute;
  visibility: hidden; }

.toggle-label {
  margin-left: 5px;
  position: relative;
  top: 2px; }
/* These are technically the same, but use both */
.dont-break-out {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;
  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto; }

.forum--actions {
  font-weight: 600; }
  .forum--actions a {
    display: inline-block;
    padding: 10px 13px;
    background-color: #1c1e28;
    text-decoration: none;
    color: #8b8fa7;
    font-size: 15px; }
  .forum--actions a.active {
    background-color: #292c3b;
    color: #fff; }
  .forum--actions .action--sort {
    float: left; }
  .forum--actions .action--cta {
    float: right; }
  .forum--actions .action--cta a {
    background-color: #fd1a57;
    color: #fff; }

.forum--listing {
  padding-bottom: 0;
  padding-top: 0;
  overflow: hidden; }
  .forum--listing .forum--listing--header {
    border-bottom: 1px solid #2d3040; }
  .forum--listing .forum--listing--header a {
    /* dirty */
    margin-right: 5px;
    text-decoration: none;
    color: #8b8fa7;
    font-size: 15px;
    font-weight: 600; }
    .forum--listing .forum--listing--header a.active {
      color: #fff; }
  .forum--listing .thread {
    position: relative;
    background-color: #1c1e28;
    margin-bottom: 0;
    padding: 20px;
    padding-top: 17px;
    margin: 0px; }
  .forum--listing .thread:not(:last-child) {
    border-bottom: 1px solid #2d3040; }
  .forum--listing .thread:first-child {
    padding-top: 0px; }
  .forum--listing .thread.sticky {
    background-color: #282b39; }
  .forum--listing .thread h3 a {
    text-decoration: none;
    color: #fff; }
    .forum--listing .thread h3 a:hover {
      color: #8b8fa7; }
  .thread__date {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #8b8fa7;
    font-size: 14px; }

.thread__title {
  text-decoration: none;
  margin: 0 0 0 0;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  max-width: 75%; }
  .thread__title a {
    color: inherit;
    text-decoration: inherit; }

.thread__body a {
  color: inherit;
  text-decoration: inherit; }

.thread__counts {
  display: block;
  font-size: 15px;
  margin-top: 10px; }
  .thread__counts .item {
    display: inline-block;
    margin-right: 5px;
    color: #8b8fa7;
    text-decoration: none; }
  .thread__counts .item .icon {
    display: inline-block; }
    .thread__counts .item .icon svg {
      position: relative;
      top: 3px;
      height: 15px;
      width: 15px;
      stroke: #8b8fa7; }
  .thread__counts a.item {
    cursor: pointer; }
  .thread__counts a.item:hover {
    color: #fff; }
    .thread__counts a.item:hover svg {
      stroke: #fff; }

.thread__footer {
  padding-top: 7px; }

.thread__footer, .thread__header {
  display: flex;
  flex-direction: row;
  align-items: center;
  color: #8b8fa7;
  font-weight: 400;
  line-height: 1.35em;
  font-size: 15px; }

.thread__header__item:last-child {
  margin-left: auto; }

.thread__footer__item .external-link-badge {
  color: rgba(139, 143, 167, 1);
  font-weight: 500; }
  .thread__footer__item:not(:last-child) {
    margin-right: 5px; }

.user-list img {
  width: 18px;
  height: auto;
  border-radius: 100%;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.7); }
  .user-list img:not(:first-child) {
    margin-left: -11px; }

.op__body {
  line-height: 1.45em;
  color: #b9bbcc; }
  .op__body a {
    color: inherit; }

.op__meta {
  display: flex;
  flex-direction: row;
  align-items: center; }

.op__meta__item {
  margin-right: 5px; }

.user-avatar {
  border-radius: 50%;
  height: 24px;
  width: auto; }

.url-box {
  text-decoration: none; }
  .url-box .url-box__inner {
    color: #8b8fa7;
    margin: 0 20px;
    display: block;
    background-color: #232532;
    border-radius: 6.5px;
    padding: 16px 20px; }
  .url-box .url-box__inner .url-box__title {
    color: #fff;
    font-size: 19px;
    font-weight: 600; }
  .url-box .url-box__inner .url-box__meta {
    margin-top: 5px;
    display: block;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 94%;
    font-size: 16px; }
    .url-box .url-box__inner:hover {
      background-color: #292b3b; }
  .url-box.has-image .url-box__inner {
    overflow: hidden;
    position: relative;
    padding-left: 100px; }
    .url-box.has-image .url-box__inner .url-box__image {
      position: absolute;
      top: 0px;
      left: 0px;
      bottom: 0px;
      display: block;
      width: 80px;
      height: 100%;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center center; }

.hide {
  display: none; }

:root {
  --gradient-orange: linear-gradient(45deg, #4bc0c8, #c779d0, #feac5e);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  --gradient-red: linear-gradient(20deg, #fe8c00, #f83600);
  --gradient-blue: linear-gradient(90deg, #efd5ff 0%, #515ada 100%);
  --gradient-green: linear-gradient(32deg, #0cebeb, #20e3b2, #29ffc6);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ }

.tiny-card {
  margin-right: 20px; }

.tiny-card__body {
  border-radius: 13px;
  min-width: 120px;
  height: 70px;
  padding: 10px;
  display: flex; }

.tiny-card__title {
  font-size: 18px;
  font-weight: 900;
  margin-top: auto; }

.tiny-card__subtitle {
  font-size: 14px;
  margin-left: 5px;
  margin-top: 2.5px;
  color: #8b8fa7; }

body.standalone {
  padding-top: 75px !important; }
  body.standalone .c-nav {
    display: none; }
  body.standalone .tab-bar.mobile {
    display: flex !important; }

.ptr--ptr {
  transform: translateY(-20px);
  color: #fff; }

.ptr--icon {
  color: #fff !important; }

.ptr--text {
  color: #fff !important; }

.c-poll {
  width: 100%;
  border: 0;
  margin-top: -20px;
  margin-bottom: -20px; }
