@font-face {font-family: 'Roboto';src: url('../assets/font_18.ttf');}
@font-face {font-family: 'Roboto';src: url('../assets/font_19.ttf');font-weight: bold;}

/* General */
body { font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif; margin:0; font-size: 14px; color: #5f6368; }
a { text-decoration: none; color: unset; }
img { max-width: 100%; }
.content { width: 100%; max-width: 750px; margin: 0 auto; padding: 50px 15px 60px; box-sizing: border-box; }
.footer-content { width: 100%; max-width: 1320px; margin: 0 auto; padding: 0 15px;box-sizing: border-box; }
h1 { font-size: 64px; margin: 0 0 20px; }
h2 { font-size: 22px; margin-top:0; margin-bottom: 15px; display: flex; align-items: center; }
h1,h2,h3,h4,h5,h6, .dark { color: #202124; }
h1 { display: flex; align-items: center; }
.bold { font-weight: bold; }
.d-grid { display: grid; }
.ms-1 { margin-left: 0.375rem; }
.mb-0 { margin-bottom: 0 !important; }
.small { font-size: 12px; }
.item-aligns-start { align-items: flex-start; }

/* Header */
header { position: fixed; width: 100%; left: 0; bottom: 0; z-index: 9999; background: #fff;transition: all .3s ease; box-shadow: 0 0 5px rgba(0,0,0,0);  }
.nav { display: flex; justify-content: space-between; align-items: center; padding: 0 25px; }
.nav-left {width: 100%;max-width: 750px;margin: 0 auto;text-align: center;padding: 0 15px;border-top: solid 1px #ddd;}
.nav-button { list-style: none; padding-left: 0; font-weight: bold; margin: 0;font-size: 12px; }
.nav-button li { display: inline-block; margin: 0 15px; }
.nav-button a { color: #5f6368; display: inline-block; padding: 18px 0; }
.nav-button a:hover { color: #202124; } 
.nav-button a.active { color: #01875f; border-bottom: solid 3px #01875f; }
.nav-right { text-align: right; }
.header-icon { display: inline-block; list-style: none; padding-left: 0;margin: 6px 0; }
.header-icon li { display: inline-block; vertical-align: middle; margin: 0 3px; }
.header-icon li:last-child { margin-right: 0; }
.header-icon a {display: inline-block;border-radius: 50%; width: 40px; height: 40px; text-align: center; line-height: 40px; padding-bottom: 2px;}
.header-icon a:hover { background-color: #f5f5f5; }
.header-icon svg, .header-icon img { vertical-align: middle; }
.nav-button-wrapper { display: inline-block; vertical-align: middle; }
.menu-icon { display: none; }

/* Top Section */
.top-section { display: flex; justify-content: space-between; }
.ts-left { width: 70%; }
.ts-right { width: 30%;text-align: right;}
.game-icon { border-radius: 35px; box-shadow: 0 0 10px rgba(0,0,0,0.5); }
.developer { font-weight: bold; color: #01875f; font-size: 16px; margin-bottom: 6px; }
.type { font-size: 12px; }
.game-info {display: inline-block;margin: 20px 0 25px;}
.verified-icon { margin-left: 3px;vertical-align: middle; }
.gi-col { display: inline-block; padding: 10px 20px; font-size: 12px; position: relative;text-align:center; }
.gict { line-height: 24px;font-size: 14px; }
.gi-col .gict-icon { vertical-align: sub;}
.gi-col svg { margin-top: 1px; vertical-align: text-top;}
.gi-col:after { content:''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 24px; background: #e8eaed; }
.gi-col:last-child:after { display: none; }
.game-dl { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; margin-bottom: 20px;}
.download-apk { margin-right: 15px; }
.download-apk a { display: inline-block; width: 168px; padding: 10px 16px; font-size: 16px; border-radius: 8px; color: #fff; font-weight: normal; background: #01875f; text-align: center; transition: all .3s ease;}
.download-apk a:hover { background: #095943; transition: all .3s ease; }
.download-apk a span { color: #ffe336; font-weight: bold;}
.rapid svg {vertical-align: middle;margin-left: -5px; margin-top: -3px; }
.share-wishlist { vertical-align: middle; padding: 6px 10px 6px 3px; color: #01875f; font-weight: bold; border-radius: 6px; cursor: pointer; }
.share-wishlist svg { margin-right: 8px; vertical-align: middle; }
.share-wishlist:hover { background: #f6fafe; transition: all .3s ease; }
.share { margin-right: 8px; }
.device-support svg { vertical-align: middle; margin-right: 8px; } 
.tslttl { display: none; }

/* Bottom Section */
.bottom-section { display: flex; flex-wrap: wrap; justify-content: space-between; }
.bs-left { width: 68%; }
.bs-right { width: 28%; }
.game-gallery { margin-bottom: 40px; }
.gallery-img { border-radius: 12px; box-shadow: 0 0 3px rgba(0,0,0,0.5);height: auto; width: 100%; max-height: fit-content; }
.splide__arrow { opacity: 1; width: 56px; height: 56px; background: #fff;box-shadow: 0 0 3px rgba(0,0,0,0.5); }
.splide__arrow svg { fill: #5f6368; }
.splide__arrow:hover:not(:disabled) { opacity: 1; background: #f7f8f8; }
.splide__arrow:disabled { opacity: 0; }
.splide__arrow--next { right: -25px; }
.splide__arrow--prev { left: -25px; }
.more-arrow {padding: 12px;border-radius: 50%; cursor: pointer;}
.more-arrow:hover { background: #f5f5f5; }
.about-game p {margin-bottom: 25px; }
.game-tag { margin: 35px 0 40px; }
.tag-item, .rrt-item { border: solid 1px #dadce0; border-radius: 20px; padding: 6px 14px; display: inline-block; margin-right: 6px; font-weight: bold; cursor: pointer; }
.tag-item:hover, .rrt-item:hover {background: #f7f8f8; }
.security-box {margin: 35px 0 40px;border: solid 1px #dadce0;padding: 20px 20px 10px;border-radius: 12px;}
.sb-item {display: flex;justify-content: flex-start;gap: 15px;align-items: flex-start;margin-bottom: 20px;}
.sb-button { color: #01875f; padding: 8px 12px; border-radius: 6px; font-weight: bold;display: inline-block; margin-top: -10px;}
.sb-button:hover {background: #f6fafe; }

/* Rate & Review */
.rating-review { margin-bottom: 40px; }
.rr-title { display: flex; justify-content: space-between; align-items:center; }
.verified-rating { display: inline-block; padding: 10px 12px; border-radius: 6px; }
.verified-rating:hover { background: #f9f9f9; }
.verified-rating svg { margin-left: 3px; vertical-align: top; }
.rrt-item svg { vertical-align: bottom; margin-right: 3px; }
.rrt-item.active { color: #01875f; background: #e6f3ef; }
.rr-tag { margin: 25px 0 40px; }
.rating-statistic { display:flex; justify-content: flex-start; gap: 15px;  }
.bar-right { position: relative; }
.progress-first { position: absolute; height: 10px; background: #01875f; left: 0; top: 0; z-index: 1; border-radius: 6px; }
.progress-backend { display: block; width: 100%; height: 10px; background: #e8eaed; border-radius: 6px; }
.bar-item { display: flex; gap: 10px; align-items: center; }
.bar-left { width: 10px; }
.bar-right { width: calc(100% - 10px); }
.rst-left { width: 100px; }
.rst-right { width: calc(100% - 100px); }
.half_star .gradientgreen{ stop-color: #01875f; }
.half_star .gradientgray{ stop-color: #f2f4f5; }
.rate-big { font-size: 56px;  }
.rate-stars { margin-bottom: 5px; }

/* Comment */
.comm_item { margin-bottom: 45px; }
.commi-name img { border-radius: 50%;vertical-align: middle; margin-right: 10px; }
.commi-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.morevert { padding: 12px; border-radius: 50%; cursor: pointer; }
.morevert:hover { background: #f5f5f5; }
.comm-rate {display: flex;gap: 6px;font-size: 12px;align-items: flex-start;}
.comm-rate, .comm-content, .comm-helpful { margin-bottom: 15px; }
.helpful-tag { display: flex; gap: 10px; align-items: center; }
.help-tag {border: solid 1px #dadce0;padding: 3px 10px;border-radius: 12px;font-weight: bold;cursor: pointer;}
.help-tag:hover { background: #f7f8f8; }
.more-review-btn { color: #01875f; padding: 8px 12px; border-radius: 6px; font-weight: bold;display: inline-block;  }
.more-review-btn:hover {background: #f6fafe; }
.whatsnew-list { padding-left: 20px; }
.whatsnew { margin-bottom: 45px; }
.flag { display:flex; align-items: center; gap: 20px; }

/* Side Content */
h2.more-game-title { margin-bottom: 25px; }
.contact_box { margin-bottom: 30px; }
.expand_btn {padding: 12px;border-radius: 50%; cursor: pointer; margin-left: 0.375rem;transform: rotate(180deg);}
.expand_btn:hover { background: #f5f5f5; }
.expand_btn.active { transform: rotate(0deg); }
.contact-item { margin: 0 -12px 5px; }
.contact-item a {display: inline-block;width: 100%;padding: 12px;border-radius: 8px;font-weight: bold;}
.contact-item a:hover { background: #f5f5f5; }
.contact-item a svg {vertical-align: bottom;margin-right: 10px;}
.about_company {padding-top: 15px;}
.game-name { font-size: 16px; margin-bottom: 5px;}
.game-dev { margin-bottom: 5px; }
.game-item img {border-radius: 12px;box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);}
.game-item {display: flex;gap: 15px; width: 100%; cursor: pointer; padding: 12px; border-radius: 8px; margin: -12px -12px 15px; }
.game-item:hover { background: #f5f5f5; }
.game-rate svg { vertical-align: middle; margin-bottom: 2px; }

/* Footer */
.footer { border-top: solid 1px #e8eaed; padding: 50px 0; }
.footer-widget { display: inline-block; width: 266px; vertical-align: top; }
.widget-menu { padding-left: 0; line-height: 30px; list-style: none; margin: 10px 0 0; }
.widget-menu li { cursor: pointer; }
.widget-menu li:hover, .footer-menu li:hover { color: #01875f; }
.footer-menu { padding-left:0; list-style: none; margin: 0; }
.footer-menu li { display: inline-block; margin-right: 30px; }
.footer-bottom { padding-bottom: 25px; }

/*
@media screen and (max-width: 1280px) {
	h1 { font-size: 36px; }
	h2 { font-size: 18px; }
	.content, .footer-content { max-width: 940px; margin: 0 auto; }
	.game-icon { max-width: 180px; height: auto; }
	.gallery-img { height: auto; }
	.nav { padding: 0 8px; }
}*/

html, body { overflow-x: hidden; }
body { padding-bottom: 70px; }
h1 { margin: 0 0 5px; }
.ts-left { width: 100%; }
.bs-left, .bs-right { width: 100%; }
.more-game-title { align-items: center; }
.game-list { display: flex; flex-wrap: wrap; }
.game-item { width: 50%; }
.ts-right { display: none; }
.tslttl { display: block; }
.game-icon { box-shadow: 0 0 3px rgba(0,0,0,0.5); border-radius: 12px; margin-top: 5px; }
.tsl-tt { display: flex; gap: 20px; }
.game-info { margin: 15px 0 20px; } 
.download-apk a { font-size: 14px; width: 128px; }
.menu-icon { display: block; }
.nav-button a { padding: 6px 0; }
.nav-button a.active {border-bottom: none; }
.nav-button li { width: 80px; margin: 0 30px; }
.footer-menu li { margin-right: 20px; }
.footer-menu li:last-child { margin-right:0; }

.content { padding-bottom: 40px; }
.content, .footer-content { width: 100%; padding-left: 20px; padding-right: 20px; }
h1 { font-size: 24px; }
h2 { justify-content: space-between; }
.nav-button-wrapper { width: 100%;}
.nav-button { display: flex; justify-content: space-between; }
.nav-button li { margin: 0 3px; }
.game-dl { justify-content: center; margin-bottom: 30px;  }
.download-apk { margin-right: 0;margin-bottom: 15px; }
.download-apk, .download-apk a { width: 100%;box-sizing: border-box; }
.share-wishlist svg { margin-right: 6px; }
.game-gallery { margin-bottom: 15px; }
.rr-title { flex-wrap: wrap; }
.rr-title h2, .verified-rating { width: 100%; }
.verified-rating { padding: 6px 0; font-size: 12px; }
.tag-item, .rrt-item { margin-bottom: 12px; }
.game-tag { margin: 30px 0 10px; }
.security-box { margin: 30px 0 15px; }
.rr-tag { margin: 25px 0; width: 100%; overflow-x: auto; white-space: nowrap; }
.rr-tag::-webkit-scrollbar {display: none;}
.rr-tag {scrollbar-width: none}
.rr-tag {-ms-overflow-style: none;}
.rating-statistic { gap: 10px; }
.bar-item { gap: 5px; }
.comm_item { margin-bottom: 25px; }
.whatsnew { margin-bottom: 20px; }
.contact_box { margin-bottom: 0; }
.game-name { font-size: 14px; }
.game-dev { font-size: 12px; }
.game-item img { width: 56px; height: 56px; }
.game-name, .game-dev { white-space: nowrap; overflow-x: hidden; }
.game-item { width: 48%; overflow-x: hidden; margin: 0 0 20px; padding: 0;  }
.game-item:hover { background: transparent; }
.game-list { justify-content: space-between; }
.flag { gap: 15px; }
.footer { padding: 40px 0;}
.footer-menu li { margin-bottom: 15px; }

@media screen and (max-width: 380px) {
	.nav-left { width: 50%;}
	.nav-right { width: 50%; }
}