/*
Theme Name: Yabooli
Text Domain: yabooli.com
Version: 1.0
Description:
Tags: blog, one-column, custom-background, custom-colors, custom-logo, custom-menu, editor-style, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-patterns, block-styles, wide-blocks, accessibility-ready
Author: Rede.vn
Author URI: https://rede.vn/
Theme URI: https://rede.vn/
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

*/
:root{--star-size:20px;--star-color:#ccc;--star-background:#fc0}
.Stars{--percent:calc(var(--rating) / 100 * 100%);display:inline-block;font-size:var(--star-size);font-family:Times;line-height:1}
.Stars::before{font-size:16px;content:'★★★★★';letter-spacing:0;background:linear-gradient(90deg,var(--star-background) var(--percent),var(--star-color) var(--percent));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.rating{display:flex;justify-content:left;align-items:center;height:auto}
.game_blog.style-top{color:#eee;margin:20px auto;font-size:17px}
.list-item{margin-top:10px;background:#282828;box-shadow:0 4px 5px 0 rgb(0 0 0 / 14%),0 1px 10px 0 rgb(0 0 0 / 12%),0 2px 4px -1px rgb(0 0 0 / 30%)}
.list-content{display:flex;position:relative;padding:8px}
#masthead .list-content{background:linear-gradient(90deg,rgba(100,149,237,1) 0%,rgba(157,30,4,1) 30%,rgba(99,17,0,1) 63%);border:1px solid #7d4410}
#masthead .list-item{margin-top:0}
#masthead .game_blog.style-top{margin:0}
#masthead a.odds-now{background:var(--main-color);color:#000}
.logo-brand{float:left;width:88px;margin-right:10px}
.logo-brand img{width:100%;border-radius:50%}
.top-info{width:150px;float:left;margin-right:10px}
.top-action{width:150px;float:right;margin-left:10px}
.gift-text{display:inline-block;width:calc(100% - 418px)}
.top-info span{display:block;font-size:14px}
.top-action a{display:block}
.top{position:absolute;top:0;left:0;width:25px;height:25px;background:#ccc;color:#000;border-radius:0 0 23px 0;padding-left:5px}
span.brand-name{font-size:23px;font-weight:bold}
a.odds-now,a.review{width:90%;padding:5px 0;text-decoration:none;text-align:center;margin:5px auto;border-radius:50px;font-weight:bold}
a.odds-now{background:var(--main-color);color:#fff;padding:7px 0}
a.review{border-color:#ccc;color:var(--main-color);font-weight:normal;border:none}
a.odds-now:hover{background:var(--main-color);color:#000}
a.review:hover{text-decoration:underline}
.gift-text span{display:block;text-align:center}
span.gift-number{font-size:20px;font-weight:bold;color:#09d025}
div.list-review{color:#000;padding:10px;border:1px solid #ccc;box-shadow:0 4px 5px 0 rgb(0 0 0 / 14%),0 1px 10px 0 rgb(0 0 0 / 12%),0 2px 4px -1px rgb(0 0 0 / 30%)}
.widget .list-content{height:220px}
.widget .gift-text{width:95%;position:absolute;bottom:5px;border-top:1px solid #cccccc5e}
.widget a.odds-now,.widget a.review{font-size:80%}
span.widget-title{color:var(--main-color);font-size:1.2rem;padding-bottom:0.3rem;margin:0.7rem 0;font-weight:600;text-transform:capitalize;border-bottom:2px var(--main-color) solid;display:block}
@media(min-width:850px){.widget .logo-brand{width:70px}
.widget span.brand-name{font-size:15px}
.widget .top-info span{font-size:14px}
.widget .gift-text span{font-size:15px}
.widget span.gift-number{font-size:16px}
.widget .top-action{width:120px}
}@media(max-width:570px){.list-content{height:189px}
.gift-text{width:95%;position:absolute;bottom:5px;border-top:1px solid #cccccc5e}
a.odds-now,a.review{font-size:80%}
.header-bottom .flex-row .flex-col:last-child{width:100%}
.header-bottom .flex-row .flex-col:last-child ul.header-bottom-nav,.header-bottom .flex-row .flex-col:last-child ul.header-bottom-nav li.html{display:block}
span.brand-name{font-size:20px}
.logo-brand{width:70px}
.top-info span{font-size:13px;line-height:20px}
.gift-text span{font-size:15px}
span.gift-number{font-size:18px}
.top-action{width:100px}
}