
[_nghost-ng-c2616821636] {
    --stb-thumbnail-aspect-ratio: 2 / 3;
    --stb-rotate: 0deg;
    --stb-scale: 1.3;
    --stb-main-animation-transition-time: .4s;
    --stb-actions-animation-transition-time: .4s;
    --stb-actions-bg-size: 500px;
    --stb-thumbnail-actions-grid-row-gap: 4px;
    --stb-thumbnail-play-button-size: 36px;
    --stb-thumbnail-play-padding: 0 8px;
    --stb-thumbnail-play-min-height: 36px;
    --stb-thumbnail-picture-background-size: 24px 24px;
    --stb-thumbnail-title-margin-top: 4px;
    padding: 2px;
    display: grid;
    grid-template-rows: 1fr min-content;
    min-width: 100%;
    contain: content
}

@media screen and (min-width: 1280px) {
    [_nghost-ng-c2616821636] {
        --stb-actions-bg-size: 500px;
        --stb-thumbnail-actions-grid-row-gap: 8px;
        --stb-thumbnail-play-button-size: 56px;
        --stb-thumbnail-play-padding: 0 24px;
        --stb-thumbnail-play-min-height: 56px;
        --stb-thumbnail-picture-background-size: 32px 32px;
        --stb-thumbnail-title-margin-top: 8px
    }
}

.top-games-section[_ngcontent-jjy-c317] {
    padding: 0;
    margin-bottom: -26px
}

@media screen and (min-width: 1280px) {
    .top-games-section[_ngcontent-jjy-c317] {
        padding: 0px 0 15px;
    }
}



@media screen and (min-width: 1280px) {
    .top-games-section[_ngcontent-jjy-c317] .swiper-container[_ngcontent-jjy-c317]:before {
        width: 53px
    }
}

@media screen and (min-width: 1440px) {
    .top-games-section[_ngcontent-jjy-c317] .swiper-container[_ngcontent-jjy-c317]:before {
        width: 60px
    }
}

@media screen and (min-width: 2500px) {
    .top-games-section[_ngcontent-jjy-c317] .swiper-container[_ngcontent-jjy-c317]:before {
        width: 278px
    }
}

.top-games-section--slider[_ngcontent-jjy-c317] {
    position: relative
}

.top-games-section--slider._mobile[_ngcontent-jjy-c317] {
    overflow: hidden;
    width: calc(100% + 40px);
    transform: translate(-20px);
    display: flex;
    flex-direction: column;
    align-items: center;
}

.top-games-section--slider._mobile[_ngcontent-jjy-c317]:lang(ar) {
    transform: translate(20px)
}

.top-games-section--scroll[_ngcontent-jjy-c317] {
    display: grid;
    grid-template-columns: repeat(6, 164px) 16px;
    grid-column-gap: 16px;
    overflow-x: scroll;
    padding: 0 16px;
    margin-top: 10px;
}

.top-games-section--scroll[_ngcontent-jjy-c317]:after {
    content: ""
}

.top-games-section--arrow[_ngcontent-jjy-c317] {
    position: absolute;
    top: calc(50% - 15px);
    z-index: 10;
    display: none
}

.top-games-section--arrow[_ngcontent-jjy-c317]:lang(ar) {
    transform: scaleX(-1)
}

@media screen and (min-width: 1280px) {
    .top-games-section--arrow[_ngcontent-jjy-c317] {
        display: block
    }
}

.top-games-section--arrow._left[_ngcontent-jjy-c317] {
    left: -40px
}

.top-games-section--arrow._left[_ngcontent-jjy-c317]:lang(ar) {
    left: unset;
    right: -40px
}

.top-games-section--arrow._right[_ngcontent-jjy-c317] {
    right: -40px
}

.top-games-section--arrow._right[_ngcontent-jjy-c317]:lang(ar) {
    right: unset;
    left: -40px
}

.top-games-section--title[_ngcontent-jjy-c317] {
    margin: 0 0 12px;
    line-height: 100%
}

.top-games-section--elem[_ngcontent-jjy-c317] {
    display: grid
}

[_nghost-jjy-c317] .top-games-section--slider {
    position: relative
}

[_nghost-jjy-c317] .top-games-section--slider .swiper-container {
    margin: 0 -20px;
    padding: 0 20px
}

