/*! CSS Used from: index.css */
/* Last Update 280568 */
.topbar-logo-1-icon {
    width: 8.813rem;
    position: relative;
    height: 2.75rem;
    object-fit: cover;
}

.home-text {
    text-decoration: none;
    position: relative;
    color: inherit;
}

.vector-icon {
    width: 1.313rem;
    position: relative;
    height: 1.313rem;
}

.language-selector {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
}

.theme-text-style-1 {
    position: relative;
    text-align: center;
}

.about-webshop-link {
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    color: inherit;
}

.vector-icon2 {
    width: 1.25rem;
    position: relative;
    height: 1.313rem;
}

.vector-icon3 {
    width: 1.375rem;
    position: relative;
    height: 1.188rem;
}

.language-and-info {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
}

.navigation-links1 {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.vector-icon4 {
    width: 1.688rem;
    position: relative;
    height: 1.5rem;
}

.notification-icon {
    text-decoration: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.navigation-links {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.625rem;
}

.top-bar-content {
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1.812rem;
    max-width: 82.5rem;
}

.theme-text-style-4 {
    position: relative;
    font-weight: 600;
}

.wp-content1 {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.close-text {
    position: relative;
    font-size: 1rem;
    font-weight: 600;
    color: #359eff;
    text-align: left;
}

.product-info {
    cursor: pointer;
    border: 1px solid #359eff;
    padding: 0.625rem;
    background-color: transparent;
    width: 4.063rem;
    border-radius: 12px;
    box-sizing: border-box;
    height: 2.438rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.wp-content {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.theme-text-style-2 {
    position: relative;
    font-size: 1.25rem;
    font-weight: 600;
    color: #359eff;
}

.username-and-email {
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid #cecece;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1rem;
}

.points-details {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.points-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.vector-icon5 {
    width: 1.375rem;
    position: relative;
    height: 1.375rem;
    object-fit: contain;
}

.points-icon {
    width: 3rem;
    border-radius: 12px;
    background: linear-gradient(90deg, #51abff, #b250ff);
    height: 3rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.625rem;
    box-sizing: border-box;
}

.points-and-icon {
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid #cecece;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    gap: 0.625rem;
}

.username-section {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.625rem;
}

.top-up-action {
    text-decoration: none;
    align-self: stretch;
    border-radius: 12px;
    background: linear-gradient(90deg, #51abff, #b250ff);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    text-align: left;
    color: #fff;
}

.history-action {
    text-decoration: none;
    align-self: stretch;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #2e8eff;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    color: inherit;
}

.change-currency-text {
    flex: 1;
    position: relative;
    font-weight: 600;
}

.actions-section {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5rem;
    text-align: center;
    color: #2e8eff;
}

.profile-details {
    align-self: stretch;
    height: calc(100% - 51px);
    overflow-y: auto;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1.375rem;
    font-size: 1rem;
}

.profile-section {
    align-self: stretch;
    border-radius: 12px 12px 0px 0px;
    background-color: #fff;
    border: 1px solid #dedede;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1.5rem;
    gap: 1rem;
    font-size: 1.25rem;
    color: #303030;
    height: 100%;
}

.top-bar {
    align-self: stretch;
    background-color: #1f1959;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.625rem;
    gap: 0.625rem;
    z-index: 6;
    position: sticky;
    top: 0px;
}

.top-up-header-section-count {
    position: relative;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 1.5rem;
    color: white;
}

.top-up-header-icon {
    width: 2.5rem;
    border-radius: 30px;
    background: linear-gradient(90deg, #51abff, #b250ff);
    height: 2.5rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.125rem 0.562rem;
    box-sizing: border-box;
}

.theme-section-title-wp-text {
    position: relative;
    text-transform: uppercase;
    font-weight: 600;
    background: linear-gradient(90deg, #51abff, #b250ff);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 1.6rem;
}

.theme-section-title-wp {
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.username-and-email1 {
    align-self: stretch;
    flex: 1;
    border-radius: 7px;
    border: 1px solid #cecece;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1rem;
}

.points-icon1 {
    text-decoration: none;
    width: 3rem;
    border-radius: 12px;
    background: linear-gradient(90deg, #51abff, #b250ff);
    height: 3rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.625rem;
    box-sizing: border-box;
}

.points-and-icon1 {
    align-self: stretch;
    flex: 1;
    border-radius: 7px;
    border: 1px solid #cecece;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    gap: 0.625rem;
}

.x0w-1-icon {
    width: 2.938rem;
    position: relative;
    border-radius: 9px;
    height: 2.938rem;
    object-fit: cover;
}

.profile-details1 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1.375rem;
    font-size: 1rem;
    color: #303030;
}

.profile-section1 {
    align-self: stretch;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #cecece;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1.5rem;
    gap: 1rem;
}

.x0w-1-icon1 {
    width: 7.125rem;
    position: relative;
    border-radius: 25px;
    height: 7.125rem;
    object-fit: cover;
}

.close-text1 {
    position: relative;
    font-size: 1rem;
    font-weight: 600;
    
    color: #fff;
    text-align: left;
}

.product-info1 {
    cursor: pointer;
    border: 1px solid #fff;
    padding: 0.625rem;
    background-color: transparent;
    width: 4.063rem;
    border-radius: 12px;
    box-sizing: border-box;
    height: 2.438rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.product-subtitle {
    position: relative;
    font-size: 1.5rem;
    font-weight: 600;
}

.product-title-and-subtitle {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.lorem-ipsum-dolor-sit-amet-con {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    padding-left: 1.357rem;
}

.theme-text-style-3 {
    align-self: stretch;
    position: relative;
    font-size: 0.875rem;
    /* color: #303030; */
}

.product-description-text {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.375rem;
}

.product-description-container {
    align-self: stretch;
    /* height: calc(85% - 90px); */
    /* overflow-y: auto; */
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem;
    font-size: 1rem;
    /* height: 8rem; */
}

.product-details {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2rem;
    height: calc(100% - 85px);
}

.product-image {
    flex: 1;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 2rem;
    gap: 2rem;
    background-image: url("../public/product-image@3x.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top;
    color: white;
    height: 100%;
    flex-direction: column;
}

.product-item {
    margin: 0!important;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: center;
    z-index: 0;
    height: 100%;
}

.product-list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-end;
    position: relative;
    position: sticky;
    top: 0;
    height: 100%;
}

.top-up-header-wp {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
}

.radio {
    cursor: pointer;
    margin: 0;
    width: 1.25rem;
    position: relative;
    background-color: #d9d9d9;
    height: 1.25rem;
}

.wp-content7 {
    align-self: stretch;
    position: relative;
    font-weight: 600;
    color: #303030;
}

.wp-content6 {
    cursor: pointer;
    align-self: stretch;
    flex: 1;
    border-radius: 7px;
    background-color: #c9e5ff;
    border: 3px solid #359eff;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1rem;
    height: 100%;
    color: #303030;
}

.wp-content5 {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1rem;
    height: 100%;
}

.wp-content4 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem;
    align-items: stretch;
}

.wp-content20 {
    text-decoration: none;
    width: 1.563rem;
    border-radius: 54px;
    border: 1px solid #303030;
    box-sizing: border-box;
    height: 1.563rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: inherit;
}

.wp-content18 {
    cursor: pointer;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.375rem;
}

.wp-content23 {
    border: none;
    outline: none;
    font-family: Kanit;
    font-size: 1rem;
    background-color: #f9f9f9;
    flex: 1;
    height: 3rem;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.7rem;
    box-sizing: border-box;
    color: #303030;
}

.wp-content24 {
    text-decoration: none;
    align-self: stretch;
    background-color: #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1rem;
    color: white;
    border-radius: 12px;
    font-size: 1rem;
}

.wp-content22 {
    align-self: stretch;
    border-radius: 12px;
    border: 1px solid #a9a9a9;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    font-size: 1rem;
    color: #fff;
}

.wp-content3 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1.5rem;
    font-size: 1rem;
    color: #303030;
}

.top-up-options {
    align-self: stretch;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #cecece;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 2rem;
    gap: 1.5rem;
}

.option-set-wp-text {
    cursor: pointer;
    align-self: stretch;
    position: relative;
    font-weight: 600;
}

.filter-option {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 1rem;
}

.filter-options {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    font-size: 1rem;
}

.option-set-wp {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1rem;
}

.p {
    margin: 0;
}

.wp-content31 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0rem 0rem 0.437rem;
    gap: 0.625rem;
    z-index: 0;
    font-size: 1rem;
    color: #303030;
}

.wp-content36 {
    align-self: stretch;
    border-radius: 4px;
    background-color: #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.25rem;
    z-index: 1;
    color: white;
}

.vector-icon7 {
    width: 0.7rem;
    position: relative;
    /* height: 0.75rem; */
}

.wp-content38 {
    width: 1.475rem;
    margin: 0!important;
    position: absolute;
    top: -0.625rem;
    left: -0.625rem;
    border-radius: 24px;
    background-color: #359eff;
    height: 1.475rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.wp-content39 {
    margin: 0!important;
    position: absolute;
    top: 0.813rem;
    right: 0.75rem;
    border-radius: 4px;
    background-color: #a5a5a5;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0rem 0.5rem;
    z-index: 3;
    text-align: right;
    color: white;
}

.wp-content39.recommend1{
    background-color: red;
}
.wp-content39.recommend2{
    background-color: #ffa912;
}
.wp-content39.recommend3{
    background-color: #1c99ff;
}

.wp-content30 {
    cursor: pointer;
    flex: 1;
    border-radius: 7px;
    background-color: #c9e5ff;
    border: 3px solid #359eff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    padding: 1rem;
    position: relative;
    height: 100%;
}

.package-options {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 1rem;
    font-size: 0.875rem;
    color: #fff;
    align-items: stretch;
}

.vector-icon9 {
    width: 0.625rem;
    position: relative;
    height: 1rem;
    object-fit: contain;
}

.arrow-btn-page {
    text-decoration: none;
    align-self: stretch;
    border-radius: 7px;
    background-color: #f9f9f9;
    border: 1px solid #a9a9a9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.2rem;
    width: 3rem;
    height: 3rem;
}

.page-number {
    text-decoration: none;
    align-self: stretch;
    border-radius: 7px;
    background-color: #f9f9f9;
    border: 1px solid #a9a9a9;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.562rem 1rem;
    color: inherit;
    width: 3rem;
    height: 3rem;
}

.page-number.active {
    background-color: #c9e5ff;
}

.product-selection {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1.5rem;
    font-size: 1.25rem;
    color: #303030;
}

.payment-options {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
}

.payment-icon1 {
    width: 1.188rem;
    position: relative;
    border-radius: 18px;
    height: 1.188rem;
    overflow: hidden;
    flex-shrink: 0;
    object-fit: cover;
}

.payment-summary {
    border-radius: 6px;
    background-color: #fff;
    border: 1px solid #cecece;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.625rem;
    gap: 0.625rem;
    font-size: 1.0rem;
    color: #303030;
}

.payment-header {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.payment-method-option {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1rem;
    font-size: 1rem;
}

.btn-qrp-2-icon {
    width: 5rem;
    position: relative;
    border-radius: 6px;
    height: 5rem;
    object-fit: cover;
}

.theme-text-style-6 {
    position: relative;
    display: -webkit-inline-box;
    overflow: hidden;
    text-align: start;
}

.wrapper {
    border-radius: 3px;
    background-color: #ff3e3e;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0rem 0.375rem;
}

.discount-text {
    position: relative;
    text-decoration: line-through;
    color: #303030;
}

.frame-group {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.discount-text1 {
    align-self: stretch;
    position: relative;
    font-size: 1.25rem;
    font-weight: 600;
    color: #303030;
}

.frame-parent {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    font-size: 0.875rem;
    color: #fff;
}

.theme-text-style-6-parent {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    height: 100%;
}

.btn-qrp-2-parent {
    cursor: pointer;
    flex: 1;
    border-radius: 7px;
    background-color: #c9e5ff;
    border: 3px solid #359eff;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 1rem;
    gap: 1rem;
}

.payment-channels-options {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1rem;
    text-align: center;
    font-size: 1rem;
}

.wp-content58 {
    cursor: pointer;
    align-self: stretch;
    position: relative;
    font-size: 1.25rem;
    font-weight: 600;
}

.wp-content62 {
    position: relative;
    font-weight: 600;
    white-space: pre-wrap;
}

.wp-content60 {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.wp-content59 {
    /* align-self:stretch; */
    border-radius: 7px;
    background-color: #f9f9f9;
    border: 1px solid #a9a9a9;
    display: flex;
    flex-direction: row;
    padding: 1rem;
    /* align-items: center; */
}

.wp-content72 {
    position: relative;
    font-size: 1.25rem;
    font-weight: 600;
}

.wp-content74 {
    text-decoration: none;
    width: 19.938rem;
    border-radius: 6px;
    background-color: #fff;
    height: 3.438rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.625rem;
    box-sizing: border-box;
    color: inherit;
}

.wp-content73 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    color: #ffba35;
}

.wp-content69 {
    align-self: stretch;
    border-radius: 7px;
    background-color: #ffdc99;
    border: 3px solid #ffba35;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.875rem 1rem;
    gap: 0.625rem;
}

.wp-content57 {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 1rem;
    font-size: 1rem;
}

.receipt-header {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
    font-size: 2rem;
    color: #fff;
}

.email-label {
    cursor: pointer;
    position: relative;
    font-weight: 600;
}

.email-input {
    border: 1px solid #a9a9a9;
    outline: none;
    font-family: Kanit;
    font-size: 1rem;
    background-color: #f9f9f9;
    align-self: stretch;
    border-radius: 12px;
    box-sizing: border-box;
    height: 3rem;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 1.5rem;
    color: #303030000;
}

.email-input-section {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1rem;
    font-size: 1.25rem;
}

.newsletter-checkbox {
    cursor: pointer;
    margin: 0;
    width: 1.563rem;
    position: relative;
    border-radius: 31px;
    background-color: #fff;
    border: 1px solid #303030;
    box-sizing: border-box;
    height: 1.563rem;
    overflow: hidden;
    flex-shrink: 0;
}

.newsletter-text {
    cursor: pointer;
    position: relative;
    font-weight: 500;
}

.newsletter-option {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
}

.payment-terms-checkbox {
    cursor: pointer;
    flex: 1;
    position: relative;
    font-weight: 500;
}

.terms-checkbox {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.562rem;
}

.terms-and-conditions {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5rem;
}

.receipt-section {
    align-self: stretch;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #cecece;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 2rem;
    gap: 1.5rem;
    font-size: 0.875rem;
    color: #303030;
}

.summary-coupons {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
}

.vector-icon11 {
    width: 2.188rem;
    position: relative;
    height: 1.938rem;
}

.top-up-button1 {
    text-decoration: none;
    align-self: stretch;
    border-radius: 7px;
    background: linear-gradient(90deg, #e3e3e3, #909090);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    gap: 0.625rem;
    color: inherit;
}

.top-up-button2 {
    text-decoration: none;
    align-self: stretch;
    border-radius: 7px;
    background: linear-gradient(90deg, #51abff, #b250ff);
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    gap: 0.625rem;
    color: inherit;
}

.top-up-button {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
    font-size: 1.25rem;
    color: #fff;
}

.method-option {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
}

.summary-section {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    padding: 1.312rem 2rem;
    font-size: 1rem;
    color: #303030;
}

.top-up-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 2rem;
    font-size: 2rem;
}

.product-section {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 2rem;
    font-size: 1.25rem;
}

.order-summary-details-child {
    align-self: stretch;
    position: relative;
    border-top: 1px solid #cdcdcd;
    box-sizing: border-box;
    height: 0.063rem;
}

.theme-text-style-5-text {
    flex: 1;
    position: relative;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.theme-text-style-5 {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}

.product-details-content-container {
    flex: 1;
    position: relative;
}

.total-payment {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    font-size: 1.5rem;
}

.back-button-text {
    position: relative;
    font-weight: 500;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.back-button {
    text-decoration: none;
    flex: 1;
    border-radius: 7px;
    background-color: #fff;
    border: 1px solid #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    color: inherit;
}

.continue-button {
    text-decoration: none;
    flex: 1;
    border-radius: 7px;
    background-color: #359eff;
    border: 1px solid #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    color: #fff;
}

.navigation-buttons {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    color: #359eff;
}

.order-summary-details {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1.75rem;
    font-size: 1rem;
    color: #303030;
}

.sidebar {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 3.875rem 0rem;
    box-sizing: border-box;
    gap: 2rem;
    max-width: 82.5rem;
    z-index: 5;
    font-size: 2rem;
}

.image-1-icon {
    width: 7.375rem;
    position: relative;
    height: 6.625rem;
    object-fit: cover;
}

.payment-processing-message {
    position: relative;
    font-weight: 600;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.payment-processing-note {
    position: relative;
    font-size: 1rem;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.payment-processing-text {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.payment-processing-details {
    width: 100%;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #cecece;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 2rem;
    gap: 1.5rem;
    max-width: 42.5rem;
}

.payment-processing-section {
    width: 100%;
    height: 80vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.875rem 0rem;
    box-sizing: border-box;
    max-width: 82.5rem;
    z-index: 4;
    text-align: center;
    font-size: 1.25rem;
    color: #303030;
}

.order-complete-note {
    position: relative;
    font-size: 1rem;
    text-align: center;
    display: -webkit-inline-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.back-to-shop-button {
    text-decoration: none;
    flex: 1;
    border-radius: 7px;
    background-color: #359eff;
    border: 1px solid #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    cursor: pointer;
    color: inherit;
}

.order-history-button {
    text-decoration: none;
    flex: 1;
    border-radius: 7px;
    background-color: #359eff;
    border: 1px solid #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    color: inherit;
}

.order-complete-actions {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    text-align: left;
    font-size: 1rem;
    color: #fff;
}

.order-complete-details {
    width: 100%;
    border-radius: 12px;
    background-color: #fff;
    border: 1px solid #cecece;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    gap: 1.5rem;
    max-width: 42.5rem;
}

.order-complete-section {
    width: 100%;
    height: 80vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.875rem 0rem;
    box-sizing: border-box;
    max-width: 82.5rem;
    z-index: 3;
    text-align: right;
    font-size: 1.25rem;
    color: #303030;
}

.vector-icon13 {
    width: 1.25rem;
    position: relative;
    height: 1.25rem;
}

.back-to-shop-button1 {
    text-decoration: none;
    width: 18.688rem;
    border-radius: 7px;
    background-color: #359eff;
    border: 1px solid #359eff;
    box-sizing: border-box;
    height: 3.5rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.625rem;
    cursor: pointer;
    font-size: 1rem;
    color: inherit;
}

.order-history-header {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 1.5rem;
    font-size: 2rem;
    color: #fff;
}

.game-value-currency {
    position: relative;
    font-size: 0.75rem;
}

.game-value1 {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 0.375rem;
}

.history-status {
    border-radius: 14px;
    background-color: #afafaf;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    padding: 0.125rem 0.812rem;
}

.history-status.complete {
  background-color: #27DD89;
}
.history-status.incomplete {
  background-color: #FF8D8D;
}

.order-date {
    width: 7.938rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    text-align: left;
    font-size: 0.875rem;
    color: #747474;
}

.order-status-and-date {
    align-self: stretch;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: space-between;
    text-align: right;
    font-size: 0.75rem;
    color: #fff;
}

.order-history-details1 {
    text-decoration: none;
    align-self: stretch;
    border-radius: 7px;
    background-color: #f9f9f9;
    border: 1px solid #a9a9a9;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 1rem;
    gap: 1rem;
    color: inherit;
}

.order-history-details1:hover {
    background-color: #c9e5ff;
}

.pagination1 {
    align-self: stretch;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 0.625rem;
    flex-direction: row;
    flex-wrap: wrap;
}

.order-history-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.875rem 0rem;
    box-sizing: border-box;
    max-width: 82.5rem;
    z-index: 2;
    color: #303030;
}

.order-details-section {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.875rem 0rem;
    box-sizing: border-box;
    max-width: 82.5rem;
    z-index: 1;
    font-size: 2rem;
}

.help-text {
    position: relative;
    text-transform: uppercase;
    font-weight: 500;
}

.vector-icon20 {
    width: 1rem;
    position: relative;
    height: 1rem;
}

.about-webshop-link1 {
    text-decoration: none;
    border-radius: 6px;
    background-color: #359eff;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.5rem;
    gap: 0.437rem;
    color: inherit;
}

.faq-text {
    position: relative;
    text-transform: uppercase;
}

.faq-link {
    text-decoration: none;
    border-radius: 6px;
    background-color: #359eff;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.5rem;
    gap: 0.437rem;
    color: inherit;
}

.contact-us-link {
    text-decoration: none;
    border-radius: 6px;
    background-color: #ffaf36;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0.5rem;
    gap: 0.437rem;
    color: inherit;
}

.radio-option {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1rem;
}

.help-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5rem;
}

.fb-1-2-icon {
    width: 2.25rem;
    position: relative;
    height: 2.25rem;
    object-fit: cover;
}

.t-tiktok-2-icon {
    width: 2.188rem;
    position: relative;
    height: 2.188rem;
    object-fit: cover;
}

.social-media-icons {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.562rem;
}

.social-media-section {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.5rem;
}

.footer-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 82.5rem;
    gap: 1.5rem;
}

.footer {
    align-self: stretch;
    background-color: #1f1959;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    z-index: 0;
}

.main-container {
    width: 100%;
    position: relative;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    font-size: 1rem;
    color: #fff;
    font-family: Kanit;
}

.radio-main-theme {
    display: none;
}

.radio-main-theme + .wp-content6 {
    background-color: #f9f9f9;
    border: 0px solid #a9a9a9;
    box-shadow: 0 0 0px 1px #a9a9a9;
    height: 100%;
}

.radio-main-theme:checked + .wp-content6 {
    background-color: #c9e5ff;
    box-shadow: 0 0 0px 3px #359eff;
}

.radio-main-theme + .wp-content30 {
    background-color: #f9f9f9;
    border: 0px solid #a9a9a9;
    box-shadow: 0 0 0px 1px #a9a9a9;
}

.radio-main-theme:checked + .wp-content30 {
    background-color: #c9e5ff;
    box-shadow: 0 0 0px 3px #359eff;
}

.radio-main-theme + .wp-content30 .wp-content38 {
    background-color: #f9f9f9;
    border: 1px solid #a9a9a9;
}

.radio-main-theme:checked + .wp-content30 .wp-content38 {
    background-color: #359eff;
}

.offcanvas-theme-custom {
    background-color: #ffffff00;
    border: 0;
}

.game-detail-pc-size {
    top: 5.5rem;
}

.summary-sticky {
    position: sticky;
    bottom: 0;
    background-color: white;
    z-index: 9999;
    border-top: 1px solid #cecece;
}

.wp-content6:hover,.wp-content30:hover {
    background-color: #dceeff;
    text-decoration: none;
}

.modal-content.custom {
    background-color: #ffffff00;
    border: 0;
}

.modal {
    font-family: Kanit;
}

.top-up-button .top-up-header-section-count {
    font-size: 1.2rem;
}

.wp-content30,.wp-content6{
    text-decoration: none;
    border: 0px solid #a9a9a9;
    box-shadow: 0 0 0px 1px #a9a9a9;
    background-color: #f9f9f9;
}
.wp-content30.seleted,.wp-content6.selected{
    background-color: #c9e5ff;
    box-shadow: 0 0 0px 3px #359eff;
}
.wp-content30.disabled{
    background-color: #c9e5ff;
    filter: grayscale(1);
    opacity: 0.4;
}
.wp-content38{
    background-color: #ffffff;
    border: 1px solid #a9a9a9;
}
.wp-content30.seleted .wp-content38{
    /* background-color: #c9e5ff; */
    background-color: #359eff;
    box-shadow: 0 0 0px 0px #359eff;
}

.game-description-pc{
    width:100%
}

.wp-content30.maintenance ,.wp-content6.maintenance{
    background-color: #c9e5ff;
    filter: grayscale(1);
    opacity:0.4
}


/********************/


.sub-cat-item .wp-content6 {
    /* cursor: pointer; */
    /* align-self: stretch; */
    /* flex: 1; */
    border-radius: 20px;
    /* background-color: #c9e5ff; */
    /* border: 1px solid #359eff; */
    /* display: flex; */
    /* flex-direction: column; */
    /* align-items: flex-start; */
    /* justify-content: flex-start; */
    padding: 0.2rem 0.6rem;
    /* height: 100%; */
    /* color: #303030; */
    font-size: 0.8rem;
}

.sub-cat-title{
	display: flex;
    align-items: stretch;
    gap: 8px;
    align-self: stretch;
    color: #A9A9A9;
    font-family: Kanit;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    flex-direction: column
}
.sub-cat-line{
	height: 1px;background: #A9A9A9;
}


/********************/






.wd-custom-account-details .title {
	 position: relative;
	 text-transform: uppercase;
	 font-weight: 600;
	 background: linear-gradient(90deg, #51abff, #b250ff);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .wd-custom-account-details .account-details-header-child {
	 align-self: stretch;
	 position: relative;
	 border-top: 1px solid #cecece;
	 box-sizing: border-box;
	 height: 0.063rem;
}
 .wd-custom-account-details .label {
	 cursor: pointer;
	 align-self: stretch;
	 position: relative;
	 font-weight: 300;
}
 .wd-custom-account-details .value {
	 align-self: stretch;
	 position: relative;
	 font-size: 1rem;
}
 .wd-custom-account-details .account-info-row {
	 width: 5.188rem;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 0.5rem;
}
 .wd-custom-account-details .input-container {
	 border: 1px solid #e0e0e0;
	 outline: none;
	 display: flex;
	 font-size: 1rem;
	 background-color: #fff;
	 align-self: stretch;
	 border-radius: 8px;
	 box-sizing: border-box;
	 /* height: 2.375rem; */
	 flex-direction: row;
	 align-items: center;
	 justify-content: flex-start;
	 padding: 0.5rem 1.437rem;
	 font-style: italic;
	 color: #8d8d8d;
}
 .wd-custom-account-details .input-section {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 0.5rem;
}
 .wd-custom-account-details .dropdown-container {
	 align-self: stretch;
	 border-radius: 8px;
	 background-color: #fff;
	 border: 1px solid #e0e0e0;
	 box-sizing: border-box;
	 /* height: 2.375rem; */
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: flex-start;
	 padding: 0.5rem 1.537rem;
	 font-style: italic;
	 font-size: 1rem;
	 color: #8d8d8d;
}
 .wd-custom-account-details .account-info-section {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 1.625rem;
	 font-size: 0.875rem;
	 
}
 .wd-custom-account-details .alert-message {
	 position: relative;
	 font-weight: 600;
}
 .wd-custom-account-details .alert-section {
	 align-self: stretch;
	 border-radius: 11px;
	 background-color: #ffdc99;
	 border: 3px solid #ffba35;
	 overflow: hidden;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 padding: 0.875rem 1rem;
}
 .wd-custom-account-details .back-button-text {
	 position: relative;
	 font-weight: 500;
	 display: -webkit-inline-box;
	 overflow: hidden;
	 text-overflow: ellipsis;
	 -webkit-line-clamp: 2;
	 -webkit-box-orient: vertical;
}
 .wd-custom-account-details .back-button-container {
	 text-decoration: none;
	 flex: 1;
	 border-radius: 7px;
	 background-color: #fff;
	 border: 1px solid #359eff;
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: center;
	 padding: 1rem 0.625rem;
	 color: #359eff;
	 text-align: center;
}
 .wd-custom-account-details .continue-button-container {
	 text-decoration: none;
	 flex: 1;
	 border-radius: 7px;
	 background-color: #359eff;
	 border: 1px solid #359eff;
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: center;
	 padding: 1rem 0.625rem;
	 color: inherit;
	 /* height: 100%; */
}
 .wd-custom-account-details .continue-button-container1 {
	 text-decoration: none;
	 flex: 1;
	 border-radius: 7px;
	 background-color: #c4c4c4;
	 border: 1px solid #ababab;
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: center;
	 padding: 1rem 0.625rem;
	 color: inherit;
}
 .wd-custom-account-details .button-section {
	 align-self: stretch;
	 display: flex;
	 flex-direction: row;
	 align-items: stretch;
	 justify-content: flex-start;
	 gap: 1rem;
	 color: #fff;
}
 .wd-custom-account-details .account-details-content {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 1.625rem;
	 font-size: 1rem;
}
 .wd-custom-account-details.account-details-header {
	 width: 100%;
	 border-radius: 12px;
	 background-color: #fff;
	 border: 1px solid #cecece;
	 box-sizing: border-box;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 padding: 2rem;
	 gap: 1.5rem;
	 max-width: 38.75rem;
	 color: #303030;
}
 

/************/


.wd-custom-game-list .title {
	 position: relative;
	 text-transform: uppercase;
	 font-weight: 600;
	 background: linear-gradient(90deg, #51abff, #b250ff);
	 -webkit-background-clip: text;
	 -webkit-text-fill-color: transparent;
}
 .wd-custom-game-list .back-button-text {
	 position: relative;
	 font-weight: 500;
	 display: -webkit-inline-box;
	 overflow: hidden;
	 text-overflow: ellipsis;
	 -webkit-line-clamp: 2;
	 -webkit-box-orient: vertical;
}
 .wd-custom-game-list .game-list-title-container {
	 flex: 1;
	 display: flex;
	 flex-direction: row;
	 align-items: flex-start;
	 justify-content: flex-start;
}
 .wd-custom-game-list .search-input-container {
	 border: 1px solid #e0e0e0;
	 outline: none;
	 display: flex;
	 
	 font-size: 1rem;
	 background-color: #fff;
	 align-self: stretch;
	 flex: 0.8405;
	 border-radius: 8px;
	 flex-direction: row;
	 align-items: center;
	 justify-content: flex-start;
	 padding: 0.5rem 1.437rem;
	 font-style: italic;
	 color: #8d8d8d;
}
 .wd-custom-game-list .search-button-container {
	 text-decoration: none;
	 flex: 1;
	 border-radius: 7px;
	 background-color: #359eff;
	 border: 1px solid #359eff;
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: center;
	 padding: 0.5rem 0.625rem;
	 color: white;
}
 .wd-custom-game-list .search-buttons-container {
	 flex: 1;
	 display: flex;
	 flex-direction: row;
	 align-items: stretch;
	 justify-content: flex-start;
	 gap: 0.5rem;
}
 .wd-custom-game-list .search-section {
	 flex: 1;
	 display: flex;
	 flex-direction: row;
	 align-items: stretch;
	 justify-content: flex-start;
	 gap: 1.125rem;
	 font-size: 1rem;
}
 .wd-custom-game-list .game-list-header {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: stretch;
	 justify-content: flex-start;
	 gap: 1rem;
}
 .wd-custom-game-list .pc-games-title {
	 align-self: stretch;
	 position: relative;
	 font-weight: 800;
}
 .wd-custom-game-list .game-image {
	 width: 14.9rem;
	 position: relative;
	 background-color: #d9d9d9;
	 height: 19.938rem;
}
 .wd-custom-game-list .game-card {
	 text-decoration: none;
	 display: flex;
	 flex-direction: row;
	 align-items: center;
	 justify-content: flex-start;
     position:relative
}
 .wd-custom-game-list .game-card.maintenance::after {
     content:'';
     width:100%;
     height:100%;
     background: url("../public/ma-cover.png") center no-repeat;
     position: absolute;
     background-size: cover;
}
 .wd-custom-game-list .pc-games-section {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 1rem;
}
 .wd-custom-game-list .game-categories-container {
	 align-self: stretch;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 gap: 3rem;
	 font-size: 1rem;
	 color: #000;
	 
}
 .wd-custom-game-list.game-list-container {
	 align-self: stretch;
	 border-radius: 12px;
	 background-color: #fff;
	 border: 1px solid #cecece;
	 display: flex;
	 flex-direction: column;
	 align-items: flex-start;
	 justify-content: flex-start;
	 padding: 2rem;
	 gap: 1.5rem;
	 color: #303030;
}