:root {
    --gWidth: 70vw;
    --gWidth_f: 100vw;
    --wMeasure: 1vw;
    --hMeasure: 2vw;
    --fontSize: 1.3vw;
}

:root:lang(zh),
:root:lang(tw) {
    --fontSize: 1.3vw;
}

* {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    font-family: rubik;
    font-size: var(--fontSize);
    font-weight: 400;
    margin: auto;
    max-width: 100%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    color: #ffffff;
}

::-webkit-scrollbar {
    width: 0px;
}

#chat-widget-container {
    z-index: 2147483648 !important;
}

#top_logo {
    width: 13vw;
    top: 0.5vw;
    left: 2vw;
    z-index: 50;
}

#wg-ar {
    display: none !important;
}

.weglot-container a {
    margin: inherit;
    font-size: 1vw;
}

.weglot-container {
    position: absolute;
    top: 10px;
    right: 0px;
}

.wg-drop.country-selector ul {

    max-height: initial !important;
}

.wg-drop.weg-openleft ul {
    right: 10px !important;
    width: auto !important;
    min-width: 19vw !important;

    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    padding: 10px;
    box-sizing: border-box;
}

.wg-drop.weg-openleft ul li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#weglot-language-ms {
    font-size: 150%;
    letter-spacing: -1px;
}

.weglot-container>aside>div>a {
    color: #00042e;
}

.wg-drop.country-selector .wgcurrent:after {
    background-image: url(/asset/images/activity/halloween-2025/eid-al-fitr/t_arrow.png) !important;
}

.bold {
    font-size: 105%;
    font-weight: 900;
}

.gText {
    background-image: linear-gradient(to right, #1c8993, #359aa4, #4aabb6, #71cfdb, #79d7e4, #5ec0cd, #51b5c1, #42aab6, #1c8993, #1c8993, #1c8993);
    -webkit-text-stroke: 1px #fffcfc;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gText2 {
    background-image: linear-gradient(to bottom, #ffeab2, #ffdd85, #986e00);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.cf1 {
    font-family: 'cf1';
}


.cf2 {
    font-family: cursive;
}

.cc {
    cursor: pointer;
}

.elePage {
    position: absolute;
}

.showMobile {
    display: none !important;
}

.sCN {
    display: none;
}

.sEN:lang(zh),
.sEN:lang(tw) {
    display: none;
}

.sCN:lang(zh),
.sCN:lang(tw) {
    display: initial;
}

body {
    margin: 0;
    padding: 0;
}

section {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 40vw;
}

img {
    height: auto;
}

/* #wg-zh,
#wg-tw {
    display: none !important;
} */

.bShadow {
    text-shadow: 2px 2px 4px #000000c7;
}

.wShadow {
    text-shadow: 0px 0px 6px white, 0px 0px 8px white;
}


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

#top_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/top_bg1.jpg);
    width: 100%;
    height: 67vw;
}

#top_sec .textArea {
    width: 33%;
    margin-left: 18vw;
    margin-top: 13vw;
    text-align: left;
    position: relative;
    z-index: 1;
}

#top_sec .textArea:lang(zh),
#top_sec .textArea:lang(tw) {
    width: 28%;
    margin-left: 22vw;
    margin-top: 16vw;
    text-align: left;
    position: relative;
    z-index: 1;
}

#top_sec .textArea div {
    display: flex;
    flex-direction: column;
    width: 12vw;
    height: 5vw;
    margin-left: 0;
    background-image: url(/asset/images/activity/summer-bonus-2026/top_btn_bg.png);
}

#top_sec .textArea div p {
    font-family: fantasy;
    font-size: 1.4vw;
}

#top_btn_bg {
    width: 100%;
    left: 0vw;
    top: 0vw;
}

#top_sec h2,
#top_sec span {
    font-size: 4vw;
    text-align: left;
}

#top_sec span {
    color: #f6ba3c;
    -webkit-text-stroke: 1px #d56908;
}

#top_sec h2:lang(zh),
#top_sec h2:lang(tw) {
    font-size: 4vw;
    text-align: left;
}

#top_sec h3 {
    font-size: 4vw;
}

#top_bg2 {
    width: 100%;
    left: 0vw;
    top: 0vw;
}

#top_bg3 {
    width: 100%;
    left: 0vw;
    top: 0vw;
}

#top_ele1 {
    width: 82.5vw;
    right: 0vw;
    top: 0vw;
}

#top_ele2 {
    width: 38vw;
    right: 15vw;
    top: 2vw;
}