@media screen and (min-width: 1280px) {
    [_nghost-jjy-c317] .top-games-section--slider .swiper-container {
        padding: 0;
        margin: 0 auto
    }
}

[_nghost-jjy-c317] .swiper-slide {
    height: auto
}

[_nghost-jjy-c317] .arrow-button.swiper-button-disabled {
    display: none
}

[_nghost-jjy-c317] .swiper-slide-next+.swiper-slide+.swiper-slide+.swiper-slide+.swiper-slide+.swiper-slide .top-games-section--elem:after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(270deg, #1e1e1e 0%, rgba(30, 30, 30, .85) 30.34%, rgba(30, 30, 30, .6) 128.14%, rgba(30, 30, 30, 0) 156.07%);
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2
}

.game-title {
    font-weight: bold;
    text-align: center;
    color: rgb(255, 255, 255);
}

.title-text {
    color: rgb(255, 255, 255);
    text-transform: uppercase;
}

.grid-games--pic img {
    border-radius: 15px;
    /* ΠΠ°Π΄Π°Ρ Π·Π°ΠΎΠΊΡΡΠ³Π»Π΅Π½Π½Ρ */
    border: 2px solid rgb(255, 255, 255);
    /* ΠΠ°Π΄Π°Ρ ΡΠΎΠ½ΠΊΠΈΠΉ Π±ΠΎΡΠ΄Π΅Ρ */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    /* ΠΠΎΠ΄Π°Ρ ΡΡΠ½Ρ Π΄Π»Ρ Π±ΡΠ»ΡΡΠΎΠ³ΠΎ Π΅ΡΠ΅ΠΊΡΡ */
    transition: transform 0.3s ease;
    /* ΠΠΎΠ΄Π°Ρ ΠΏΠ»Π°Π²Π½Ρ Π°Π½ΡΠΌΠ°ΡΡΡ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½Π½Ρ */
}

.grid-games--pic img:hover {
    transform: scale(1.05);
    /* ΠΠ±ΡΠ»ΡΡΡΡ Π·ΠΎΠ±ΡΠ°ΠΆΠ΅Π½Π½Ρ ΠΏΡΠΈ Π½Π°Π²Π΅Π΄Π΅Π½Π½Ρ */
}
.promo-card[_ngcontent-ng-c48277510] {
    --stb-aspect-ratio: 1.57/1;
    position: relative;
    display: flex;
    flex-direction: column;
    cursor: pointer
}

@media (hover: hover) and (pointer: fine) {
    .promo-card[_ngcontent-ng-c48277510]:hover {
        --stb-image-transforom-scale: 1.025;
        --stb-vintage-card-bg: var(--stb-bg-tertiary);
        --stb-vintage-card-texture-opacity: 1;
        --stb-vintage-card-grad-hov-opacity: 1;
        --stb-vintage-card-grad-def-opacity: 0;
        --stb-vintage-card-stroke-bg: var(--stb-vintage-card-stroke-bg-hover, rgb(var(--stb-neutral-600)))
    }
}

.promo-card__label[_ngcontent-ng-c48277510] {
    position: absolute;
    top: 8px;
    inset-inline-end: -6px
}

.promo-card__picture[_ngcontent-ng-c48277510] {
    position: relative;
    border: var(--stb-promo-card-pic-border, 1px solid rgb(var(--stb-neutral-750)));
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    aspect-ratio: var(--stb-aspect-ratio)
}

.promo-card__picture[_ngcontent-ng-c48277510] img[_ngcontent-ng-c48277510] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top
}

.promo-card__picture--limited-height[_ngcontent-ng-c48277510] {
    max-height: var(--stb-promo-card-pic-max-height);
    width: 100%
}

.promo-card__img[_ngcontent-ng-c48277510] {
    aspect-ratio: var(--stb-aspect-ratio)
}

.promo-card__plate[_ngcontent-ng-c48277510] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex-grow: 1;
    gap: 4px;
    min-height: var(--stb-promo-card-plate-height-val, 108px);
    padding: var(--stb-promo-card-plate-pad, 16px)
}

.promo-card__cta[_ngcontent-ng-c48277510] {
    align-self: var(--stb-cta-align-self, flex-end)
}

