@import url(/default/fam3/assets/fonts/IRANSans-web.css); /* @import url(/default/fam3/assets/fonts/Dubai.css); */ @import url(/default/fam3/assets/fonts/font-awesome.min.css); @import url(/default/fam3/assets/fonts/SportsFont.css); .swal2-container { z-index: 9999990 !important; } * { font-family: 'IranSans', tahoma; } body { margin: 0px; font-weight: 300; background: var(--th-bg-page, #333); } *:not(input,textarea) { -webkit-touch-callout: none; -webkit-user-select: none; outline: none; direction: rtl; } * { font-family: 'IranSans', tahoma; box-sizing: border-box; font-style: normal; direction: rtl; } .hidden { display: none; } .left { float: right; } .right { float: left; } .clear { clear: both; height: 0px; } .left-align { text-align: right; } .right-align { text-align: left; } .inline { display: inline-block; } .center { text-align: center; } .pointer { cursor: pointer; } .medium { font-weight: 400; } .bold { font-weight: 500; } .fs0 { font-size: 0px; } .fs20 { font-size: 20px; } .m10 { margin: 10px; } .m15 { margin: 15px; } .m20 { margin: 20px; } .mt2 { margin-top: 2px; } .mt3 { margin-top: 3px; } .mt5 { margin-top: 5px; } .mt8 { margin-top: 8px; } .mt10 { margin-top: 10px; } .mt15 { margin-top: 15px; } .mt20 { margin-top: 20px; } .mt30 { margin-top: 30px; } .mb5 { margin-bottom: 5px; } .mb10 { margin-bottom: 10px; } .mb20 { margin-bottom: 20px; } .mr10 { margin-right: 10px; margin-left: 10px; } .mr20 { margin-right: 20px; margin-left: 20px; } .mr40 { margin-right: 40px; margin-left: 40px; } .ml5 { margin-right: 5px; } .ml10 { margin-right: 10px; } .ml15 { margin-right: 15px; } .p15 { padding: 15px; } .p30 { padding: 30px; } .ph15 { width: 100%; height: 10px; } .ph25 { width: 100%; height: 25px; } .pr10 { padding-right: 10px; padding-left: 10px; } .w100 { width: 100%; } .mw160 { min-width: 160px; } .c-red { color: red !important; } .c-green { color: green !important; } .c-blue { color: blue !important; } .c-gray { color: var(--th-bg-surface-2, #383838) !important; } .c-main { color: var(--th-accent, #ffd33b) !important;} .c-white { color: var(--th-text-primary, #fff) !important;} .c-orange { color: var(--th-accent, #ffd33b) !important;} .fs12 { font-size: 12px; } .fs14 { font-size: 14px; } .fs16 { font-size: 16px !important; } .ts { text-shadow: 2px 2px var(--th-black, #000000); } .tdn { text-decoration: none; } .text-content-page { color: var(--th-text-primary, #fff) !important; line-height: 170%; } .text-content-page p { color: var(--th-text-primary, #fff) !important; line-height: 170%; } .text-content-page a { color: var(--th-accent, #ffd33b) !important; text-decoration: none; } .text-content-page a:hover { text-decoration: underline; } .container { width: 100%; } .header-top { background: var(--th-bg-chrome, #000); padding-bottom: 0px; } .header { text-align: center; } .header .name { display: inline-block; font-size: 14px; color: var(--th-text-muted, #acacac); padding: 7px 4px 7px 4px; text-decoration: none; margin-top: 8px; font-weight: 300; } .header .balance { display: inline-block; font-size: 14px; color: var(--th-accent-2, #ffcb39); padding: 7px 4px 7px 4px; text-decoration: none; margin-top: 8px; font-weight: 400; } .header .account { display: inline-block; color: var(--th-text-primary, #fff); padding: 7px 8px 7px 8px; text-decoration: none; margin-top: 8px; font-weight: 400; } .header .link { display: inline-block; color: var(--th-accent-deep, #ffba00); padding: 7px 20px 7px 20px; font-size: 14px; text-decoration: none; margin: 8px 4px 0px 4px; font-weight: 400; } .header .login { background: var(--th-bg-surface, #0e0e0e); color: var(--th-text-primary, #fff); border: 2px solid var(--th-text-dim, #7a7a7a); padding: 5px 20px 5px 20px; font-weight: 500; border-radius: 4px; margin: 8px 2px 0px 2px; font-size: 14px; } .header .signup { background: var(--th-accent-2, #ffcb39); color: var(--th-bg-chrome, #000); font-weight: 500; border-radius: 4px; padding: 6px 20px 6px 20px; font-size: 14px; margin: 8px 2px 0px 2px; } .header .language { color: var(--th-text-primary, #fff) !important; border: 0px solid var(--th-text-primary, #fff); padding: 8px 10px 8px 10px !important; } .header .signup:hover { color: var(--th-text-dim, #7a7a7a); } .header .login:hover { color: var(--th-text-dim, #7a7a7a); } .header .text-link { color: var(--th-text-muted, #acacac); font-size: 13px; font-weight: 400; text-decoration: none; padding-left: 10px; } .header .text-link:hover { color: var(--th-text-primary, #fff); } .header .language-selector { direction: ltr; display: none; } .header .language-caret { color: var(--th-text-primary, #fff); padding-top: 20px; cursor: pointer; margin-right: -8px; } .header .language-box { position: absolute; direction: rtl; margin-top: 40px; margin-left: 15px; z-index: 999; } .header .language-box a { display: block; text-decoration: none; } .header .language-box a:hover { color: var(--th-accent-deep, #ffba00); } .header .language-box img { display: block; } .header-sub { background: var(--th-bg-surface, #0e0e0e); width: 100%; height: 40px; border-top: 1px solid var(--th-bg-page, #333); text-align: right; } .header-sub .litem { display: inline-block; line-height: 40px; height: 38px; font-size: 14px; font-weight: 400; color: var(--th-text-muted, #acacac); text-decoration: none; padding: 0px 20px; } .header-sub .litem:hover, .header-sub .liact { border-bottom: 2px solid var(--th-accent-2, #ffcb39); color: var(--th-text-primary, #fff); } .header-main-center { background: var(--th-bg-chrome, #000); } .footer { width: 100%; background: var(--th-bg-surface, #0e0e0e); color: var(--th-text-muted, #acacac); text-align: center; padding: 20px 0px 20px 0px; font-size: 14px; } .footer-links { width: 100%; background: var(--th-bg-chrome, #000); text-align: center; color: var(--th-text-muted, #acacac); padding: 20px 0px 20px 0px; font-size: 14px; } .footer-links .footer-link { display: block; text-decoration: none; color: var(--th-text-muted, #acacac); margin-bottom: 4px; text-align: right; font-size: 12px; font-weight: 400; } .footer-links .footer-link:hover { color: var(--th-text-primary, #fff); } .footer-links .footer-link::before { content: "\2022 "; } .header-wrapper { display: flex; } .top-bar-wrapper { position: relative; height: auto; padding-bottom: 0px; width: 100%; overflow: hidden; } .top-bar { text-align: center; background: var(--th-bg-chrome, #000); font-size: 0; white-space: nowrap; position: absolute; bottom: 10px; } .top-bar a { text-align: center; text-decoration: none; color: var(--th-text-primary, #fff); font-size: 14px; font-weight: 400; display: inline-block; padding: 0px 15px 0px 15px; vertical-align:top; } .top-bar a:hover, .top-bar .active { color: var(--th-accent, #ffd33b); } .top-bar .live-tab { color: red !important; } .main-splash { width: 100%; font-size: 0; } .main-splash .image-container { width: 100%; height: 660px; overflow: hidden; white-space: nowrap; } .main-splash .image-container .image { width: 100%; height: 100%; display: inline-block; background-size: cover; background-position: center; background-repeat: no-repeat; } .main-splash .image-shadow { position: relative; width: 100%; height: 250px; margin-top: -250px; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.53) 10%, rgba(0,0,0,0.61) 36%, rgba(0,0,0,0.63) 45%, rgba(0,0,0,0.69) 69%, rgba(0,0,0,1) 96%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.53) 10%,rgba(0,0,0,0.61) 36%,rgba(0,0,0,0.63) 45%,rgba(0,0,0,0.69) 69%,rgba(0,0,0,1) 96%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.53) 10%,rgba(0,0,0,0.61) 36%,rgba(0,0,0,0.63) 45%,rgba(0,0,0,0.69) 69%,rgba(0,0,0,1) 96%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='var(--th-black, #000000)',GradientType=0 ); } .main-splash .box-container { position: relative; width: 100%; height: 180px; margin-top: -180px; } .main-splash .border-box { margin-right: 4%; width: 28%; height: 100%; float: right; display: block; text-align: center; white-space: nowrap; overflow: hidden; text-decoration: none; background: rgba(0,0,0,0.5); border-width: 1px; border-style: solid; border-color: #ececec; -moz-border-image: -moz-linear-gradient(top,var(--th-text-primary, #fff) 0%,var(--th-black, #000000) 70%); -webkit-border-image: -webkit-linear-gradient(top,var(--th-text-primary, #fff) 0%,var(--th-black, #000000) 70%); border-image: linear-gradient(to bottom,var(--th-text-primary, #fff) 0%,var(--th-black, #000000) 70%); border-image-slice: 1; color: var(--th-text-primary, #fff); } .main-splash .border-box .image { margin-top: 5px; } .main-splash .border-box .title { margin-top: 5px; color: var(--th-text-primary, #fff); font-size: 26px; text-shadow: 2px 2px var(--th-black, #000000); height: 34px; font-weight: 400; } .main-splash .border-box .subtitle { margin-top: 7px; color: var(--th-text-primary, #fff); font-size: 14px; } .main-splash .border-box:hover .title { font-size: 28px; font-weight: 500; } .main-games-box { width: 100%; background: var(--th-bg-chrome, #000); padding-bottom: 10px; padding-top: 10px; } .main-games-box .game { float: right; display: block; width: 16%; margin-right: 0.6%; text-decoration: none; } .main-games-box .game img { width: 100%; } .main-games-box .game .title { /*display: none;*/ position: relative; height: 100%; padding: 10px 0px 10px 0px; margin-top: -40px; width: 100%; text-align: center; background: rgba(255,187,2,0.2); font-size: 16px; color: var(--th-text-primary, #fff); } .main-games-box .game:hover .title { display: block; } .light { } .dark { } .page-content { width: 100%; min-height: 600px; text-align: center; } .page-content .page-area { margin: 5px 0px 5px 0px; text-align: right; } .page-content .page-area .page-title { text-align: right; color: var(--th-accent, #ffd33b); background: var(--th-bg-chrome, #000); padding: 10px; font-size: 18px; font-weight: 400; border-bottom: 1px solid var(--th-bg-page, #333); } .item-box { display: block; float: right; width: 32%; margin-right: 1%; margin-bottom: 10px; overflow: hidden; text-decoration: none; } .item-2-box { display: block; float: right; width: 49%; margin-right: 1%; margin-bottom: 10px; overflow: hidden; text-decoration: none; } .item-box .image, .item-2-box .image { width: 100%; position: relative; padding-top: 56.25%; background-position: center; background-size: cover; } .item-box .title, .item-2-box .title { position: relative; height: 0px; width: 100%; } .item-box .title div, .item-2-box .title div { color: var(--th-border, #ccc); height: 36px; background: var(--th-bg-chrome, #000); position: relative; top: -36px; line-height: 36px; text-align: center; font-size: 16px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-top: 1px solid var(--th-bg-page, #333); } .item-box:hover .title div, .item-2-box:hover .title div { font-size: 18px; color: var(--th-text-primary, #fff); } .static-menu { width: 250px; } .static-menu .link-container { padding: 0px; margin-top: 5px; margin-bottom: 20px; margin-left: 10px; margin-right: 10px; background: var(--th-bg-surface, #0e0e0e); } .static-menu .link-container a { color: var(--th-text-primary, #fff); display: block; text-align:center; text-decoration: none; padding: 13px 0px 13px 0px; border-bottom: 1px solid var(--th-bg-page, #333); margin: 0px; font-size: 14px; font-weight: 500; } .static-menu .link-container a:last-child { border-bottom: 0px; } .static-menu .link-container a:hover, .static-menu .link-container .active { color: var(--th-text-primary, #fff); background: var(--th-bg-chrome, #000); } .static-menu .selector { width: 100%; font-size: 20px; } .static-content { width: calc(100% - 260px); } .form-container { background: var(--th-bg-surface, #0e0e0e); } .form-container .alert { display: none; margin-top: 0px; margin-bottom: 15px; background: var(--th-danger, #e74c3c); padding: 10px; color: var(--th-text-primary, #fff); text-align: center; font-weight: 400; } .form-container .form-title { font-weight: 300; font-size: 16px; margin: 8px 20px 8px 20px; color: var(--th-text-muted, #acacac); } .form-container .form-element { width: 400px; font-size: 14px; text-align: right; color: var(--th-text-muted, #acacac); } .form-container .form-input { width: 100%; background: var(--th-text-primary, #fff); height: 32px; border: 1px solid #202a47; color: #202a47; padding: 6px 6px 6px 6px; } .form-container .form-link { color: var(--th-text-muted, #acacac); text-decoration: none; font-size: 12px; } .form-container .form-link:hover { color: var(--th-text-primary, #fff); } .form-container .form-button { background: var(--th-accent, #ffd33b); border-radius: 4px; display: inline-block; color: var(--th-bg-chrome, #000); padding: 7px 20px 7px 20px; text-decoration: none; font-weight: 500; } .form-container .form-button:hover { color: var(--th-text-dim, #7a7a7a); } .form-container .red-button { background: var(--th-danger, #e74c3c) !important; } .form-container .form-loading { display: none; width: 126px; height: 22px; background: url(/default/fam3/assets/images/loader.gif) no-repeat; background-position: center; } .left-bar { color: var(--th-text-primary, #fff); width: 300px; margin: 0px 10px 0px 10px; } .left-bar .title { display: block; text-decoration: none; text-align: right; color: var(--th-accent, #ffd33b); background: var(--th-bg-chrome, #000); padding: 14px; font-size: 14px; font-weight: 400; } .left-bar .menu-container { width: 100%; padding-bottom: 0.1px; background: var(--th-bg-surface, #0e0e0e); } .left-bar .menu-container .link { display: block; width: 100%; padding: 10px 10px 8px 10px; text-decoration: none; font-size: 14px; font-weight: 400; color: var(--th-text-primary, #fff); border-top: 1px solid var(--th-bg-page, #333); } .left-bar .menu-container .link .badge { font-size: 10px; padding: 1px 8px 1px 8px; background: #808080; color: var(--th-text-primary, #fff); border-radius: 4px; font-weight: 500; margin: 2px 8px 0px 8px; } .left-bar .menu-container .link:hover, .left-bar .menu-container .active { color: var(--th-text-primary, #fff) !important; background: var(--th-bg-chrome, #000) !important; } .left-bar .menu-container .search { display: block; width: calc(100% - 2px); margin-right: 2px; margin-bottom: 2px; padding: 5px 10px 5px 10px; background: var(--th-border-soft, #ddd); text-decoration: none; font-size: 14px; font-weight: 400; color: var(--th-bg-chrome, #000); } .left-bar .menu-container .search input { width: 100%; font-size: 18px; } .left-bar .menu-container .icon { min-width: 16px; min-height: 16px; } .right-bar { color: var(--th-text-primary, #fff); width: 350px; margin: 0px 10px 0px 10px; } .right-bar .title { display: block; text-decoration: none; text-align: right; color: var(--th-accent, #ffd33b); background: var(--th-bg-chrome, #000); padding: 14px; font-size: 14px; font-weight: 400; border-bottom: 1px solid #202a47; } .game-container { width: 100%; height: 700px; background: var(--th-slip-bg, #17191f); overflow: hidden; } .game-place { width: 100%; height: 700px; border: 0px; padding: 0px; margin: 0px; } .search-div { background: var(--th-bg-chrome, #000); margin-top: 5px; padding: 8px; padding-top: 10px; margin: 10px; margin-bottom: 0px; } .search-div span { font-size: 20px; color: var(--th-text-muted, #acacac); } .search-div input { border: 0px; background: var(--th-bg-chrome, #000); color: var(--th-text-muted, #acacac); outline: none; margin-right: 10px; margin-left: 10px; width: calc(100% - 60px); font-size: 16px; } .event-container { width: calc(100% - 690px); margin: 0px; margin-top: 5px; } .event-container .border { background: var(--th-bg-page, #333); color: var(--th-bg-chrome, #000); } .event-container .info { width: 100%; min-height: 150px; background-size: cover; background-position: center; } .event-container .football { background-image: url(/default/fam3/assets/images/courts/football.png); } .event-container .other-sport { background-image: url(/default/fam3/assets/images/courts/basketball.png); } .event-container .title { width: 100%; color: var(--th-text-primary, #fff); text-align: center; font-weight: 400; padding: 15px 0px 14px 0px; border-bottom: 1px solid var(--th-bg-page, #333); font-size: 14px; } .event-container .block { display: block; text-decoration: none; text-align: right; color: var(--th-text-primary, #fff); background: var(--th-bg-chrome, #000); padding: 10px; font-size: 14px; font-weight: 400; border-bottom: 1px solid var(--th-bg-page, #333); } .event-container .categories { display: block; width: 100%; background: var(--th-bg-surface, #0e0e0e); border-bottom: 1px solid var(--th-bg-page, #333); overflow-x: auto; overflow-y: hidden; white-space: nowrap; height: 69px; font-size: 0px; } .event-container .categorie { display: inline-block; min-width: 60px; padding: 10px; color: var(--th-text-muted, #acacac); text-align: center; text-decoration: none; font-size: 28px; } .event-container .categorie:hover, .event-container .scategory { color: var(--th-text-primary, #fff); border-bottom: 2px solid var(--th-accent, #ffd33b); } .event-container .categorie .name { font-size: 9px; margin-top: 4px; } .event-container .score-box { margin-right: 5px; width: 60px; height: 50px; line-height: 50px; border: 1px solid var(--th-bg-dark, #111); color: var(--th-text-primary, #fff); font-size: 26px; font-weight: 500; } .event-container .score-box .line-1 { position: relative; margin-top: -24px; height: 4px; border-top: 1px solid rgba(0,0,0,0.25); border-right: 1px solid var(--th-text-primary, #fff); border-left: 1px solid var(--th-text-primary, #fff); } .event-container .score-box .line-2 { position: relative; margin-top: -7px; height: 4px; border-right: 1px solid var(--th-text-primary, #fff); border-left: 1px solid var(--th-text-primary, #fff); } .event-container .football .card { display: inline-block; width: 12px; height: 18px; border: 1px solid var(--th-bg-chrome, #000); background: yellow; border-radius: 3px; } .event-container .football .red { background: red !important; } .event-container .football .team { padding: 10px; margin-right: 5px; width: calc(50% - 88px); height: 70px; border: 1px solid var(--th-bg-surface-2, #383838); color: var(--th-text-primary, #fff); font-size: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .event-container .football .score { width: 160px; } .event-container .football .score-middle { width: 25px !important; } .event-container .football .time { margin-right: 5px; margin-top: 5px; margin-bottom: 10px; width: 155px; border: 1px solid var(--th-bg-dark, #111); line-height: 30px; background: rgba(32,42,71,0.5); font-weight: 500; font-size: 14px; color: var(--th-text-primary, #fff); } .event-container .football .time .minute { color: var(--th-cta, #e9a025); font-weight: 500; } .event-container .others .wi-1 { width: calc(100% - 70px); } .event-container .others .wi-2 { width: calc(100% - 135px); } .event-container .others .wi-3 { width: calc(100% - 200px); } .event-container .others .wi-4 { width: calc(100% - 265px); } .event-container .others .wi-5 { width: calc(100% - 330px); } .event-container .others .wi-6 { width: calc(100% - 395px); } .event-container .others .wi-7 { width: calc(100% - 460px); } .event-container .others .wi-8 { width: calc(100% - 525px); } .event-container .others .others-container { min-width: 70%; } .event-container .others .team { height: 50px; line-height: 50px; border: 1px solid var(--th-bg-chrome, #000); font-weight: 500; color: var(--th-text-primary, #fff); font-size: 20px; padding: 0px 10px 0px 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .event-container .others .orange { color: var(--th-cta, #e9a025); } .event-container .others .time { padding: 0px 5px 0px 5px; border: 1px solid var(--th-bg-dark, #111); line-height: 30px; background: rgba(32,42,71,0.5); font-weight: 500; font-size: 14px; color: var(--th-text-primary, #fff); } .event-container .others .time .minute { color: var(--th-cta, #e9a025); font-weight: 500; } .event-container .others .score-head { margin-right: 5px; width: 60px; line-height: 30px; background: rgba(0,0,0,0.5); font-weight: 500; font-size: 14px; color: var(--th-cta, #e9a025); } .event-container .title-bg { background: var(--th-bg-chrome, #000); } .event-container .team-bg { background: -moz-linear-gradient(top, rgba(0,0,0,0.7) 0%, rgba(112,112,112,0.7) 47%, rgba(0,0,0,0.7) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0.7) 0%,rgba(112,112,112,0.7) 47%,rgba(0,0,0,0.7) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.7) 0%,rgba(112,112,112,0.7) 47%,rgba(0,0,0,0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000',GradientType=0 ); } .event-container .score-bg { background: -moz-linear-gradient(top, rgba(0,0,0,0.9) 0%, rgba(112,112,112,0.9) 47%, rgba(0,0,0,0.9) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0.9) 0%,rgba(112,112,112,0.9) 47%,rgba(0,0,0,0.9) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.9) 0%,rgba(112,112,112,0.9) 47%,rgba(0,0,0,0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6000000', endColorstr='#e6000000',GradientType=0 ); } .event-type .title { display: block; text-decoration: none; text-align: right; color: var(--th-text-primary, #fff); padding: 10px; font-size: 14px; font-weight: 300; } .event-type .title .text { float: right; margin-right: 3px; width: calc(100% - 221px); padding: 0px; background-repeat: no-repeat; background-position: 0px center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .event-type .title .text span { display: inline-block; } .event-type .title .yellow { color: var(--th-accent, #ffd33b); font-weight: 300; padding: 0px 4px 0px 4px; } .event-type .title .odd-title { float: right; margin-right: 3px; width: 60px; font-size: 14px; color: var(--th-text-muted, #acacac); font-weight: 500; text-align: center; } .event-type .odd-container { padding-bottom: 6px; color: var(--th-bg-chrome, #000); font-size: 14px; } .event-type .odd-container .score { min-width: 20px; text-align: left; margin: 0px 5px 0px 5px; color: green; font-weight: 500; } .event-type .odd-container .green { color: green; font-weight: 500; } .event-type .odd-container .event-title { float: right; display: block; text-decoration: none; color: var(--th-text-primary, #fff); width: calc(100% - 231px); padding: 0px 10px 0px 5px; margin-top: 1px; margin-bottom: 1px; font-weight: 400; background-repeat: no-repeat; background-position: 5px center; margin-right: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .event-type .odd-container .event-time { color: var(--th-text-muted, #acacac); font-size: 10px; font-weight: 300; height: 20px; line-height: 20px; margin: 5px 30px 0px 8px; } .event-type .odd-container .odd-rate { display: block; float: right; text-decoration: none; width: 60px; height: 40px; line-height: 40px; margin-right: 3px; background: var(--th-bg-page, #333); color: var(--th-text-primary, #fff); text-align: center; margin-top: 1px; margin-bottom: 1px; font-weight: 500; font-size: 12px; } .event-type .odd-container .odd-rate:hover { background: var(--th-bg-chrome, #000); } .event-type .odd-container .passive { opacity: 0.45; filter: alpha(opacity=45); cursor: not-allowed; color: var(--th-text-primary, #fff); } .event-type .odd-container .passive-ev { opacity: 0.45; filter: alpha(opacity=45); cursor: not-allowed; color: var(--th-text-primary, #fff); } .event-type .odd-container .passive-ma { opacity: 0.45; filter: alpha(opacity=45); cursor: not-allowed; color: var(--th-text-primary, #fff); } .event-type .odd-container .odd-all { display: block; float: right; text-decoration: none; width: 30px; height: 40px; line-height: 40px; margin-right: 3px; text-align: center; margin-top: 1px; margin-bottom: 1px; font-weight: 500; color: var(--th-text-muted, #acacac); } .event-type .odd-container .selected-odd { color: var(--th-text-primary, #fff); background: var(--th-bg-chrome, #000) !important; cursor: default !important; } .event-type .odd-container .passive:hover { background: var(--th-bg-page, #333); } .event-type .odd-container .passive-ev:hover { background: var(--th-bg-page, #333); } .event-type .odd-container .passive-ma:hover { background: var(--th-bg-page, #333); } .event-type .odd-container .red-arrow { color: red !important; position: absolute; font-size: 24px; margin-top: -9px; } .event-type .odd-container .red-back i { display: none; } .event-type .odd-container .green-arrow { color: green !important; position: absolute; font-size: 24px; margin-top: 22px; } .event-type .odd-container .green-back i { display: none; } .event-type .odd-container .passive .red-arrow { color: var(--th-bg-chrome, #000) !important; } .event-type .odd-container .passive .green-arrow { color: var(--th-bg-chrome, #000) !important; } .event-type .odd-container .passive-ev .red-arrow { color: var(--th-bg-chrome, #000) !important; } .event-type .odd-container .passive-ev .green-arrow { color: var(--th-bg-chrome, #000) !important; } .event-type .odd-container .passive-ma .red-arrow { color: var(--th-bg-chrome, #000) !important; } .event-type .odd-container .passive-ma .green-arrow { color: var(--th-bg-chrome, #000) !important; } .events-holder { display: block; width: 100%; background: var(--th-bg-surface, #0e0e0e); border-top: 1px solid var(--th-bg-surface, #0e0e0e); color: var(--th-text-muted, #acacac); } .events-holder .show-all { border-top: 1px solid var(--th-bg-page, #333); padding: 15px 0px; font-size: 13px; text-align: center; font-weight: 400; } .events-holder .show-all a { color: var(--th-text-muted, #acacac); text-decoration: none; } .event-type .event-row { padding-bottom: 10px; border-top: 1px solid var(--th-bg-page, #333); } .event-type .event-odds { display: block; margin-top: 19px; } .rear-menu-side .event-odds { width: 100%; float: right; } .rear-menu-side .odd-rate { width: calc(33.3% - 4px) !important; height: 25px !important; line-height: 25px !important; } .rear-menu-side .odd-container .red-arrow { margin-right: 15px; } .rear-menu-side .odd-container .green-arrow { margin-top: 7px !important; margin-right: 15px; } .sport-live-container .active div { color: var(--th-accent, #ffd33b) !important; font-style: italic !important; } .sport-live-container .sport-categories-left-link:hover div { color: var(--th-accent, #ffd33b) !important; font-style: italic !important; } .sport-live-container .odd-container { padding-bottom: 0px !important; } .sport-live-container .event-row { padding-bottom: 5px !important; background: var(--th-accent-soft, #fff7db) !important; } .sport-live-container .event-title { width: 100% !important; padding: 0px 5px !important; margin: 0px !important; margin-top: 10px !important; } .sport-live-container .home-team { width: calc(50% - 27px) !important; color: var(--th-bg-chrome, #000) !important; text-align: left !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } .sport-live-container .away-team { width: calc(50% - 27px) !important; color: var(--th-bg-chrome, #000) !important; text-align: right !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } .sport-live-container .score { margin: 0px !important; width: 25px !important; min-width: 25px !important; text-align: center !important; } .sport-live-container .score-seperator { width: 4px !important; min-width: 4px !important; } .sport-live-container .event-odds { margin-top: 5px !important; } .score-type .title { display: block; text-decoration: none; text-align: right; color: var(--th-accent, #ffd33b); padding: 10px 9px 10px 9px;; font-size: 14px; font-weight: 300; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .score-type .title .text { float: right; margin-right: 10px; padding: 0px; background-repeat: no-repeat; background-position: 0px center; } .score-type .title .text span { display: inline-block; } .score-type .title .yellow { color: var(--th-accent, #ffd33b); font-weight: 300; } .score-type .title .odd-title { float: right; margin-right: 1px; width: 80px; font-size: 14px; color: var(--th-text-primary, #fff); font-weight: 500; text-align: center; } .score-type .score-container { padding-bottom: 6px; color: var(--th-text-muted, #acacac); font-size: 14px; border-top: 1px solid var(--th-bg-page, #333); } .score-type .score-container .team { float: right; border-left: 0px solid var(--th-border, #ccc); width: calc(50% - 150px); padding: 0px 9px 0px 9px; height: 30px; line-height: 30px; margin-top: 0px; margin-bottom: 0px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .score-type .score-container .score { float: right; color: var(--th-accent, #ffd33b); border-left: 0px solid var(--th-border, #ccc); text-align: center; width: 50px; height: 30px; line-height: 30px; margin-top: 0px; margin-bottom: 0px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .score-type .score-container .status { float: right; color: var(--th-text-primary, #fff); border-left: 0px solid var(--th-border, #ccc); text-align: center; width: 100px; height: 30px; line-height: 30px; margin-top: 0px; margin-bottom: 0px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .score-type .score-container .time { float: right; color: var(--th-accent, #ffd33b); text-align: center; width: 100px; height: 30px; line-height: 30px; margin-top: 0px; margin-bottom: 0px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .score-type .score-container .score-row:nth-child(odd) { } .score-type .score-container .score-row:nth-child(even) { } .market-types { background: var(--th-bg-surface, #0e0e0e); } .market-type .title { display: block; text-decoration: none; text-align: right; color: var(--th-accent, #ffd33b); border-bottom: 1px solid var(--th-bg-page, #333); padding: 10px; font-size: 14px; font-weight: 400; } .market-type .odd-container { color: var(--th-text-primary, #fff); font-size: 14px; padding-bottom: 6px; } .market-type .odd-container .odd-double { width: 50%; } .market-type .odd-container .odd-triple { width: 33.33%; } .market-type .odd-container .odd-link { float: right; display: block; text-decoration: none; color: var(--th-text-primary, #fff); } .market-type .odd-container .odd-link .odd-title { float: right; width: calc(100% - 64px); margin-top: 2px; margin-right: 2px; height: 30px; line-height: 30px; padding: 0px 10px; font-weight: 400; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .market-type .odd-container .odd-link .odd-line { display: inline-block; background: green; border-radius: 4px; padding: 1px 8px 1px 8px; height: 20px; line-height: 20px; color: var(--th-text-primary, #fff); font-size: 10px; font-weight: 500; margin: 0px 8px 0px 8px; } .market-type .odd-container .odd-link .odd-rate { float: right; width: 60px; height: 30px; margin-top: 2px; margin-left: 2px; line-height: 30px; background: var(--th-bg-page, #333); color: var(--th-text-primary, #fff); text-align: center; font-size: 12px; font-weight: 500; } .market-type .odd-container .odd-link .odd-rate::after { clear: both; height: 0px; } .market-type .odd-container .odd-link:hover { } .market-type .odd-container .odd-link:hover .odd-title { background: var(--th-bg-page, #333); } .market-type .odd-container .odd-link:hover .odd-rate { background: var(--th-bg-page, #333); color: var(--th-text-primary, #fff); } .market-type .odd-container .passive-link { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; } .market-type .odd-container .passive-link .odd-title { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; background: var(--th-bg-surface, #0e0e0e) !important; } .market-type .odd-container .passive-link .odd-line { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; } .market-type .odd-container .passive-link-ev { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; } .market-type .odd-container .passive-link-ev .odd-title { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; background: var(--th-bg-surface, #0e0e0e) !important; } .market-type .odd-container .passive-link-ev .odd-line { opacity: 0.35; filter: alpha(opacity=35); cursor: default !important; } .market-type .odd-container .passive-link-ma { opacity: 0.35; filter: alpha(opacity=35); } .market-type .odd-container .passive-link-ma .odd-title { opacity: 0.35; filter: alpha(opacity=35); background: var(--th-bg-surface, #0e0e0e) !important; } .market-type .odd-container .passive-link-ma .odd-line { opacity: 0.35; filter: alpha(opacity=35); } .market-type .odd-container .passive { opacity: 0.35; filter: alpha(opacity=35); color: var(--th-bg-chrome, #000); } .market-type .odd-container .passive-ev { opacity: 0.35; filter: alpha(opacity=35); color: var(--th-bg-chrome, #000); } .market-type .odd-container .passive-ma { opacity: 0.35; filter: alpha(opacity=35); color: var(--th-bg-chrome, #000); } .market-type .odd-container .red-arrow { color: red !important; position: absolute; font-size: 24px; margin-top: -8px; } .market-type .odd-container .red-back i { display: none; } .market-type .odd-container .green-arrow { color: green !important; position: absolute; font-size: 24px; margin-top: 12px; } .market-type .odd-container .green-back i { display: none; } .market-type .odd-container .passive .red-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .passive .green-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .passive-ev .red-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .passive-ev .green-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .passive-ma .red-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .passive-ma .green-arrow { color: var(--th-bg-chrome, #000) !important; } .market-type .odd-container .selected-odd { } .market-type .odd-container .selected-odd .odd-rate { background: var(--th-bg-chrome, #000) !important; color: var(--th-text-primary, #fff) !important; cursor: default !important; } .market-type .odd-container .selected-odd .odd-title { color: var(--th-text-primary, #fff) !important; background: var(--th-bg-chrome, #000) !important; cursor: default !important; } .data-table { width: 100%; border-collapse: collapse; font-size: 14px; } .data-table td, .data-table th { padding: 8px 5px; color: var(--th-accent, #ffd33b); } .data-table th { border-bottom: 1px solid var(--th-border, #ccc); } .data-table tbody tr:nth-child(odd) td { background: #efefef; color: var(--th-bg-chrome, #000); } .data-table tbody tr:nth-child(even) td { background: var(--th-text-primary, #fff); color: var(--th-bg-chrome, #000); } .data-table a { text-decoration: none; color: #8e710b; } .data-table a:hover { text-decoration: underline; } .data-table .s-waiting { color: blue !important; } .data-table .s-answered { color: green !important; } .data-table .s-closed { color: var(--th-bg-surface-2, #383838) !important; } .data-table .sub-row { background: var(--th-text-primary, #fff) !important; padding: 0px; } .data-table .active-row td { background: var(--th-accent, #ffd33b) !important; color: var(--th-bg-chrome, #000) !important; } .data-sub-container { border-top: 4px solid var(--th-accent, #ffd33b); border-bottom: 4px solid var(--th-bg-surface, #0e0e0e); padding-top: 8px; padding-bottom: 8px; } .data-sub-table { width: 100%; border-collapse: collapse; font-size: 12px; } .data-sub-table td, .data-sub-table th { padding: 8px 5px; color: var(--th-bg-surface, #0e0e0e); background: var(--th-text-primary, #fff) !important; } .data-sub-table th { border-bottom: 1px solid var(--th-border, #ccc); } .data-sub-table tbody td { background: #fbf0f9; } .data-sub-table .badge { background: green; padding: 0px 6px; border-radius: 4px; color: var(--th-text-primary, #fff); font-size: 10px; } .pagination { margin-top: 15px; } .pagination a { display: inline-block; min-width: 30px; text-align: center; font-size: 14px; font-weight: 400; text-decoration: none; margin: 3px; border: 1px solid var(--th-border, #ccc); color: var(--th-accent, #ffd33b); padding: 5px; } .pagination a:hover, .pagination .active { background: #fbf0f9 !important; color: var(--th-bg-chrome, #000); } .pagination .info { display: inline-block; font-size: 14px; color: var(--th-text-muted, #acacac); font-weight: 400; margin: 0px 10px; } .support-container .bubble { max-width: 80%; min-width: 30%; padding: 10px; border-radius: 10px; margin: 4px; color: var(--th-bg-chrome, #000); font-weight: 400; font-size: 14px; line-height: 160%; } .support-container .user_bubble .icon { float: left; width: 45px; height: 45px; background: url(/default/fam3/assets/images/member.png); } .support-container .user_bubble .bubble { float: left; background: #9fd8a4; text-align: left; } .support-container .user_bubble .time { clear: both; margin-left: 55px; text-align: left; font-size: 12px; color: #567558; } .support-container .admin_bubble .icon { float: right; width: 45px; height: 45px; background: url(/default/fam3/assets/images/agent.png); } .support-container .admin_bubble .bubble { float: right; background: #e6e6e6; text-align: right; } .support-container .admin_bubble .time { clear: both; margin-right: 55px; text-align: right; font-size: 12px; color: #a7a7a7; } .slip-container { width: 100%; background: var(--th-accent, #ffd33b); padding-top: 2px; padding-bottom: 2px; color: #222; font-weight: 400; } .slip-container .no-bet { text-align: center; padding: 10px 30px; line-height: 160%; font-size: 14px; } .slip-container .amounts { width: 100%; background: var(--th-accent-soft, #fff7db); color: var(--th-bg-chrome, #000); font-weight: 500; padding: 10px 0px; text-align: center; line-height: 160%; } .slip-container .buttons { width: 100%; padding: 15px 0px; background: var(--th-accent, #ffd33b); text-align: center; } .slip-container .buttons .checkbox { margin-bottom: 15px; font-size: 14px; } .slip-container .buttons .slip-currency { font-size: 14px; color: var(--th-bg-chrome, #000); font-weight: 500; } .slip-container .buttons .slip-currency-type { font-size: 14px; } .slip-container .form-button { border-radius: 6px; border: 1px solid var(--th-success, #00b24f); background: var(--th-success, #00b24f); display: inline-block; color: var(--th-text-primary, #fff); padding: 7px 20px 7px 20px; text-decoration: none; font-weight: 400; } .slip-container .form-button:hover { color: #4b0242; background: var(--th-text-primary, #fff); } .slip-container .red-button { border: 1px solid red; color: var(--th-text-primary, #fff); background: red !important; } .slip-container .red-button:hover { color: red !important; background: var(--th-text-primary, #fff) !important; } .slip-container .form-loading { display: none; width: 43px; height: 30px; background: url(/default/fam3/assets/images/loader.gif) no-repeat; background-position: center; } .slip-container .slip-title { float: right; display: block; text-decoration: none; width: 50%; color: #a28636; border-bottom: 2px solid var(--th-accent, #ffd33b); text-align: center; font-weight: 300; font-size: 16px; padding: 10px 0px; } .slip-container .slip-active { color: var(--th-bg-chrome, #000) !important; border-bottom: 2px solid var(--th-bg-chrome, #000) !important; font-weight: 500; } .slip-container .amount-input { width: 100%; background: var(--th-accent, #ffd33b); padding: 10px 5px 1px 5px; } .slip-container .amount-input .text { float: right; width: 50%; text-align: right; padding-left: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 14px; padding-top: 2px; } .slip-container .amount-input .amount { float: left; width: 50%; } .slip-container .amount-input .amount input { width: 100%; font-size: 14px; border: 1px solid var(--th-slip-input, #27585A); } .slip-container .amount-input .total-rate { text-align: left; padding-left: 4px; margin-bottom: 4px; font-weight: 400; font-size: 12px; color: var(--th-bg-chrome, #000); } .slip-container .slip-event { border-bottom: 1px dotted var(--th-bg-surface-2, #383838); background: var(--th-accent-soft, #fff7db); } .slip-container .slip-remove { float: left; width: 30px; margin-top: 9px; text-align: left; padding-left: 9px; } .slip-container .slip-remove a { text-decoration: none; color: var(--th-danger, #e74c3c); } .slip-container .slip-row { float: right; padding-right: 5px; font-weight: 400; font-size: 14px; width: 100%; margin-top: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .slip-container .slip-first-row { width: calc(100% - 30px) !important; } .slip-container .slip-market { color: #999 !important; } .slip-container .slip-bet { width: calc(100% - 80px) !important; } .slip-container .slip-bet-price { float: left; font-weight: 500; font-size: 14px; width: 80px; margin-top: 9px; text-align: left; padding-left: 9px; color: var(--th-bg-surface-2, #383838); } .slip-container .event-amount { float: right; text-align: right; width: 50%; padding-right: 5px; margin-top: 9px; } .slip-container .event-amount input { width: 90%; font-size: 14px; border: 1px solid var(--th-slip-input, #27585A); } .slip-container .slip-event-won { float: left; text-align: left; padding-left: 5px; width: 50%; margin-top: 9px; font-size: 14px; padding-top: 3px; } .slip-container .event-changed { display: none; position: relative; top: -57px; height: 0px; width: 300px; } .slip-container .event-changed .background { background: rgba(0,0,0,0.8); width: 300px; height: 56px; } .slip-container .event-changed .text { text-align: center; position: relative; top: 50%; right: 50%; transform: translate(-50%, -50%); color: var(--th-text-primary, #fff); font-size: 14px; font-weight: 300; } .slip-container .end { clear: both; height: 10px; } .stream-bar .title { text-align: center !important; background: var(--th-accent, #ffd33b) !important; color: var(--th-bg-chrome, #000) !important; font-size: 14px !important; font-weight: 500 !important; padding: 0px !important; } .stream-bar .symbol { position: absolute; right: 50%; transform: translate(-50%,-2px); font-size: 20px; } .stream-bar .single-tab { width: 100%; height: 100%; cursor: pointer; position: relative; padding: 12px 0px; } .stream-bar .double-tab { width: 50%; height: 100%; cursor: pointer; position: relative; padding: 12px 0px; } .stream-bar .tab-border { border-right: 1px solid var(--th-bg-chrome, #000); } .stream-bar .stream-container { width: 100%; background: var(--th-bg-surface, #0e0e0e); } .splash-view { display: none; position: fixed; top: 0px; left: 0px; width: 100%; height: 100%; background: rgba(0,0,0,0.8); z-index: 9999999; } .splash-view .splash-container { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 30%; background: var(--th-text-primary, #fff); border: 3px solid var(--th-bg-page, #333); } .splash-view .splash-header { width: 100%; padding: 10px; background: var(--th-bg-chrome, #000); color: var(--th-text-primary, #fff); font-weight: 400; } .splash-view .splash-content { overflow: auto; padding: 10px; max-width: 600px; max-height: 400px; } .account-page-photo { width: 100px; } .account-page-container { margin-right: 25px; color: var(--th-text-primary, #fff); } .withdraw-description { background: var(--th-text-primary, #fff); margin: 15px; margin-bottom: 0px; padding: 10px; color: var(--th-bg-chrome, #000); } .topup-success { background: #376937; color: var(--th-text-primary, #fff); font-weight: 400; margin-bottom: 25px; text-align: center; border-radius: 6px; } .topup-fail { background: #823434; color: var(--th-text-primary, #fff); font-weight: 400; margin-bottom: 25px; text-align: center; border-radius: 6px; } .verify-human { position: fixed; top: 50%; right: 50%; transform: translate(-50%, -50%); background: var(--th-text-primary, #fff); width: 400px; max-width: 95%; padding: 25px; border: 1px solid var(--th-bg-surface-2, #383838); font-size: 20px; font-weight: 400; -webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.2); box-shadow: 0 1px 5px rgba(0,0,0,0.2); } .verify-human .title { color: #4b0242; } .frame-background { background: var(--th-bg-page, #333) !important; } @media screen and (min-width: 1001px) { .mobile { display: none; } } @media screen and (max-width: 1000px) { body { background: var(--th-slip-bg, #17191f); } .desktop { display: none; } .p15 { padding: 7px; } .p30 { padding: 10px; } .ts { text-shadow: 1px 1px var(--th-bg-chrome, #000); } .medium { font-weight: 300; } .main-splash .image-container { height: 200px; } .main-splash .box-container { height: 90px; margin-top: -90px; } .main-games-box .game { width: calc(100% - 6px); margin-right: 3px; margin-top: 3px; } .main-games-box .game .title { display: block; margin-top: -50px; } .event-container { width: 100%; margin: 0px; } .rear-bar-mobile { display: none; position: fixed; width: 100%; left: 0px; top: 50px; height: calc(100% - 50px); background: rgba(0,0,0,0.95); z-index: 999998; overflow: auto; } .form-container { width: calc(100% - 20px); } .form-container .form-title { width: 100%; margin: 8px 6px 8px 6px; } .form-container .form-element { width: 100%; } .game-place { position: fixed; right: 0px; top: 0px; width: 100%; height: 100%; z-index: 999999; } .item-box, .item-2-box { width: calc(100% - 6px); margin-right: 3px; } .market-type .odd-container .odd-double { width: 100%; } .market-type .odd-container .odd-triple { width: 100%; } .event-type .title .text { width: calc(100% - 6px); } .event-type .title .odd-title { display: none; } .event-type .odd-container .event-title { font-size: 12px; padding: 0px 3px 0px 3px; width: calc(100% - 165px); background: inherit; } .event-type .odd-container .odd-rate { width: 50px; } .event-type .odd-container .odd-all { display: none; } .event-type .odd-container .red-arrow { margin-right: -6px; margin-top: -7px; } .event-type .odd-container .green-arrow { margin-right: -6px; margin-top: 22px; } .frame-background .event-type .odd-container .event-title { font-size: 14px; padding: 0px 3px 0px 3px; width: 100%; } .frame-background .event-type .odd-container .red-arrow { margin-right: 6px; margin-top: -9px; } .frame-background .event-type .odd-container .green-arrow { margin-right: 6px; margin-top: 22px; } .event-type .odd-container .odd-rate:hover { color: var(--th-text-primary, #fff); background: var(--th-bg-page, #333); } .event-type .odd-container .passive { color: rgba(255,255,255,0.68) !important; background: var(--th-bg-page, #333) !important; } .event-type .odd-container .passive-ma { color: rgba(255,255,255,0.68) !important; background: var(--th-bg-page, #333) !important; } .event-type .odd-container .passive-ev { color: rgba(255,255,255,0.68) !important; background: var(--th-bg-page, #333) !important; } .score-type .score-container { font-size: 12px; } .score-type .score-container .team { width: calc(50% - 30px); padding: 0px 4px 0px 4px; } .score-type .score-container .score { width: 30px; } .score-type .score-container .status { display: none; } .score-type .score-container .time { display: none; } .event-container .title { font-size: 12px; } .event-container .score-box { margin-right: 2px; width: 30px; height: 25px; line-height: 25px; font-size: 14px; font-weight: 400; } .event-container .score-box .line-1 { margin-top: -12px; border-top: 1px solid rgba(0,0,0,0.25); } .event-container .football .card { width: 8px; height: 12px; border-radius: 2px; } .event-container .football .team { padding: 4px; margin-right: 3px; width: calc(50% - 45px); height: 70px; font-size: 14px; } .event-container .football .score { width: 81px; } .event-container .football .score-middle { width: 15px !important; } .event-container .football .time { margin-right: 2px; margin-top: 2px; margin-bottom: 5px; width: 81px; font-weight: 300; font-size: 12px; } .event-container .football .time span { display: block; font-weight: 500; margin-top: 0px; line-height: 22px; } .event-container .others .wi-1 { width: calc(100% - 32px); } .event-container .others .wi-2 { width: calc(100% - 64px); } .event-container .others .wi-3 { width: calc(100% - 96px); } .event-container .others .wi-4 { width: calc(100% - 128px); } .event-container .others .wi-5 { width: calc(100% - 160px); } .event-container .others .wi-6 { width: calc(100% - 192px); } .event-container .others .wi-7 { width: calc(100% - 224px); } .event-container .others .wi-8 { width: calc(100% - 256px); } .event-container .others .team { height: 25px; line-height: 25px; font-weight: 400; font-size: 14px; padding: 0px 3px 0px 3px; } .event-container .others .time { padding: 0px 3px 0px 3px; line-height: 25px; font-weight: 400; font-size: 12px; color: var(--th-text-primary, #fff); } .event-container .others .score-head { margin-right: 2px; width: 30px; line-height: 25px; font-weight: 300; font-size: 10px; } .static-menu { width: calc(100% - 10px); display: block; margin-right: 10px; } .static-content { width: 100%; margin-top: -10px; } .data-table td, .data-table th { padding: 4px 0px; font-size: 12px; font-weight: 400 !important; } .data-sub-table td, .data-sub-table th { padding: 4px 0px; font-size: 12px; font-weight: 400 !important; } .support-container .user_bubble .time { margin-left: 10px; } .support-container .admin_bubble .time { margin-right: 10px; } .market-type .odd-container .odd-link:hover { } .market-type .odd-container .odd-link:hover .odd-title { background: var(--th-bg-surface, #0e0e0e); } .market-type .odd-container .odd-link:hover .odd-rate { background: var(--th-bg-page, #333); } .mobile-overflow-x { overflow-x: auto !important; } .long-table-container { width: 800px !important; } .form-container .form-link:hover { color: #82828e; } .form-container .form-button:hover { color: var(--th-text-primary, #fff); } .splash-view .splash-container { min-width: 90%; } } .mobile-bar { height: 50px; position: fixed; top: 0px; right: 0px; width: 100%; background: var(--th-bg-chrome, #000); z-index: 999990; border-bottom: 1px solid var(--th-bg-page, #333); } .mobile-bar .icon { float: right; width: 40px; text-align: center; margin-top: 10px; } .mobile-bar .icon a { font-size: 24px; color: var(--th-border-soft, #ddd); text-decoration: none; } .mobile-bar .logo { float: right; width: calc(100% - 160px); margin-top: 5px; } .mobile-bar .badge { display: none; position: fixed; left: 3px; top: 3px; border-radius: 8px; min-width: 16px; height: 16px; line-height: 16px; font-size: 12px; font-weight: 400; background: red; color: var(--th-text-primary, #fff); } .mobile-bar-holder { width: 100%; height: 50px; } .mobile-footer-bar { position: fixed; right: 0px; bottom: 0px; height: 50px; width: 100%; background: var(--th-bg-chrome, #000); z-index: 999990; border-top: 1px solid var(--th-bg-page, #333); font-size: 0px; } .mobile-footer-bar a { width: 20%; display: inline-block; font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center; color: var(--th-border-soft, #ddd); text-decoration: none; font-weight: 400; padding-top: 32px; background-repeat: no-repeat; background-position: center 6px; } .mobile-footer-bar .sport { background-image: url(/default/fam3/assets/icons/top-bar/sport.png); } .mobile-footer-bar .live { background-image: url(/default/fam3/assets/icons/top-bar/live.png); } .mobile-footer-bar .scores { background-image: url(/default/fam3/assets/icons/top-bar/scores.png); } .mobile-footer-bar .casino { background-image: url(/default/fam3/assets/icons/top-bar/casroom.png); } .mobile-footer-bar .account { background-image: url(/default/fam3/assets/icons/top-bar/account.png); } .mobile-footer-bar .active { color: var(--th-bg-page, #333) !important; } .mobile-menu { display: none; position: fixed; left: 0px; top: 50px; width: 100%; height: 100%; z-index: 999995; background: rgba(0,0,0,0.95); overflow: auto; } .mobile-menu .info { text-align: center; color: yellow; margin-top: 25px; line-height: 150%; } .mobile-menu .info .name { color: var(--th-text-primary, #fff); } .mobile-menu .buttons { text-align: center; padding: 20px 0px; margin-top: 6px; } .mobile-menu .buttons a { display: inline-block; color: var(--th-text-primary, #fff); text-decoration: none; font-size: 16px; font-weight: 400; background: var(--th-bg-chrome, #000); border-radius: 4px; padding: 6px 10px; margin: 4px 4px; } .mobile-menu .items { width: calc(100% - 30px); margin-right: 15px; padding: 10px 0px 30px 0px; margin-bottom: 400px; } .mobile-menu .items a { background: var(--th-bg-surface, #0e0e0e); display: block; color: var(--th-text-primary, #fff); text-decoration: none; text-align: center; padding: 12px 0px; margin: 0px; font-weight: 400; border-top: 1px solid var(--th-bg-page, #333); } .mobile-menu .language-box { display: none; margin-bottom: 10px; } .mobile-menu .language-box a { display: block; color: var(--th-bg-page, #333); text-decoration: none; padding: 5px; text-align: center; } .mobile-menu .button1 { background: var(--th-bg-surface, #0e0e0e) !important; color: var(--th-text-primary, #fff) !important; border: 2px solid var(--th-text-dim, #7a7a7a); padding: 5px 20px 5px 20px; font-weight: 500; border-radius: 4px; margin: 8px 2px 0px 2px; font-size: 14px; } .mobile-menu .button2 { background: var(--th-accent-2, #ffcb39) !important; color: var(--th-bg-chrome, #000) !important; font-weight: 500; border-radius: 4px; padding: 6px 20px 6px 20px; font-size: 14px; margin: 8px 2px 0px 2px; } /* ── overlay: overlays/skin-fixups.css ─────────────────────────────── */ /* fam3 skin fix-ups — corrective CSS APPENDED to the tokenized family skin (pillow.style.rtl.css) by the port's overlay mechanism. Hand-edits to the generated tree are forbidden (tools/themeport/bin/port.mjs); this is the sanctioned fix layer. Each rule repairs a defect the RAW captured CSS produces against the engine-injected canonical hotbet chrome — a DOM the capture's CSS was never written for. fam1/fam2 do not reference this file, so they are unaffected. Regeneration-stable: `node bin/port.mjs --family fam3` reproduces it, so `--verify` stays byte-identical. NOTE: this file ships in the served skin, so it is redaction-linted (W0) — no source-brand words. Provenance is stated per rule for a future reader / codex. */ /* FIX 1 — primary nav floated into the "footer". The captured `.top-bar { position:absolute; bottom:10px }` (default.style.rtl.css:130) anchored inside a `.top-bar-wrapper{position: relative}` in the source markup, placing the nav beside the logo. The canonical chrome DOM has NO positioned ancestor for `.top-bar`, so `bottom:10px` resolves against the viewport and pins the whole 11-link nav to the window bottom — the rogue bar that reads as a footer menu. Returning it to normal flow renders it as the header nav directly below the logo bar (above the relocated casino strip), matching the reference site's tier order. Appended after the original rule, so it wins by cascade order, no !important. */ .top-bar { position: static; bottom: auto; } /* FIX 3 — primary-nav composition: 6 text-only items, as the reference site. The canonical chrome injects an 11-link nav WITH icons; this family's reference header carries exactly six, text-only: پیش بینی ورزشی · پیش بینی زنده · نتایج زنده · کازینو آنلاین · پشتیبانی · راهنما The extra entries are ALL the game links, and every one of them is reachable from the relocated casino strip directly below (پوکر/تخته نرد/پاسور/انفجار…), so hiding them from the nav costs no capability — it is exactly how the reference splits nav vs game strip. Selectors: the five are the only nav entries with PLAIN (non-obfuscated) game-launch hrefs — `/skill/` alone covers پاسور + تخته نرد + حکم, which share that href — and none of the six keepers uses one, so the hide-list cannot catch a keeper. A Go tripwire (theme_fam3_topbar_test.go) fails if canonical chrome ever adds a nav entry this list does not account for. `> a > div` is the per-link icon wrapper; hiding the wrapper (rather than the image element inside it) leaves no reserved space. */ .top-bar .container > a > div { display: none; } .top-bar .container > a[href="/poker-web/"], .top-bar .container > a[href="/skill/"], .top-bar .container > a[href="/crash-web/"], .top-bar .container > a[href="/crash2-web/"], .top-bar .container > a[href="/crashroyal-web/"], .top-bar .container > a[href="/pop-web/"], .top-bar .container > a[href="/baccarat-web/"], .top-bar .container > a[href="/game21-web/"], .top-bar .container > a[href="/roulette-web/?live=1"], .top-bar .container > a[href="/slot-web/"] { display: none; } /* FIX 4 — put the primary nav BESIDE the logo, on one band, as the reference. Measured on the live reference (1600x1000): a thin actions bar (0–52), then ONE flex band (52–133) holding the logo on the right and the nav on the left bottom-aligned 10px above the band's bottom edge, then a 10px gap, then the casino strip (143–183). The capture achieves it with `.header-wrapper{display:flex}` + `.top-bar-wrapper{position:relative}` — two elements the canonical chrome does not emit, which is why FIX 1 had to drop the nav into normal flow (it then stacked BELOW the logo band). Here the same relationship is rebuilt from what the canonical DOM does give us: `.header-main-center` becomes the flex row, its `.header-top` (logo + account actions) shrinks to content, and the nav block takes the free space beside it, bottom-aligned with a 10px inset — the reference's exact spacing. Self-adjusting by construction: the nav block's flex-basis is its natural single-line width, so when the actions grow (logged-in: balance + deposit + account + logout) or the viewport narrows past the point where it fits, the flex line simply WRAPS and the nav falls back to its own row below the logo — the pre-FIX-4 layout — instead of colliding or squeezing onto two lines. Both paths measured. Desktop only; the mobile bars are display:none here and the mobile breakpoints below 1000px are untouched. NOTE: the reference keeps the account actions on a SEPARATE bar above the logo; canonical emits logo + actions inside one block, so here the actions sit between the nav and the logo. Splitting them needs the per-Host chrome DOM (W3/T-455), not CSS. */ @media (min-width: 1000px) { .header-main-center { display: flex; flex-wrap: wrap; align-items: flex-end; position: relative; } /* Keep the account controls — login / sign-up / language, and when logged in balance + deposit + account + logout — exactly where BOTH the canonical chrome and the reference put them: the FAR LEFT of the header band (measured on the reference at 1280: language 25–69, login 75–257, sign-up 267–357). Shrinking .header-top to free room for the nav drags them inward with the logo — measured, it moved them 881px to the right. Taking them out of flow removes them from that shrink calculation, so .header-top measures the logo alone and the nav gets the middle, while these stay pinned left and keep their canonical vertical centring. `position` needs !important here: the chrome ships `position:relative` as an INLINE STYLE ATTRIBUTE on .hdr-actions, which no ordinary rule can override. Pinned to the band's UPPER area rather than vertically centred, and that is load-bearing, not cosmetic: the nav is bottom-aligned in the same band and slides further left as the viewport narrows (measured: nav left 624 at 1600px, 464 at 1440, 124 at 1100, 34 at 1010), so it DOES pass under the actions horizontally. Centring left exactly 0px of vertical clearance — no collision, but only by coincidence. Anchoring the actions to the top makes the separation width-independent: actions occupy the upper ~48px, the nav the lower band, so no viewport width can make them collide. It is also closer to the reference, which puts the account bar above the logo band entirely. (Reviewed: R-047.) */ .header-main-center .hdr-actions { position: absolute !important; left: 0; right: auto; top: 6px; transform: none; margin: 0; } .header-main-center > .header-top { order: 1; flex: 0 1 auto; min-width: 0; } .header-main-center > .header-top > center { width: auto; } .header-main-center > .header.container.pr10.desktop { order: 2; flex: 1 1 620px; min-width: 0; padding-bottom: 10px; } .header-main-center > .desktop.header-seperator { order: 3; flex: 0 0 100%; } /* the reference's 10px breathing space between the header band and the strip (it comes from `mb10` on the capture's header wrapper). */ .header-sub.desktop { margin-top: 10px; } } /* FIX 2 — "won" status unreadable yellow on the light bet-history rows. A page-inline rule `.data-table .c-green { color:#ede903 !important }` (a canonical my-bets style meant for a dark table) overrides the skin's `.c-green{color:green}` on the LIGHT rows, so the won status and the winning score render bright yellow — measured contrast ~1.1 against the light rows (white, and the two zebra shades) — where WCAG AA needs 4.5. Restore a readable win-green (~5.8 on those rows), keeping the "win = green" semantic. ⚠ Colour LITERALS are deliberately spelled out in words here, not as hex: overlays are appended BEFORE tokenizeCss, so a palette hex written in PROSE gets rewritten into a var() inside this very comment and inflates the tokenizer counter. (Cost a stale-counter defect once; reviewed R-047.) Specificity 0,2,1 (`td.c-green`) + !important beats the inline `.data-table .c-green` (0,2,0) regardless of source order. NOTE: the same inline rule affects fam1/fam2 + base hotbet (canonical); this fix is fam3-scoped — the wider reach is reported for T-458 / a base fix. */ .data-table td.c-green { color: #0b6b2c !important; } /* T-504 item A — the footer download cards (chrome-injected block). No family stylesheet ever styled these classes here: every page rendered bare small icons with underlined labels. Card geometry mirrors the engine-family design; colours are THIS family's own dark-surface slots (tokenized by the palette). */ .footer-download-link-container { padding: 10px !important; background: var(--th-bg-surface, #0e0e0e) !important; border-radius: 10px !important; display: flex !important; flex-direction: column !important; text-decoration: none !important; gap: 20px !important; color: white !important; } .footer-download-link-icon { background: linear-gradient(to right, var(--th-bg-surface-2, #383838), var(--th-bg-surface, #0e0e0e)) !important; font-size: 50px !important; border-radius: 50% !important; padding: 10px 0 !important; } .footer-download-link-title { font-size: 14px !important; margin: 10px !important; } /* member-chrome-parity — the canonical inline colour layer, beaten by SPECIFICITY. Every canonical/SSR page carries a generated