#top_ele2_ref {
    width: 38vw;
    right: 15vw;
    top: 2vw;
    /* opacity: .5; */
    transform: rotateZ(180deg) rotateY(180deg) rotateX(3deg) translateY(-9.8vw);
    filter: opacity(0.5) blur(0px);
    -webkit-mask-image: linear-gradient(to bottom,
            transparent 0%,
            black 20%,
            black 100%);
    mask-image: linear-gradient(to bottom,
            transparent 0%,
            transparent 20%,
            black 100%);
}

#about_ele2 {
    width: 100vw;
    left: 0vw;
    top: -12vw;
}

#top_ele3 {
    width: 35vw;
    left: 0vw;
    top: 0vw;
}

#top_ele4 {
    width: 29vw;
    right: 0vw;
    top: 2vw;
}


#login_btn {
    width: 15vw;
    height: 4vw;
    top: -17.5vw;
    left: 16.5vw;
    z-index: 5;
}

#login_btn:lang(zh),
#login_btn:lang(tw) {
    width: 15vw;
    height: 4vw;
    top: -17.75vw;
    left: 20.25vw;
    z-index: 5;
}

#register_btn {
    width: 15vw;
    height: 4vw;
    top: -12.5vw;
    left: 16.5vw;
    z-index: 5;
}

#register_btn:lang(zh),
#register_btn:lang(tw) {
    width: 15vw;
    height: 4vw;
    top: -12.75vw;
    left: 20.25vw;
    z-index: 5;
}

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



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

#about_sec {
    position: relative;
    margin-top: -17vw;
}

#about_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/about_bg.png?v=1);
    width: 100%;
    height: 76vw;
}

#about_sec .textArea {
    width: 44%;
    margin-right: 8vw;
    margin-top: 21vw;
    position: relative;
}

.titleWrapper {
    height: 7vw;
    display: flex;
    flex-direction: column;
    position: relative;
}

.titleWrapper h1 {
    position: absolute;
    top: 0vw;
    left: 30%;
    width: 40%;
    font-size: 5vw;
    font-family: fantasy;
}

.titleWrapper h2 {
    position: absolute;
    top: 7vw;
    left: 30%;
    width: 40%;
    font-size: 4vw;
    font-family: fantasy;
    color: #003651;
    letter-spacing: 3px;
}

.titleWrapper h2:lang(zh),
.titleWrapper h2:lang(tw) {
    top: 8.2vw;
}

.titleShadow {
    text-shadow: -1px -1px 1px #ffffff, -1px 1px 1px #ffffff, 1px -1px 1px #ffffff, 1px 1px 1px #ffffff, -2px -2px 1px #ffffff, -2px 2px 1px #ffffff, 2px -2px 1px #ffffff, 2px 2px 1px #ffffff, -3px -1px 1px #ffffff, -3px 1px 1px #ffffff, 3px 1px 1px #ffffff, 3px -1px 1px #ffffff;
}

#about_sec>div>div>div>h1.gText {
    background-position-x: 44px;
}

#about_sec>div>div>p {
    font-size: 1.3vw;
    margin-bottom: 2vw;
    color: #003651;
}

#about_top_ele {
    width: 70vw;
    right: 0vw;
    top: -46vw;
}

#about_ele1 {
    width: 38vw;
    left: 11vw;
    top: 12vw;
}

#about_ele3 {
    width: 100%;
    left: 0vw;
    top: 18vw;
    opacity: .8;
    filter: hue-rotate(347deg);
}

#about_arrows1 {
    width: 6vw;
    left: 45vw;
    top: 20vw;
}

#about_arrows2 {
    width: 12vw;
    right: 10vw;
    top: 52vw;
}

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



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

#details_sec {
    position: relative;
    margin-top: -21vw;
}

#details_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/details_bg.png?v=1);
    width: 100%;
    height: 148vw;
}

#details_sec .titleWrapper {
    margin-top: 14vw;
    height: 14vw;
}

#details_sec .titleWrapper h1 {
    font-size: 7vw;
}

#details_sec>div>h2 {
    background-color: white;
    color: #003651;
    width: fit-content;
    padding: 0.5vw 2vw;
    font-size: 1.5vw;
    border-radius: 25px;
    margin-bottom: 2vw;
    font-weight: 600;
    position: relative;
}

#details_bal1 {
    width: 16vw;
    left: 11vw;
    top: 20vw;
}

#details_sec .textArea {
    width: 80%;
    display: flex;
    flex-direction: row;
    height: 58vw;
    position: relative;
    margin-top: 3vw;
}

#details_sec .textArea * {
    color: #003651;
}

#details_sec>div>p {
    color: #003651;
    width: 42%;
    position: relative;
    margin-bottom: -4vw;
}