.promo-card__title[_ngcontent-ng-c48277510] {
  font-size: 17px;
  font-weight: bold;
}
.vintage-card[_nghost-ng-c1421375342] {
    --stb-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) var(--stb-vintage-card-radius, 8px), rgba(var(--stb-black) / 0) 98%, rgb(var(--stb-black))) calc(-1 * var(--stb-vintage-card-radius, 8px)) calc(-1 * var(--stb-vintage-card-radius, 8px));
    --stb-stroke-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) var(--stb-vintage-card-radius, 8px), rgba(var(--stb-black) / 0) calc(98% - 1px), rgb(var(--stb-black)) calc(100% - 1px) 98%, rgba(var(--stb-black) / 0)) calc(-1 * var(--stb-vintage-card-radius, 8px)) calc(-1 * var(--stb-vintage-card-radius, 8px)), linear-gradient(90deg, rgb(var(--stb-black)) 2px, rgba(var(--stb-black) / 0) 0) -1px 50% / 100% calc(100% - calc(2 * var(--stb-vintage-card-radius, 8px)) + 1px) repeat-x, linear-gradient(rgb(var(--stb-black)) 2px, rgba(var(--stb-black) / 0) 0) 50% -1px / calc(100% - calc(2 * var(--stb-vintage-card-radius, 8px)) + 1px) 100% repeat-y;
    position: relative;
    z-index: 1;
    background: var(--stb-vintage-card-bg, var(--stb-bg-secondary));
    transition: color var(--stb-transition-time), background-color var(--stb-transition-time);
    -webkit-mask: var(--stb-mask);
    mask: var(--stb-mask)
}

@media (hover: hover) and (pointer: fine) {
    .vintage-card[_nghost-ng-c1421375342]:not(.vintage-card--no-hover):hover {
        --stb-vintage-card-texture-opacity: 1;
        --stb-vintage-card-grad-hov-opacity: 1;
        --stb-vintage-card-grad-def-opacity: 0;
        --stb-vintage-card-stroke-bg: var(--stb-vintage-card-stroke-bg-hover, rgb(var(--stb-neutral-600)));
        background: var(--stb-vintage-card-bg-hover, var(--stb-bg-tertiary))
    }
}

.vintage-card[_nghost-ng-c1421375342]:not(.vintage-card--no-active):active,
.vintage-card--active[_nghost-ng-c1421375342],
.vintage-card--active[_nghost-ng-c1421375342]:not(.vintage-card--no-active):hover,
.vintage-card--active[_nghost-ng-c1421375342]:not(.vintage-card--no-active):active {
    --stb-vintage-card-texture-opacity: 1;
    --stb-vintage-card-grad-def-opacity: 0;
    --stb-vintage-card-grad-hov-opacity: 0;
    --stb-vintage-card-grad-act-opacity: 1;
    --stb-vintage-card-stroke-bg: var(--stb-vintage-card-stroke-bg-active, rgb(var(--stb-brand-1200)));
    background: var(--stb-vintage-card-bg-active, rgb(var(--stb-brand-850)))
}

.vintage-card--clear-top-radius[_nghost-ng-c1421375342] {
    --stb-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) 100%, rgba(var(--stb-black) / 0) 98%, rgb(var(--stb-black))) calc(-1 * var(--stb-vintage-card-radius, 8px));
    --stb-stroke-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) 100%, rgba(var(--stb-black) / 0) calc(98% - 1px), rgb(var(--stb-black)) calc(100% - 1px) 98%, rgba(var(--stb-black) / 0)) calc(-1 * var(--stb-vintage-card-radius, 8px)), conic-gradient(from 90deg at 1px 1px, rgba(var(--stb-black) / 0) 25%, rgb(var(--stb-black)) 0) 0 0 / calc(100% - 1px) calc(100% - var(--stb-vintage-card-radius, 8px) + 1px) repeat-x, linear-gradient(rgb(var(--stb-black)) 0 0) bottom/calc(100% - calc(2 * var(--stb-vintage-card-radius, 8px)) + 1px) 1px no-repeat;
    height: 200px;
    width: 200px;
}

