@charset "UTF-8";

/*
Theme Name: Games
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 5.9
Requires PHP: 5.6
Version: 1.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/

/**
 * SETTINGS
 * File-header..........The file header for the themes style.css file.
 * Fonts................Any font files, if the project needs specific fonts.
 * Global...............Project-specific, globally available variables.
 *
 * TOOLS
 * Functions............Global functions.
 * Mixins...............Global mixins.
 *
 * GENERIC
 * Normalize.css........Normalise browser defaults.
 * Breakpoints..........Mixins and variables for responsive styles
 * Vertical-margins.....Vertical spacing for the main components.
 * Reset................Reset specific elements to make them easier to style in other contexts.
 * Clearings............Clearings for the main components.
 *
 * ELEMENTS
 * Blockquote...........Default blockquote.
 * Forms................Element-level form styling.
 * Headings.............H1–H6
 * Links................Default links.
 * Lists................Default lists.
 * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video.
 *
 * BLOCKS
 * Audio................Specific styles for the audio block.
 * Button...............Specific styles for the button block.
 * Code.................Specific styles for the code block.
 * Columns..............Specific styles for the columns block.
 * Cover................Specific styles for the cover block.
 * File.................Specific styles for the file block.
 * Gallery..............Specific styles for the gallery block.
 * Group................Specific styles for the group block.
 * Heading..............Specific styles for the heading block.
 * Image................Specific styles for the image block.
 * Latest comments......Specific styles for the latest comments block.
 * Latest posts.........Specific styles for the latest posts block.
 * Legacy...............Specific styles for the legacy gallery.
 * List.................Specific styles for the list block.
 * Media text...........Specific styles for the media and text block.
 * Navigation...........Specific styles for the navigation block.
 * Paragraph............Specific styles for the paragraph block.
 * Pullquote............Specific styles for the pullquote block.
 * Quote................Specific styles for the quote block.
 * Search...............Specific styles for the search block.
 * Separator............Specific styles for the separator block.
 * Spacer...............Specific styles for the spacer block.
 * Table................Specific styles for the table block.
 * Verse................Specific styles for the verse block.
 * Video................Specific styles for the video block.
 * Utilities............Block alignments.
 *
 * COMPONENTS
 * Header...............Header styles.
 * Footer...............Footer styles.
 * Comments.............Comment styles.
 * Archives.............Archive styles.
 * 404..................404 styles.
 * Search...............Search styles.
 * Navigation...........Navigation styles.
 * Footer Navigation....Footer Navigation styles.
 * Pagination...........Pagination styles.
 * Single...............Single page and post styles.
 * Posts and pages......Misc, sticky post styles.
 * Entry................Entry, author biography.
 * Widget...............Widget styles.
 * Editor...............Editor styles.
 *
 * UTILITIES
 * A11y.................Screen reader text, prefers reduced motion etc.
 * Color Palette........Classes for the color palette colors.
 * Editor Font Sizes....Editor Font Sizes.
 * Measure..............The width of a line of text, in characters.
 */

/* Categories 01 to 03 are the basics. */