#details_sec_ta1,
#details_sec_ta2 {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#details_sec_ta1 {
    background-image: url(/asset/images/activity/summer-bonus-2026/details_text_bg1.png?v=3);
}

#details_sec_ta1:lang(zh),
#details_sec_ta1:lang(tw) {
    background-image: url(/asset/images/activity/summer-bonus-2026/details_text_bg1_cn.png?v=3);
}

#details_sec_ta2 {
    background-image: url(/asset/images/activity/summer-bonus-2026/details_text_bg2.png?v=1);
}

#details_sec_ta2:lang(zh),
#details_sec_ta2:lang(tw) {
    background-image: url(/asset/images/activity/summer-bonus-2026/details_text_bg2_cn.png?v=1);
}

#details_sec_ta1>div,
#details_sec_ta2>div {
    width: 50%;
    height: 100%;
    flex-direction: column;
    margin-top: 9vw;
    margin-left: 13.5vw;
}

#details_sec_ta1>div>h3,
#details_sec_ta2>div>h3 {
    margin-top: 0vw;
    margin-bottom: 3vw;
    font-size: 2.5vw;
    font-weight: 600;
    font-family: fantasy;
    width: 70%;
}

#details_sec_ta1>div>h3:lang(zh),
#details_sec_ta1>div>h3:lang(tw),
#details_sec_ta2>div>h3:lang(zh),
#details_sec_ta2>div>h3:lang(tw) {
    font-size: 3vw;
}

#details_sec>div>div.textArea>div>div>p {
    margin-bottom: 1.2vw;
    font-size: 1.12vw;
}

#details_sec>div>div.textArea>div>div>p:lang(zh),
#details_sec>div>div.textArea>div>div>p:lang(tw) {
    margin-bottom: 1.2vw;
    font-size: 1.4vw;
}

#details_sec_ta2>div>h4 {
    color: #dc0000 !important;
    font-size: 1.5vw;
    font-weight: 600;

}

#details_bal2 {
    width: 14vw;
    right: -5vw;
    top: 7vw;
}

#details_about_btn {
    width: 10vw;
    top: 10vw;
    left: 10vw;
}

#details_about_btn {
    width: 8vw;
    top: -2vw;
    left: 46vw;
}

#details_ele1 {
    width: 100%;
    top: -4vw;
    left: 0vw;
}

#details_ele2 {
    width: 100%;
    top: 66vw;
    left: 0vw;
}

#details_ele3 {
    width: 34vw;
    top: 34vw;
    left: 0vw;
}

#details_ele4 {
    width: 29vw;
    top: 4vw;
    right: 0vw;
}

#details_ele5 {
    width: 57vw;
    top: 91vw;
    left: 23vw;
    filter: hue-rotate(343deg) opacity(0.8) blur(.5px);
    /* opacity: .5; */
}

#details_gift1 {
    width: 13vw;
    top: 2vw;
    left: 2vw;
}

#details_gift2 {
    width: 8vw;
    top: 66vw;
    right: 0vw;
}

#details_text_m_ele5:lang(zh),
#details_text_m_ele5:lang(tw) {
    content: url('/asset/images/activity/summer-bonus-2026/cn_details_text_m_ele5.png?v=1');
}



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



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

#calc_sec {
    position: relative;
    margin-top: -50vw;
}

#calc_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/calc_bg.png);
    width: 100%;
    height: 178vw;
}

#calc_gift1 {
    width: 13vw;
    top: 5vw;
    left: 11vw;
}

#calc_bal1 {
    width: 21vw;
    top: 1vw;
    right: 6vw;
}

#calc_sec .titleWrapper {
    margin-top: 14vw;
    height: 13vw;
}

#calc_sec .titleWrapper h1 {
    font-size: 5vw;
}

#calc_sec .titleWrapper h1:lang(zh),
#calc_sec .titleWrapper h1:lang(tw) {
    font-size: 5vw;
    font-weight: 600;
}


#calc_sec .titleWrapper h2 {
    font-size: 4vw;
    top: 6vw;
}

#formula_wrapper {
    width: 80vw;
    height: 30vw;
    margin-top: 8vw;
    position: relative;
}

#formula_inner_wrapper {
    position: absolute;
    top: 5%;
    left: 1vw;
    display: flex;
    flex-direction: column;
    height: 90%;
    width: 54%;
}

.formulaText {
    display: flex;
    margin: 1vw auto;
}

.formulaText p {
    color: #003651;
    width: 20%;
    font-size: 2vw;
    font-weight: 600;
    margin: auto 0.5vw;
}