.vintage-card--clear-bottom-radius[_nghost-ng-c1421375342] {
    --stb-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) 0, rgba(var(--stb-black) / 0) 98%, rgb(var(--stb-black))) calc(-1 * var(--stb-vintage-card-radius, 8px));
    --stb-stroke-mask: radial-gradient(var(--stb-vintage-card-radius, 8px) at var(--stb-vintage-card-radius, 8px) 0, rgba(var(--stb-black) / 0) calc(98% - 1px), rgb(var(--stb-black)) calc(100% - 1px) 98%, rgba(var(--stb-black) / 0)) calc(-1 * var(--stb-vintage-card-radius, 8px)), conic-gradient(at left 1px bottom 1px, rgba(var(--stb-black) / 0) 25%, rgb(var(--stb-black)) 0) 0 100% / calc(100% - 1px) calc(100% - var(--stb-vintage-card-radius, 8px) + 1px) repeat-x, linear-gradient(rgb(var(--stb-black)) 0 0) top / calc(100% - calc(2 * var(--stb-vintage-card-radius, 8px)) + 1px) 1px no-repeat;
    -webkit-mask: var(--stb-mask);
    mask: var(--stb-mask)
}

.vintage-card--highlighted[_nghost-ng-c1421375342] {
    --stb-vintage-card-gradient-hover: radial-gradient(circle at 50% 35%, rgb(var(--stb-neutral-700) / .75) 10%, transparent 64%);
    --stb-vintage-card-gradient-def: radial-gradient(circle at 50% 35%, rgb(var(--stb-neutral-700) / .5) 10%, transparent 58%)
}

.vintage-card-texture[_ngcontent-ng-c1421375342] {
    position: absolute;
    z-index: -1;
    inset: 0;
    background-size: contain;
    background-image: url(/assets/images/decorative-elements/texture@2x.png);
    opacity: var(--stb-vintage-card-texture-opacity, 0);
    transition: opacity var(--stb-transition-time);
    pointer-events: none
}

.vintage-card-stroke[_ngcontent-ng-c1421375342] {
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none
}

.vintage-card-stroke[_ngcontent-ng-c1421375342]:before {
    position: absolute;
    inset: var(--stb-vintage-card-border-gap, 6px);
    background: var(--stb-vintage-card-stroke-bg, rgb(var(--stb-neutral-750)));
    -webkit-mask: var(--stb-stroke-mask);
    mask: var(--stb-stroke-mask);
    transition: background-color var(--stb-transition-time);
    content: ""
}

.vintage-card-gradient[_ngcontent-ng-c1421375342] {
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: var(--stb-vintage-card-grad-act-opacity, 0);
    transition: opacity var(--stb-transition-time);
    pointer-events: none;
    content: ""
}

.vintage-card-gradient--default[_ngcontent-ng-c1421375342] {
    background: var(--stb-vintage-card-gradient-def, radial-gradient(circle at 50% 20%, rgb(var(--stb-neutral-750)) 0%, transparent 100%));
    opacity: var(--stb-vintage-card-grad-def-opacity, 1)
}

.vintage-card-gradient--hover[_ngcontent-ng-c1421375342] {
    background: var(--stb-vintage-card-gradient-hover, radial-gradient(circle at 50% 20%, rgb(var(--stb-neutral-600)) 0%, transparent 100%));
    opacity: var(--stb-vintage-card-grad-hov-opacity, 0)
}

.vintage-card-gradient--active[_ngcontent-ng-c1421375342] {
    background: radial-gradient(circle at 50% 20%, rgb(var(--stb-yellow-650)) 0%, transparent 100%)
}
.promo-container {
    display: flex;
    gap: 10px;
}
@media only screen and (max-width: 768px) {

    .vintage-card--clear-top-radius[_nghost-ng-c1421375342] {
        width: 170px;
        height: 260px;
        padding: 10px;
    }
    .promo-card__picture[_ngcontent-ng-c48277510]{
            width: 170px;
        }
        .promo-card__title[_ngcontent-ng-c48277510] {
            font-size: 20px;
            
      
        }
                .top-games-section--slider._mobile[_ngcontent-jjy-c317] {
                    display: block;
                }
}
ul.checklist {
    list-style-type: none;

    padding-left: 0;

}

ul.checklist li {
    position: relative;
    padding-left: 25px;
    font-size: 16px;
}

ul.checklist li::before {
    content: '\2713';
  
    position: absolute;
    left: 0;
    top: 0;
    color: rgb(255, 89, 0);

    font-size: 20px;
}