.mid-content-box-head{font-size:25px;color:#fff;line-height:32px;font-weight:700;}
.game-box{box-shadow:0 4px 20px 0 rgb(0 0 0 / 10%);padding:15px;margin:0 -5px;border-radius:10px;height:100%;}
.game-box-name{color:rgb(12,60,96);font-size:18px;line-height:1.4em;margin-bottom:10px;}
.we-are-global{background:#111;}
.u9-box{max-width:1100px;margin:18px auto;padding:18px;border:1px solid #111;border-radius:7px;text-align:center;}.u9-box h2{margin:0 0 15px;}.u9-box h3{margin:18px 0 8px;}.u9-box p{margin:0 0 12px;}.u9-box ul,.u9-box ol{display:inline-block;text-align:left;margin:8px auto 14px;padding-left:25px;}.u9-box li{margin-bottom:7px;}.u9-box blockquote{margin:10px auto 18px;}
#footer a{color:#000;}
#footer{color:#000;font-size:14px;position:relative;}
#footer .footer-top{padding:60px 0 30px;background:rgb(251,192,80);background:linear-gradient(0deg,rgba(251,192,80,1) 0%,rgba(244,219,167,1) 40%);-webkit-box-shadow:0 0 36px -5px rgba(0,0,0,.75);-moz-box-shadow:0 0 36px -5px rgba(0,0,0,.75);box-shadow:0 0 36px -5px rgba(0,0,0,.75);}
#footer .footer-top .footer-contact h3{font-size:26px;line-height:1;font-weight:700;color:#950204;}
.footer-partner-logo img{filter:grayscale(1);}
.row.page_content_all a{text-decoration:underline;color:#068199;}
#footer ul li{margin-bottom:15px;}
.the_content article{padding:10px;}
.entry-content{padding:30px 0;}
nav.navigation.post-navigation{padding:10px;}
.socail_logo{list-style:none;display:flex;column-gap:15px;align-items:center;}
.socail_logo li,.socail_logo svg{width:20px;height:20px;}
.section{padding:30px 0;}
.game-tabber-tab{list-style:none;display:flex;column-gap:20px;}
.game-tabber-tab li{padding:10px 20px;border-radius:5px;background:rgb(251,192,80);background:linear-gradient(0deg,rgba(251,192,80,1) 0%,rgba(244,219,167,1) 40%);color:#000;font-weight:bold;cursor:pointer;}
.game-tabber-tab li.active,.game-tabber-tab li:hover{background-color:transparent;background-image:linear-gradient(160deg,#FC4103 33%,#B80707 80%);color:#fff;}
.game-tabber-div{margin-top:20px;}
.game-list{display:flex;column-gap:15px;flex-wrap:wrap;row-gap:15px;}
.game-item{width:calc(50% - 15px);}
.game-item img{border-radius:10px;}
.game-tabber-div-game{display:none;}
.game-tabber-div-game.active{display:block;}
.faq-list li .faq-list-head{display:block;position:relative;color:#fff;font-size:18px;line-height:24px;font-weight:bold;padding-right:10px;cursor:pointer;padding-left:42px;}
.faq-list li{border-bottom:1px solid #eee;margin-bottom:20px;padding:20px 30px;border:none;box-shadow:0 0 3px rgb(136 136 136 / 10%);list-style:none;background-image:linear-gradient(160deg,#FC4103 33%,#B80707 80%);color:#fff;}
.icon-show{width:25px;display:inline-block;height:25px;background:#000;position:absolute;left:0;border-radius:50px;top:0;bottom:0;margin:auto;}
.icon-show:before{content:"+";text-align:center;font-size:20px;width:25px;height:23px;display:inline-block;}
.faq-list li.active .icon-show:before{content:"—";text-align:center;font-size:15px;width:24px;display:inline-block;position:relative;top:-1px;}
.faq-list-panel{margin-top:20px;display:none;}
.faq-list li.active .faq-list-panel{display:block;}
@media(max-width:767px){
#footer .footer-contact.footer-links{padding:0 50px;margin-bottom:30px;}
#meter{font-size:12px;color:#950204;text-align:center;}
.u9-box{margin:12px 10px;padding:13px}.u9-box h2{font-size:21px}.u9-box h3{font-size:18px}
.game-tabber-tab{column-gap:15px;}
.game-tabber-tab li{padding:10px 15px;font-size:14px;}
.section{padding:30px 15px;}
.game-item{width:100%;}
.icon-show:before{position:relative;top:-1px;}
.roll_page_content_all{display:block!important;width:100%!important;max-height:430px;overflow-y:auto!important;overflow-x:hidden!important;margin:15px 0!important;padding:18px 15px!important;background:#fff;border:2px solid #b80707;border-radius:12px;box-shadow:0 4px 14px rgba(184,7,7,.12);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b80707 #f3f3f3;}
.roll_page_content_all>*{max-width:100%!important;}
.roll_page_content_all p{font-size:14px;line-height:22px;color:#222;margin-bottom:14px;}
.roll_page_content_all h2{font-size:21px;line-height:27px;color:#950204;margin:20px 0 10px;}
.roll_page_content_all h3{font-size:18px;line-height:24px;color:#950204;margin:18px 0 8px;}
.roll_page_content_all h4{font-size:16px;line-height:22px;color:#950204;margin:15px 0 7px;}
.roll_page_content_all a{color:#b80707!important;text-decoration:underline;}
.roll_page_content_all ul,.roll_page_content_all ol{padding-left:20px;margin:10px 0 15px;}
.roll_page_content_all li{font-size:14px;line-height:22px;color:#222;margin-bottom:6px;}
.roll_page_content_all img{max-width:100%;height:auto;}
.roll_page_content_all table{width:100%;max-width:100%;overflow-x:auto;}
.roll_page_content_all::-webkit-scrollbar{width:6px;}
.roll_page_content_all::-webkit-scrollbar-track{background:#f3f3f3;border-radius:10px;}
.roll_page_content_all::-webkit-scrollbar-thumb{background:#b80707;border-radius:10px;}
.roll_page_content_all::-webkit-scrollbar-thumb:hover{background:#950204;}
}

/* 3-STEP GUIDE DESIGN (DESKTOP) */
.step-guide-section { padding: 40px 0; background: #f8f9fa; }
.step-grid { display: flex; justify-content: space-between; gap: 20px; }
.step-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 8px; padding: 25px; box-shadow: 0 4px 6px rgba(0,0,0,0.04); flex: 1; }
.step-card h3 { color: #b80707; font-size: 20px; margin-bottom: 15px; font-weight: bold; }
.step-card p { color: #444; font-size: 15px; line-height: 1.6; margin: 0; }
.play-curve {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  background: #000;
  color: #fff;
  border-radius: 20px;
  font-size: 14px;
  font-weight: 500;
}

.play-curve a {
  color: #fff;
  text-decoration: none;
}

.play-curve i {
  color: #fff;
  font-size: 17px;
}