.formulaText p:lang(zh),
.formulaText p:lang(tw) {
    font-size: 2.2vw;
    width: 30%;
}

.formulaText img {
    margin: auto 0.5vw;
    width: 8%;
}

#formula_inner_wrapper>div:nth-child(1)>img:nth-child(5) {
    width: 22%;
    margin-left: 1vw;
}

#formula_inner_wrapper>div:nth-child(4)>div>img:nth-child(5) {
    width: 30%;
}

#formula_wrapper>div:nth-child(2) {
    background: #ffffffcf;
    width: 100%;
    height: 100%;
    border-radius: 25px;
    box-shadow: 3px 3px 8px 3px #C1E3E0;
    position: relative;
}

#formula_inner_wrapper h5 {
    color: #003651;
    font-size: 1.5vw;
    margin: 1vw auto;
}

#formula_inner_wrapper h6 {
    color: #d4851b;
    font-size: 1.8vw;
    margin: 1vw auto;
    font-weight: 900;
}

#calc_bal2 {
    width: 14vw;
    top: -16vw;
    left: -6vw;
}

#calc_form_ele {
    width: 55vw;
    top: 3vw;
    right: -10vw;
}

#calc_sec .textArea {
    margin-top: 8vw;
    width: 70%;
    position: relative;
}

#calc_sec .textArea * {
    color: #003651;
}

#calc_ta_p3 p:lang(zh),
#calc_ta_p3 p:lang(tw) {
    font-size: 1.5vw;
}

.seperator {
    position: absolute;
    top: 1.45vw;
    left: -0.08vw;
    height: 5vw;
    color: white !important;
    border: 1px solid white;
}

#calc_ta_p1 {
    display: flex;
}

#calc_ta_p1 div:nth-child(1) {
    background-image: url(/asset/images/activity/summer-bonus-2026/calc_text_bg.png);
    width: 15vw;
    height: 10vw;
    margin-left: 0vw;
    margin-right: 0vw;
    display: flex;
}

#calc_ta_p1 div:nth-child(1) p {
    color: white;
    font-size: 2.2vw;
    margin-left: 3vw;
    font-weight: 600;
}

#calc_ta_p1 div:nth-child(1) p:lang(zh),
#calc_ta_p1 div:nth-child(1) p:lang(tw) {
    font-size: 3vw;
    margin-left: 3.5vw;
}

#calc_ta_p1 div:nth-child(2) {
    margin-left: 0vw;
}

#calc_sec .textArea li {
    text-align: left;
    margin: 1.5vw;
    font-size: 1.4vw;
}

#calc_ta_p2 {
    display: flex;
    margin-top: 5vw;
    border: 2px solid #2bc299;
    border-radius: 25px;
    background: #ffffffe3;
    box-shadow: 0px 3px 10px 1px #004f774d;
}

table {
    border-collapse: collapse;
    width: 100%;
}

th {
    width: 30%;
    background-color: #2bc299;
    padding: 2vw;
    position: relative;
    flex-direction: row;
}

th p {
    font-size: 1.7vw;
    font-weight: 600;
    color: white !important;
}

th:nth-child(1) {
    border-radius: 25px 0 0 0;
}

th:nth-child(3) {
    border-radius: 0 25px 0 0;
}

td {
    width: 30%;
    background-color: #ffffff52;
    padding: 2vw;
    font-size: 1.7vw;
    font-weight: 600;
    border: 2px solid #2bc299;
}

td:nth-child(1) {
    border-left: none;
}

td:nth-child(3) {
    border-right: none;
}

#calc_sec>div>div.textArea>div:nth-child(2)>table>tbody>tr:nth-child(5) td {
    border-bottom: none;
}

#calc_sec>div>div.textArea>div:nth-child(2)>table>tbody>tr:nth-child(5) td:nth-child(1) {
    border-radius: 0 0 0 25px;
}

#calc_sec>div>div.textArea>div:nth-child(2)>table>tbody>tr:nth-child(5) td:nth-child(3) {
    border-radius: 0 0 25px 0;
}

#calc_ta_p3 {
    margin-top: 6vw;
    position: relative;
    width: 81%;
}

#calc_ele1 {
    width: 100%;
    left: 0vw;
    top: 92vw;
    z-index: 1;
}

#calc_ele2_1 {
    width: 9vw;
    right: 4vw;
    top: 145vw;
}

#calc_ele2_2 {
    width: 9vw;
    right: 2vw;
    top: 85vw;
    rotate: -94deg;
}

#calc_ele2_3 {
    width: 9vw;
    left: 4vw;
    top: 153vw;
    rotate: 80deg;
}

#calc_ele2_4 {
    width: 9vw;
    left: 3vw;
    top: 110vw;
}

#calc_ele3 {
    width: 20vw;
    right: 0vw;
    top: 101vw;
}

#calc_ele4 {
    width: 27vw;
    left: 0vw;
    top: 70vw;
}

#calc_bal3 {
    width: 20vw;
    left: 0vw;
    top: 122vw;
    z-index: 1;
}

#calc_gift2 {
    width: 14vw;
    right: 4vw;
    top: 118vw;
    z-index: 1;
}

.calcDivi {
    margin: 1vw auto;
}

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



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

#guidelines_sec {
    position: relative;
    margin-top: -22vw;
}

#guidelines_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/guidelines_bg.png?v=1);
    width: 100%;
    height: 84vw;
}

#guidelines_sec .textArea {
    margin-top: 26vw;
    position: relative;
}

#guidelines_sec .titleWrapper {
    margin-top: 14vw;
    height: 13vw;
}

#guidelines_sec>div>div>div:nth-child(2) {
    background-image: url(/asset/images/activity/summer-bonus-2026/guidelines_text_bg1.png);
    height: 22vw;
    width: 36VW;
    left: 8vw;
    top: 9vw;
    display: flex;
    flex-direction: column;
}

#guidelines_sec>div>div>div:nth-child(2) p {
    width: 25vw;
    color: #003651;
    margin-left: 5vw;
    margin-top: 4vw;
    font-size: 1.3vw;
    text-align: left;
}

#guidelines_sec>div>div>div:nth-child(2) p:lang(zh),
#guidelines_sec>div>div>div:nth-child(2) p:lang(tw) {
    width: 23.3vw;
    font-size: 1.5vw;
}

#guidelines_sec>div>div>div:nth-child(3) {
    background-image: url(/asset/images/activity/summer-bonus-2026/guidelines_text_bg2.png);
    height: 28vw;
    width: 31VW;
    RIGHT: 5vw;
    top: 6vw;
}

#guidelines_sec>div>div>div:nth-child(3) p {
    width: 21vw;
    color: #003651;
    margin-left: 6vw;
    margin-top: 6.5vw;
    font-size: 1.3vw;
    text-align: left;
}

#guidelines_sec>div>div>div:nth-child(3) p:lang(zh),
#guidelines_sec>div>div>div:nth-child(3) p:lang(tw) {
    width: 20.6vw;
    font-size: 1.5vw;
}

#guidelines_sec>div>div>div:nth-child(4) {
    background-image: url(/asset/images/activity/summer-bonus-2026/guidelines_text_bg3.png);
    height: 20vw;
    width: 33VW;
    left: 9vw;
    top: 34vw;
}

#guidelines_sec>div>div>div:nth-child(4) p {
    width: 22vw;
    margin-left: 6.5vw;
    margin-top: 8vw;
    font-size: 1.3vw;
    text-align: left;
}

#guidelines_sec>div>div>div:nth-child(4) p:lang(zh),
#guidelines_sec>div>div>div:nth-child(4) p:lang(tw) {
    width: 20.5vw;
    font-size: 1.5vw;
}

#guidelines_ele1 {
    width: 100%;
    left: 0vw;
    top: 8vw;
}

#guidelines_ele2 {
    width: 31VW;
    left: 0vw;
    top: 19vw;
}

#guidelines_ele3 {
    width: 31VW;
    right: 0vw;
    top: 23vw;
}

#guidelines_ele4 {
    width: 47VW;
    left: 33vw;
    top: 44vw;
}

#guidelines_ele4:lang(zh),
#guidelines_ele4:lang(tw) {
    content: url('/asset/images/activity/summer-bonus-2026/cn_guidelines_ele4.png?v=1')
}

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



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

#notice_sec {
    position: relative;
}

#notice_sec .container {
    background-image: url(/asset/images/activity/summer-bonus-2026/notice_bg.png?v=1);
    height: 70vw;
    width: 100%;
}

#notice_sec .textArea {
    width: 56%;
    margin-top: 8vw;
    position: relative;
}

#notice_sec .textArea p:lang(zh),
#notice_sec .textArea p:lang(tw) {
    font-size: 1.5vw;
}

#notice_sec h2 {
    font-size: 2vw;
    margin-top: 3vw;
    margin-bottom: 1vw;
}

#notice_sec .textArea h2:lang(zh),
#notice_sec .textArea h2:lang(tw) {
    font-size: 2.5vw;
}

#notice_left {
    width: 20VW;
    left: 0vw;
    top: 3vw;
}

#notice_right {
    width: 35VW;
    right: 0vw;
    top: 3vw;
}

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