/*------------------------------------------------------------------
Website: Boss188
--------------------------------------------------------------------*/
/* Bootstrap SCSS Libraries */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;800&display=swap");
.container { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }

.container-fluid { width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }

.row { display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; }

.no-gutters { margin-right: 0; margin-left: 0; }
.no-gutters > .col, .no-gutters > [class*="col-"] { padding-right: 0; padding-left: 0; }

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto { position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; }

.col { flex-basis: 0; flex-grow: 1; max-width: 100%; }

.col-auto { flex: 0 0 auto; width: auto; max-width: none; }

.col-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333%; }

.col-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; }

.col-3 { flex: 0 0 25%; max-width: 25%; }

.col-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; }

.col-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667%; }

.col-6 { flex: 0 0 50%; max-width: 50%; }

.col-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333%; }

.col-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667%; }

.col-9 { flex: 0 0 75%; max-width: 75%; }

.col-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333%; }

.col-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667%; }

.col-12 { flex: 0 0 100%; max-width: 100%; }

.order-first { order: -1; }

.order-last { order: 13; }

.order-0 { order: 0; }

.order-1 { order: 1; }

.order-2 { order: 2; }

.order-3 { order: 3; }

.order-4 { order: 4; }

.order-5 { order: 5; }

.order-6 { order: 6; }

.order-7 { order: 7; }

.order-8 { order: 8; }

.order-9 { order: 9; }

.order-10 { order: 10; }

.order-11 { order: 11; }

.order-12 { order: 12; }

.offset-1 { margin-left: 8.3333333333%; }

.offset-2 { margin-left: 16.6666666667%; }

.offset-3 { margin-left: 25%; }

.offset-4 { margin-left: 33.3333333333%; }

.offset-5 { margin-left: 41.6666666667%; }

.offset-6 { margin-left: 50%; }

.offset-7 { margin-left: 58.3333333333%; }

.offset-8 { margin-left: 66.6666666667%; }

.offset-9 { margin-left: 75%; }

.offset-10 { margin-left: 83.3333333333%; }

.offset-11 { margin-left: 91.6666666667%; }

@media (min-width: 576px) { .col-sm { flex-basis: 0; flex-grow: 1; max-width: 100%; }
  .col-sm-auto { flex: 0 0 auto; width: auto; max-width: none; }
  .col-sm-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333%; }
  .col-sm-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; }
  .col-sm-3 { flex: 0 0 25%; max-width: 25%; }
  .col-sm-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; }
  .col-sm-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667%; }
  .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .col-sm-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333%; }
  .col-sm-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667%; }
  .col-sm-9 { flex: 0 0 75%; max-width: 75%; }
  .col-sm-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333%; }
  .col-sm-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667%; }
  .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
  .order-sm-first { order: -1; }
  .order-sm-last { order: 13; }
  .order-sm-0 { order: 0; }
  .order-sm-1 { order: 1; }
  .order-sm-2 { order: 2; }
  .order-sm-3 { order: 3; }
  .order-sm-4 { order: 4; }
  .order-sm-5 { order: 5; }
  .order-sm-6 { order: 6; }
  .order-sm-7 { order: 7; }
  .order-sm-8 { order: 8; }
  .order-sm-9 { order: 9; }
  .order-sm-10 { order: 10; }
  .order-sm-11 { order: 11; }
  .order-sm-12 { order: 12; }
  .offset-sm-0 { margin-left: 0; }
  .offset-sm-1 { margin-left: 8.3333333333%; }
  .offset-sm-2 { margin-left: 16.6666666667%; }
  .offset-sm-3 { margin-left: 25%; }
  .offset-sm-4 { margin-left: 33.3333333333%; }
  .offset-sm-5 { margin-left: 41.6666666667%; }
  .offset-sm-6 { margin-left: 50%; }
  .offset-sm-7 { margin-left: 58.3333333333%; }
  .offset-sm-8 { margin-left: 66.6666666667%; }
  .offset-sm-9 { margin-left: 75%; }
  .offset-sm-10 { margin-left: 83.3333333333%; }
  .offset-sm-11 { margin-left: 91.6666666667%; } }
@media (min-width: 768px) { .col-md { flex-basis: 0; flex-grow: 1; max-width: 100%; }
  .col-md-auto { flex: 0 0 auto; width: auto; max-width: none; }
  .col-md-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333%; }
  .col-md-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; }
  .col-md-3 { flex: 0 0 25%; max-width: 25%; }
  .col-md-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; }
  .col-md-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667%; }
  .col-md-6 { flex: 0 0 50%; max-width: 50%; }
  .col-md-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333%; }
  .col-md-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667%; }
  .col-md-9 { flex: 0 0 75%; max-width: 75%; }
  .col-md-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333%; }
  .col-md-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667%; }
  .col-md-12 { flex: 0 0 100%; max-width: 100%; }
  .order-md-first { order: -1; }
  .order-md-last { order: 13; }
  .order-md-0 { order: 0; }
  .order-md-1 { order: 1; }
  .order-md-2 { order: 2; }
  .order-md-3 { order: 3; }
  .order-md-4 { order: 4; }
  .order-md-5 { order: 5; }
  .order-md-6 { order: 6; }
  .order-md-7 { order: 7; }
  .order-md-8 { order: 8; }
  .order-md-9 { order: 9; }
  .order-md-10 { order: 10; }
  .order-md-11 { order: 11; }
  .order-md-12 { order: 12; }
  .offset-md-0 { margin-left: 0; }
  .offset-md-1 { margin-left: 8.3333333333%; }
  .offset-md-2 { margin-left: 16.6666666667%; }
  .offset-md-3 { margin-left: 25%; }
  .offset-md-4 { margin-left: 33.3333333333%; }
  .offset-md-5 { margin-left: 41.6666666667%; }
  .offset-md-6 { margin-left: 50%; }
  .offset-md-7 { margin-left: 58.3333333333%; }
  .offset-md-8 { margin-left: 66.6666666667%; }
  .offset-md-9 { margin-left: 75%; }
  .offset-md-10 { margin-left: 83.3333333333%; }
  .offset-md-11 { margin-left: 91.6666666667%; } }
@media (min-width: 992px) { .col-lg { flex-basis: 0; flex-grow: 1; max-width: 100%; }
  .col-lg-auto { flex: 0 0 auto; width: auto; max-width: none; }
  .col-lg-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333%; }
  .col-lg-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; }
  .col-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .col-lg-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; }
  .col-lg-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667%; }
  .col-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333%; }
  .col-lg-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667%; }
  .col-lg-9 { flex: 0 0 75%; max-width: 75%; }
  .col-lg-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333%; }
  .col-lg-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667%; }
  .col-lg-12 { flex: 0 0 100%; max-width: 100%; }
  .order-lg-first { order: -1; }
  .order-lg-last { order: 13; }
  .order-lg-0 { order: 0; }
  .order-lg-1 { order: 1; }
  .order-lg-2 { order: 2; }
  .order-lg-3 { order: 3; }
  .order-lg-4 { order: 4; }
  .order-lg-5 { order: 5; }
  .order-lg-6 { order: 6; }
  .order-lg-7 { order: 7; }
  .order-lg-8 { order: 8; }
  .order-lg-9 { order: 9; }
  .order-lg-10 { order: 10; }
  .order-lg-11 { order: 11; }
  .order-lg-12 { order: 12; }
  .offset-lg-0 { margin-left: 0; }
  .offset-lg-1 { margin-left: 8.3333333333%; }
  .offset-lg-2 { margin-left: 16.6666666667%; }
  .offset-lg-3 { margin-left: 25%; }
  .offset-lg-4 { margin-left: 33.3333333333%; }
  .offset-lg-5 { margin-left: 41.6666666667%; }
  .offset-lg-6 { margin-left: 50%; }
  .offset-lg-7 { margin-left: 58.3333333333%; }
  .offset-lg-8 { margin-left: 66.6666666667%; }
  .offset-lg-9 { margin-left: 75%; }
  .offset-lg-10 { margin-left: 83.3333333333%; }
  .offset-lg-11 { margin-left: 91.6666666667%; } }
@media (min-width: 1200px) { .col-xl { flex-basis: 0; flex-grow: 1; max-width: 100%; }
  .col-xl-auto { flex: 0 0 auto; width: auto; max-width: none; }
  .col-xl-1 { flex: 0 0 8.3333333333%; max-width: 8.3333333333%; }
  .col-xl-2 { flex: 0 0 16.6666666667%; max-width: 16.6666666667%; }
  .col-xl-3 { flex: 0 0 25%; max-width: 25%; }
  .col-xl-4 { flex: 0 0 33.3333333333%; max-width: 33.3333333333%; }
  .col-xl-5 { flex: 0 0 41.6666666667%; max-width: 41.6666666667%; }
  .col-xl-6 { flex: 0 0 50%; max-width: 50%; }
  .col-xl-7 { flex: 0 0 58.3333333333%; max-width: 58.3333333333%; }
  .col-xl-8 { flex: 0 0 66.6666666667%; max-width: 66.6666666667%; }
  .col-xl-9 { flex: 0 0 75%; max-width: 75%; }
  .col-xl-10 { flex: 0 0 83.3333333333%; max-width: 83.3333333333%; }
  .col-xl-11 { flex: 0 0 91.6666666667%; max-width: 91.6666666667%; }
  .col-xl-12 { flex: 0 0 100%; max-width: 100%; }
  .order-xl-first { order: -1; }
  .order-xl-last { order: 13; }
  .order-xl-0 { order: 0; }
  .order-xl-1 { order: 1; }
  .order-xl-2 { order: 2; }
  .order-xl-3 { order: 3; }
  .order-xl-4 { order: 4; }
  .order-xl-5 { order: 5; }
  .order-xl-6 { order: 6; }
  .order-xl-7 { order: 7; }
  .order-xl-8 { order: 8; }
  .order-xl-9 { order: 9; }
  .order-xl-10 { order: 10; }
  .order-xl-11 { order: 11; }
  .order-xl-12 { order: 12; }
  .offset-xl-0 { margin-left: 0; }
  .offset-xl-1 { margin-left: 8.3333333333%; }
  .offset-xl-2 { margin-left: 16.6666666667%; }
  .offset-xl-3 { margin-left: 25%; }
  .offset-xl-4 { margin-left: 33.3333333333%; }
  .offset-xl-5 { margin-left: 41.6666666667%; }
  .offset-xl-6 { margin-left: 50%; }
  .offset-xl-7 { margin-left: 58.3333333333%; }
  .offset-xl-8 { margin-left: 66.6666666667%; }
  .offset-xl-9 { margin-left: 75%; }
  .offset-xl-10 { margin-left: 83.3333333333%; }
  .offset-xl-11 { margin-left: 91.6666666667%; } }
.animate { -webkit-transition: all .3s; transition: all .3s; backface-visibility: hidden; -webkit-backface-visibility: hidden; }

/*----------------------------------
1. General
----------------------------------*/
* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }

*:focus { outline: none; }

html, body { margin: 0; padding: 0; overflow-x: hidden; }

body { background: #021b44; font-family: "Inter", sans-serif; font-size: 13px; position: relative; font-weight: 400; color: #8e8e8e; }

main { position: relative; }

:focus { outline: none; }

.container-fluid { max-width: 1500px; }

@media (min-width: 1200px) { .container { max-width: 1140px; width: 100%; } }
@media (max-width: 992px) { .container { max-width: 960px; width: 100%; } }
@media (max-width: 768px) { .container { max-width: 860px; width: 100%; } }
@media (max-width: 576px) { .container { max-width: 680px; width: 100%; } }

/* font */
a, .btn, button { text-decoration: none; transition: .3s; cursor: pointer; }

a[href^="tel"] { color: inherit; }

a { color: inherit; }
a:hover { color: inherit; text-decoration: none; }

h1, h2, h3, h4, h5, h6 { font-family: "Inter", sans-serif; margin: 0; text-transform: capitalize; color: #ffffff; font-weight: 600; }

h2 { font-size: 32px; }

h3 { font-size: 20px; }

h4 { font-size: 16px; }

h5 { font-size: 14px; }

p { margin: 0; line-height: 20px; }

ul { padding: 0; margin: 0; }
ul li { list-style-type: none; }

ol { margin: 0; padding-inline-start: 20px; }

a, a:focus, a:hover, .btn, .btn:focus, .btn:hover, button, button:focus, button:hover, input:focus, .form-control:focus, button:focus, .btn-primary:hover, a:focus, select:focus { box-shadow: none; text-decoration: none; outline: none; border: unset; }

[type=reset], [type=submit], button, html [type=button] { -webkit-appearance: unset; }

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: unset; }

/* button */
.btn-wrap { display: flex; align-items: center; }
.btn-wrap a.btn { margin: 0 10px; }

.btn { font-size: 13px; display: inline-block; white-space: nowrap; font-family: "Inter", sans-serif; background: #00a1ff; color: #ffffff; border: 0; font-weight: 600; padding: 5px 10px; min-width: 100px; text-transform: uppercase; transition: .5s; border-radius: 5px; text-align: center; box-shadow: 0 3px 5px rgba(0, 161, 255, 0); }
.btn:hover { color: #ffffff; box-shadow: 0 3px 5px rgba(0, 161, 255, 0.4) !important; }
.btn.outlined { background: transparent; border: 1px solid #00a1ff; color: #00a1ff; }
.btn.outlined:hover { color: #00a1ff; background: #ffffff; box-shadow: 0 3px 5px rgba(0, 161, 255, 0.4) !important; }
.btn.outlined-white { background: transparent; border: 1px solid #ffffff; color: #ffffff; }
.btn.outlined-white:hover { color: #ffffff; background: #00a1ff; box-shadow: 0 3px 5px rgba(255, 255, 255, 0.4) !important; }
.btn.outlined-blue { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; color: #ffffff !important; }
.btn.outlined-blue:hover { color: #ffffff; background: #0D72B9; }

[type=reset], [type=submit], button, html [type=button] { -webkit-appearance: unset; }

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: unset; }

/* share */
.blue-patternoverlay { background: linear-gradient(to bottom, #051937 40%, #010101 100%); position: relative; }
.blue-patternoverlay::before { content: ""; position: absolute; top: 0; left: 0; background: url(../img/pattern.webp); background-repeat: repeat; background-position: center; width: 100%; height: 100%; opacity: .05; }

.fa-spinner { animation: fa-spin 1s steps(8) infinite; }

/* modal */
.modal-open { padding-right: 0 !important; }

.modal { padding: 0 !important; }
.modal#login-pop .modal-dialog { max-width: 500px; margin: 0 auto; }
.modal#login-pop .modal-content { background: url(../img/blue-bg.webp); background-repeat: no-repeat; background-size: cover; background-position: center; border: 1px solid #ffffff; border-radius: 8px; }
.modal#promo-pop .modal-content { background: url(../img/blue-bg.webp); background-repeat: no-repeat; background-size: cover; background-position: center; border: 1px solid #ffffff; border-radius: 8px; }
.modal#promo-pop .modal-content .modal-body .promo-card { padding-bottom: 60px; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap { display: flex; border-bottom: 1px solid #ffffff; padding-bottom: 50px; margin-bottom: 30px; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .img-wrap { width: 50%; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .img-wrap img { width: 100%; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 10px rgba(0, 161, 255, 0.3); }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .content-wrap { width: 50%; padding-left: 20px; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .content-wrap .title { color: #ffffff; font-size: 16px; margin: 10px 0; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .content-wrap .desc { color: #aaa; margin-bottom: 15px; height: 70px; overflow-y: auto; line-height: 16px; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .content-wrap .remain-time { padding-top: 10px; }
.modal#promo-pop .modal-content .modal-body .promo-card .top-wrap .content-wrap .remain-time .white-text { color: #ffffff; }
.modal#promo-pop .modal-content .modal-body .promo-card .info .wrap:first-of-type { margin-bottom: 15px; }
.modal#promo-pop .modal-content .modal-body .promo-card h4.sub-title { color: #ffffff; font-weight: 500; }
.modal#promo-pop .modal-content .modal-body .promo-card .tnc-wrap { background: rgba(0, 0, 0, 0.4); border-radius: 5px; padding: 30px 25px; margin-top: 60px; }
.modal#promo-pop .modal-content .modal-body .promo-card .tnc-wrap .tnc { max-height: 160px; overflow-y: auto; margin-top: 20px; }
.modal#chestModal .modal-dialog { max-width: 500px; margin: 0 auto; }
.modal#chestModal .modal-header { position: absolute; right: 0; z-index: 1; }
.modal#chestModal .modal-body { padding: 0; }
.modal#chestModal .modal-body img { width: 100%; }
.modal#spinHistoryModal .modal-dialog { max-width: 500px; margin: 0 auto; }
.modal#spinHistoryModal .modal-content { background-image: url("../img/spin/chest-modal-bg.webp"); border: 1px solid #CD9C31; border-radius: 8px; overflow: hidden; }
.modal#spinHistoryModal .modal-body .tag { margin: 0; font-size: 18px; text-transform: uppercase; position: absolute; padding: 8px 25px; top: 10px; right: -40px; width: 185px; z-index: 1; text-transform: uppercase; font-size: 14px; line-height: 1; background: #CD9C31; color: white; transform: rotate(45deg); text-align: center; }
.modal#spinHistoryModal .modal-body h4.gold-text { color: #CD9C31; padding: 10px 5px; }
.modal#spinHistoryModal .modal-body .history { max-width: 300px; overflow-y: auto; }
.modal#spinHistoryModal .modal-body .history p { color: #ffffff; font-weight: 500; background: rgba(0, 27, 127, 0.3); padding: 10px 5px; }
.modal#spinHistoryModal .modal-body .history p:nth-child(2n) { background: transparent; }
.modal#payout-modal .modal-content, .modal#tnc-modal .modal-content, .modal#tournament-prize-modal .modal-content, .modal#tournament-tnc-modal .modal-content { background: url(../img/blue-bg.webp); background-repeat: no-repeat; background-size: cover; background-position: center; border: 1px solid #ffffff; border-radius: 8px; }
.modal#payout-modal .modal-body h4, .modal#tnc-modal .modal-body h4, .modal#tournament-prize-modal .modal-body h4, .modal#tournament-tnc-modal .modal-body h4 { color: #CD9C31; border-bottom: 1px solid #CD9C31; margin-bottom: 10px; }
.modal#payout-modal .modal-body .wrap, .modal#tnc-modal .modal-body .wrap, .modal#tournament-prize-modal .modal-body .wrap, .modal#tournament-tnc-modal .modal-body .wrap { color: #ffffff; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap, .modal#tnc-modal .modal-body .wrap .gray-table-wrap, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap { border: 1px solid #8e8e8e; border-radius: 5px; overflow: hidden; margin: 10px 0; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap .table, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table { color: #ffffff; margin-bottom: 0; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type th, .modal#payout-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type td, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type th, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type td, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type th, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type td, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type th, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table tr:first-of-type td { border-top: 0; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table th { text-align: center; padding: 15px; border-bottom: 1px solid #8e8e8e !important; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap .table td, .modal#payout-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table td, .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table td, .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table th, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table td, .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table th { text-align: center; border-color: #8e8e8e; padding: 15px; }
.modal#payout-modal .modal-body .wrap .gray-table-wrap .table td:not(:last-child), .modal#payout-modal .modal-body .wrap .gray-table-wrap .table th:not(:last-child), .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table td:not(:last-child), .modal#tnc-modal .modal-body .wrap .gray-table-wrap .table th:not(:last-child), .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table td:not(:last-child), .modal#tournament-prize-modal .modal-body .wrap .gray-table-wrap .table th:not(:last-child), .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table td:not(:last-child), .modal#tournament-tnc-modal .modal-body .wrap .gray-table-wrap .table th:not(:last-child) { border-right: 1px solid #8e8e8e; }
.modal#payout-modal .modal-body .wrap:first-of-type, .modal#tnc-modal .modal-body .wrap:first-of-type, .modal#tournament-prize-modal .modal-body .wrap:first-of-type, .modal#tournament-tnc-modal .modal-body .wrap:first-of-type { margin-bottom: 20px; }

.modal-content { background: #021b44; border-radius: 8px; border: unset; }
.modal-content .modal-header { border-bottom: unset; padding: 10px 10px 0 0; }

.close { text-shadow: none; font-size: 16px; line-height: 20px; color: #ffffff; opacity: 1; font-weight: 400; padding: 0 !important; margin: 0 0 0 auto !important; }
.close:focus, .close:hover, .close:not(:disabled):not(.disabled):focus, .close:not(:disabled):not(.disabled):hover { color: #ffffff; opacity: 1; }

.modal-font { border-bottom: none; border-top-left-radius: 0; border-top-right-radius: 0; display: block; padding: 1rem 1rem 0 0; }
.modal-font .close { margin: 0; padding: 0; }

.modal-body { padding: 20px 30px; }
.modal-body .pop-form { max-width: 450px; width: 100%; margin: 0 auto; margin-bottom: 30px; }
.modal-body .pop-form .logo { width: 200px; margin: 0 auto 50px; }
.modal-body .pop-form .logo img { width: 100%; }
.modal-body .pop-form form { max-width: 250px; margin: 0 auto; }
.modal-body .pop-form form .form-group { position: relative; }
.modal-body .pop-form form .form-group .form-item { background: #082B56; border-color: #3B5F93; color: #ffffff; }
.modal-body .pop-form form .form-group .form-item::placeholder { color: rgba(255, 255, 255, 0.8); }
.modal-body .pop-form form .form-group .form-item:focus::placeholder { color: rgba(255, 255, 255, 0.8); }
.modal-body .pop-form form .form-group a.forgotpassword { color: #CA983C; text-transform: capitalize; display: inline-block; padding-top: 5px; border-bottom: 1px solid transparent; }
.modal-body .pop-form form .form-group a.forgotpassword:hover { border-color: #CA983C; }
.modal-body .pop-form form .form-action { margin-top: 0; text-align: right; }
.modal-body .pop-form .bottom-info { padding-top: 40px; }
.modal-body .pop-form .bottom-info .each p { text-align: center; width: 70%; margin: 0 auto; }
.modal-body .pop-form .bottom-info .each p a { color: #00a1ff; }
.modal-body .pop-form .bottom-info .each:first-of-type { border-bottom: 1px solid #8e8e8e; padding-bottom: 20px; margin-bottom: 20px; }
.modal-body .modal-footer { display: none !important; }

/* form */
.form-group { margin-bottom: unset; padding-bottom: 15px; }

form .form-group span.error { font-weight: 500; font-size: 11px; color: red; display: block; padding-top: 3px; }
form .form-group label.input-label { color: #021b44; font-weight: 600; font-size: 13px; text-transform: capitalize; display: block; margin-bottom: 3px; }
form .form-group label.opt-label { cursor: pointer; }
form .form-group label.img-label { display: block; width: 100%; height: 100%; }
form .form-group label.text-label { display: inline; cursor: pointer; }
form .form-group .checked > .opt-label { cursor: auto; }
form .form-group small { display: block; text-align: left; font-size: 10px; margin-top: 2px; color: #ffffff; padding: 0 10px; }
form .form-group .error { color: red; }
form .form-group .form-item { border: 1px solid transparent; background-color: #ffffff; border-radius: 5px; padding: 8px 15px; color: #021b44; font-size: 13px; font-weight: 500; transition: .3s; width: 100%; }
form .form-group .form-item:focus { border-color: #00a1ff; }
form .form-group .form-item::placeholder { color: rgba(2, 27, 68, 0.4); }
form .form-group .form-item:focus::placeholder { color: rgba(2, 27, 68, 0.4); }
form .form-group .form-item.pure-text, form .form-group .form-item.pure-text:focus { background-color: transparent; display: block; border-radius: 0; border-color: transparent; padding: 0 8px; }
form .form-group .form-item option { color: #ffffff; }
form .form-group .form-item[type="file"], form .form-group .form-item[type="file"]:focus, form .form-group .form-item[type="file"]:hover { background-color: transparent; border-color: transparent; width: auto; cursor: pointer; font-style: italic; }
form .form-group .form-item[type="checkbox"] { display: inline; }
form .form-group .form-item[type="checkbox"], form .form-group .form-item[type="checkbox"]:focus, form .form-group .form-item[type="checkbox"]:hover { background-color: transparent; border-color: transparent; width: auto; cursor: pointer; }
form .form-group.form-group-mulfield .mulfield { display: flex; margin: -2px; }
form .form-group.form-group-mulfield .mulfield .form-item { margin: 2px; }
form .form-group.form-checkbox { display: flex; align-items: center; }
form .form-group.form-date .form-wrap { display: flex; align-items: center; }
form .form-group.form-date .form-item.date-picker { background: url(../img/ico/date.webp) no-repeat right center; background-size: auto 45%; background-color: #161616; }
form .form-group.form-date span { padding: 0 10px; }
form .radio-group.radio-box { display: flex; flex-wrap: wrap; align-items: center; }
form .radio-group input[type="radio"] { width: 0; height: 0; margin: 0; padding: 0; visibility: hidden; }
form .form-action, form .form-link { text-align: center; }
form .btn-wrap { display: flex; justify-content: center; align-items: center; }
form .btn-wrap .form-action { margin: 0 10px; }
form select { background-image: linear-gradient(45deg, transparent 50%, #00a1ff 50%), linear-gradient(135deg, #00a1ff 50%, transparent 50%), linear-gradient(to right, #00a1ff, #00a1ff); background-position: calc(100% - 13px) calc(1em + 2px), calc(100% - 8px) calc(1em + 2px), calc(100% - 2em) 0.6em; background-size: 5px 5px, 5px 5px, 1px 1.5em; background-repeat: no-repeat; -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; text-overflow: ''; }
form .custom-control-input:checked ~ .custom-control-label::before { border-color: #00a1ff; background-color: #00a1ff; color: #ffffff; box-shadow: none; }
form .custom-radio .custom-control-input:checked ~ .custom-control-label::after { background-image: url("../img/check-solid.svg"); }
form .custom-control-label::before, form .custom-control-label::after { top: 2px; border-radius: 5px !important; }
form .custom-radio .custom-control-input:checked ~ label { color: #00a1ff; text-shadow: 0 0 5px black; }
form .custom-radio .custom-control-input ~ label { cursor: pointer; }

/*----------------------------------
2. Header / Footer
----------------------------------*/
header { background: #021b44; font-weight: 500; }
header .top-bar { border-bottom: 1px solid #00a1ff; }
header .top-bar nav.navbar { display: flex; align-items: center; justify-content: space-between; padding: 15px 0; background: #021b44; }
header .top-bar nav.navbar a.navbar-brand { display: inline-block; padding: 0; }
header .top-bar nav.navbar a.navbar-brand img { height: 30px; }
header .top-bar nav.navbar ul.navbar-nav { display: flex; align-items: center; flex-direction: row; }
header .top-bar nav.navbar ul.navbar-nav li.nav-item { color: #ffffff; text-transform: capitalize; padding: 0 10px; position: relative; }
header .top-bar nav.navbar ul.navbar-nav li.nav-item a::after { content: ""; display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; transition: .3s; border-bottom: 8px solid #00a1ff; position: absolute; bottom: -22px; left: 50%; transform: translateX(-50%) scale(0); }
header .top-bar nav.navbar ul.navbar-nav li.nav-item a::before { content: ""; display: block; width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; transition: .3s; border-top: 8px solid #00a1ff; position: absolute; top: -22px; left: 50%; transform: translateX(-50%) scale(0); }
header .top-bar nav.navbar ul.navbar-nav li.nav-item:hover a, header .top-bar nav.navbar ul.navbar-nav li.nav-item a.active { color: #00a1ff; }
header .top-bar nav.navbar ul.navbar-nav li.nav-item:hover a::after, header .top-bar nav.navbar ul.navbar-nav li.nav-item a.active::after { transform: translateX(-50%) scale(1); }
header .top-bar nav.navbar ul.navbar-nav li.nav-item:hover a::before, header .top-bar nav.navbar ul.navbar-nav li.nav-item a.active::before { transform: translateX(-50%) scale(1); }
header .top-bar nav.navbar ul.navbar-nav li.nav-item a, header .top-bar nav.navbar ul.navbar-nav li.nav-item span { display: block; }
header .bottom-bar { background: #021b44; padding: 15px 0; }
header .bottom-bar .outer-wrap { display: flex; align-items: center; justify-content: space-between; color: #00a1ff; }
header .bottom-bar .outer-wrap .left-wrap { display: flex; align-items: center; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap { position: relative; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-select { margin: 0 30px; display: flex; align-items: center; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-select span { text-transform: capitalize; display: block; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-select:hover { cursor: pointer; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-select::before { content: ""; display: block; width: 8px; height: 8px; border-radius: 100px; background-color: #00a1ff; margin-right: 5px; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-opt { display: none; min-width: 150px; background: #021b44; text-align: center; padding: 0 5px; position: absolute; top: 40px; left: 50%; transform: translateX(-50%); z-index: 99999; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-opt .each { padding: 5px 0; border-bottom: 1px solid #3B5F93; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-opt .each:last-of-type { border-bottom: 0; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-opt span { display: block; padding: 5px; transition: .3s; text-transform: capitalize; color: #ffffff; }
header .bottom-bar .outer-wrap .left-wrap .lang-wrap .lang-opt span:hover { cursor: pointer; background: #00a1ff; border-radius: 5px; }
header .bottom-bar .outer-wrap .beforelog-wrap { display: flex; align-items: center; }
header .bottom-bar .outer-wrap .beforelog-wrap ul.navbar-nav { flex-direction: row; align-items: center; }
header .bottom-bar .outer-wrap .beforelog-wrap ul.navbar-nav li.nav-item { color: #ffffff; text-transform: capitalize; padding: 0 10px; position: relative; }
header .bottom-bar .outer-wrap .afterlog-wrap { display: flex; align-items: center; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav { flex-direction: row; align-items: center; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item { color: #ffffff; text-transform: capitalize; padding: 0 20px; position: relative; border-left: 1px solid #00a1ff; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item:last-of-type { border-left: none; padding: 0 10px; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item .each { display: flex; align-items: center; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item .each .ico-wrap { margin-left: 15px; width: 25px; height: 25px; border-radius: 50px; border: 2px solid #F7BA59; display: flex; align-items: center; justify-content: center; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item .each .ico-wrap i { font-size: 10px; color: #F7BA59; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item .each i.fa-chevron-down { padding-left: 15px; color: #F7BA59; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.vip-level { display: flex; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.vip-level .ico-vip { width: 25px; position: relative; margin-left: 15px; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.vip-level .ico-vip img { width: 100%; position: absolute; top: -3px; left: 50%; transform: translateX(-50%); }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop { position: relative; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop .more-opt, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt { display: none; min-width: 150px; background: #021b44; text-align: center; padding: 0 5px; position: absolute; top: 43px; left: 50%; transform: translateX(-50%); z-index: 99999; border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop .more-opt .more-each, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt .more-each { padding: 5px 0; border-bottom: 1px solid #3B5F93; display: block; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop .more-opt .more-each:last-of-type, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt .more-each:last-of-type { border-bottom: 0; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop .more-opt span, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt span { display: block; padding: 5px; transition: .3s; text-transform: capitalize; color: #ffffff; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.profile-drop .more-opt span:hover, header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt span:hover { cursor: pointer; background: #00a1ff; border-radius: 5px; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.profile-nav li.nav-item.more-drop .more-opt { top: 40px; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.log-nav { flex-direction: row; align-items: center; }
header .bottom-bar .outer-wrap .afterlog-wrap ul.log-nav li.nav-item { color: #ffffff; text-transform: capitalize; padding: 0 10px; position: relative; }

footer { background: #021b44; }
footer .top-wrap { padding: 40px 0; display: flex; align-items: flex-start; }
footer .top-wrap .main-wrap .wrap h5 { padding-bottom: 15px; font-weight: 400; color: #3B5F93; }
footer .top-wrap .main-wrap:first-of-type { width: 55%; padding-right: 40px; }
footer .top-wrap .main-wrap:first-of-type .payment-method .list-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: -15px; }
footer .top-wrap .main-wrap:first-of-type .payment-method .list-wrap .each { width: calc(100% * 1/6 - (30px)); margin: 15px; }
footer .top-wrap .main-wrap:first-of-type .payment-method .list-wrap .each img { width: 100%; }
footer .top-wrap .main-wrap:first-of-type .provider { margin-top: 50px; }
footer .top-wrap .main-wrap:first-of-type .provider .partner-wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin: -15px; }
footer .top-wrap .main-wrap:first-of-type .provider .partner-wrap .each { width: calc(100% * 1/7 - (30px)); margin: 15px; }
footer .top-wrap .main-wrap:first-of-type .provider .partner-wrap .each img { width: 100%; filter: grayscale(100); }
footer .top-wrap .main-wrap:last-of-type { width: calc(45% - 40px); margin-left: 40px; display: flex; justify-content: flex-end; flex-direction: column; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .list-wrap { display: flex; align-items: center; margin: 0 -8px; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .list-wrap a.each { width: 30px; height: 30px; border-radius: 50px; background: rgba(142, 142, 142, 0.4); color: #161616; display: flex; align-items: center; justify-content: center; font-size: 16px; margin: 0 8px; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .list-wrap a.each:hover { transform: scale(1.05); }
footer .top-wrap .main-wrap:last-of-type .social-wrap .more-link { padding-top: 15px; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .more-link ul { display: flex; align-items: center; justify-content: space-between; margin: 0 -8px; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .more-link ul li { margin: 0 8px; text-transform: capitalize; color: #3B5F93; }
footer .top-wrap .main-wrap:last-of-type .social-wrap .more-link ul li a { display: block; }
footer .bottom-wrap { border-top: 1px solid #ffffff; padding: 40px 0 60px; }
footer .bottom-wrap .main-wrap { display: flex; align-items: flex-start; }
footer .bottom-wrap .main-wrap .copyright-wrap { width: 65%; color: #3B5F93; padding-right: 40px; }
footer .bottom-wrap .main-wrap .copyright-wrap h5 { padding-bottom: 40px; font-weight: 400; color: #3B5F93; }
footer .bottom-wrap .main-wrap .copyright-wrap h4 { color: #3B5F93; }
footer .bottom-wrap .main-wrap .copyright-wrap p { padding-top: 15px; }
footer .bottom-wrap .main-wrap .badge-wrap { width: calc(35% - 40px); margin-left: 40px; }
footer .bottom-wrap .main-wrap .badge-wrap .list-wrap { display: flex; align-items: center; justify-content: flex-end; }
footer .bottom-wrap .main-wrap .badge-wrap .list-wrap .each.badge { margin-right: 5px; }
footer .bottom-wrap .main-wrap .badge-wrap .list-wrap .each.badge img { height: 60px; }
footer .bottom-wrap .main-wrap .badge-wrap .list-wrap .each.logo { margin-left: 20px; }
footer .bottom-wrap .main-wrap .badge-wrap .list-wrap .each.logo img { width: 100px; }

section.gif-spin { position: fixed; bottom: 15px; left: 20px; z-index: 999; }
section.gif-spin a.each { width: 110px; display: block; }
section.gif-spin a.each img { width: 100%; }

section.bottom-contact { position: fixed; bottom: 35px; right: 65px; z-index: 999; }
section.bottom-contact .content-wrap { width: 70px; height: 70px; position: relative; transition: .3s; display: flex; align-items: center; justify-content: center; }
section.bottom-contact .content-wrap img.cs-img { width: 100%; position: relative; z-index: 999; }
section.bottom-contact .content-wrap .hover-content { position: absolute; top: 0; right: -34px; transform: scaleX(0); opacity: 0; transition: .3s; width: 150px; min-height: 100%; border-radius: 10px; background: url(../img/blue-bg.webp); background-repeat: no-repeat; background-size: cover; background-position: center; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 15px; border: 1px solid #ffffff; border-radius: 5px; padding-bottom: 30px; }
section.bottom-contact .content-wrap .hover-content a.each { display: flex; flex-direction: column; align-items: center; margin: 10px 0; color: #ffffff; border-bottom: 1px solid #ffffff; padding-bottom: 10px; width: 100%; }
section.bottom-contact .content-wrap .hover-content a.each img.chat-icon { width: 30px; margin-bottom: 5px; }
section.bottom-contact .content-wrap .hover-content a.each p { font-weight: 600; }
section.bottom-contact .content-wrap .hover-content a.each .des { font-weight: 600; color: #FFB636; }
section.bottom-contact .content-wrap .hover-content a.each:last-of-type { border-bottom: 0; }
section.bottom-contact .content-wrap:hover .hover-content { top: 15px; transform: translateY(-100%) scaleX(1); opacity: 1; }

/*----------------------------------
3. Homepage
----------------------------------*/
main.pg-home section.banner .home-slider img { width: 100%; display: block; }
main.pg-home section.banner .home-slider .slick-dots { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; }
main.pg-home section.banner .home-slider .slick-dots li { margin: 0 5px; }
main.pg-home section.banner .home-slider .slick-dots li button { font-size: 0; background-color: transparent; color: transparent; padding: 0; }
main.pg-home section.banner .home-slider .slick-dots li button:before { font-family: "Font Awesome 5 Pro"; font-weight: 900; content: "\f111"; font-size: 8px; color: #ffffff; }
main.pg-home section.banner .home-slider .slick-dots li button:hover { cursor: pointer; }
main.pg-home section.banner .home-slider .slick-dots li.slick-active button:before { content: "\f111"; font-weight: 900; color: #8e8e8e; }
main.pg-home section.promo-wrap { background: url(../img/pattern.webp); background-repeat: repeat; padding: 50px 0; background-color: #ffffff; background-position: center; }
main.pg-home section.promo-wrap .outer-wrap h3 { display: block; color: #3B5F93; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider { margin: 0 -10px; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider .slick-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; font-size: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #3B5F93; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider .slick-arrow.slick-next { right: -35px; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider .slick-arrow.slick-prev { left: -35px; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider .each { width: 320px; margin: 0 10px; display: block; position: relative; padding: 20px 0; }
main.pg-home section.promo-wrap .outer-wrap .promo-slider .each img { width: 100%; border-radius: 5px; overflow: hidden; border: 1px solid #ffffff; box-shadow: 0 5px 8px rgba(2, 27, 68, 0.4); }
main.pg-home section.luckydraw { background: url(../img/pattern.webp); background-repeat: repeat; padding: 20px 0 100px; background-color: #ffffff; background-position: center; }
main.pg-home section.luckydraw .outer-wrap h3 { display: block; color: #3B5F93; padding-bottom: 15px; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap { border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 12px rgba(2, 27, 68, 0.6); position: relative; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap h4.title { position: absolute; top: 12%; right: 10%; font-size: 30px; text-transform: uppercase; text-align: right; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap h4.title span { color: #FFA317; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap .ticket-amount { position: absolute; bottom: 12%; right: 10%; display: flex; align-items: center; font-size: 40px; color: #FFA317; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap .ticket-amount p.amount { margin-left: 10%; border: 2px solid #FFA317; border-radius: 10px; display: block; padding: 20px 25px; color: #ffffff; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap .img-wrap { border-radius: 5px; }
main.pg-home section.luckydraw .outer-wrap .luckydraw-wrap .img-wrap img { width: 100%; border-radius: 5px; }
main.pg-home section.highlights { padding: 40px 0 80px; background: url(../img/blue-bg.webp); background-repeat: no-repeat; background-position: center; background-size: cover; }
main.pg-home section.highlights .outer-wrap { display: flex; }
main.pg-home section.highlights .outer-wrap .video-wrap { width: 60%; display: flex; flex-direction: column; }
main.pg-home section.highlights .outer-wrap .video-wrap h3.title { padding-bottom: 15px; }
main.pg-home section.highlights .outer-wrap .video-wrap .wrap { width: 100%; height: 100%; background: url(../img/video-cover.webp); background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 3px 3px 14px rgba(255, 255, 255, 0.4); }
main.pg-home section.highlights .outer-wrap .video-wrap .wrap a { width: 100%; height: 100%; display: block; }
main.pg-home section.highlights .outer-wrap .video-wrap .wrap a i { font-size: 66px; transition: .3s; z-index: 2; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: .65; line-height: 100%; color: #ffffff; }
main.pg-home section.highlights .outer-wrap .video-wrap .wrap:hover a i { opacity: 1; transform: translate(-50%, -50%) scale(1.02); }
main.pg-home section.highlights .outer-wrap .topgame-wrap { width: calc(40% - 40px); margin-left: 40px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .wrap { display: flex; align-items: center; justify-content: space-between; padding-bottom: 15px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .wrap a.link { text-transform: capitalize; font-size: 11px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .wrap a.link i { padding-left: 5px; font-size: 10px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .wrap a.link:hover { transform: scale(1.03); }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider { margin: 0 -15px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; font-size: 22px; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #ffffff; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-arrow.slick-next { right: -13px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-arrow.slick-prev { left: -13px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots { position: absolute; bottom: -35px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots li { margin: 0 5px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots li button { font-size: 0; background-color: transparent; color: transparent; padding: 0; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots li button:before { font-family: "Font Awesome 5 Pro"; font-weight: 900; content: "\f111"; font-size: 8px; color: #ffffff; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots li button:hover { cursor: pointer; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .slick-dots li.slick-active button:before { content: "\f111"; font-weight: 900; color: #8e8e8e; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .each { width: calc(100% * 1/2 - (30px)); margin: 0 15px; }
main.pg-home section.highlights .outer-wrap .topgame-wrap .game-slider .each img { width: 100%; border-radius: 5px; border: 1px solid #ffffff; }
main.pg-home section.wheel { background: url(../img/pattern.webp); background-repeat: repeat; padding: 50px 0 100px; background-color: #ffffff; background-position: center; }
main.pg-home section.wheel .outer-wrap h3 { display: block; color: #3B5F93; padding-bottom: 15px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap { background: url(../img/spin/Wheel3.webp); background-repeat: no-repeat; height: 400px; background-position: center left; background-size: cover; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 12px rgba(2, 27, 68, 0.6); }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content { display: flex; justify-content: flex-end; overflow: hidden; height: 100%; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap { position: relative; display: flex; align-items: center; flex-direction: column; margin-right: -70px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap img.jackpotsafe { height: 450px; margin-top: -70px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap .jp-amount { margin-top: -60px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap .jp-amount h5 { color: #FBC24A; text-align: center; display: block; text-transform: uppercase; padding-bottom: 3px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap .jp-amount .each { position: relative; display: inline-block; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap .jp-amount .each img.tag { height: 25px; display: block; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .jackpot-wrap .jp-amount .each .number-meter { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-weight: 600; color: #161616; font-size: 15px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap { padding: 30px 80px 30px 0; display: flex; flex-direction: column; justify-content: space-between; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap { background: url(../img/spin/smalljackpot-bg.webp); background-repeat: no-repeat; background-position: center left; background-size: cover; border-radius: 15px; border: 1px solid #ffffff; position: relative; padding: 15px 70px 15px 15px; margin-bottom: 20px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount.silver h5 { color: #CCCCCC; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount.bronze h5 { color: #FF9864; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount h5 { color: #FBC24A; text-align: right; display: block; text-transform: uppercase; padding-bottom: 3px; padding-right: 5px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount .each { position: relative; display: inline-block; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount .each img.tag { height: 25px; display: block; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap .jp-amount .each .number-meter { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); font-weight: 600; color: #161616; font-size: 15px; }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap img.jackpotsafe { height: 120px; position: absolute; top: 58%; right: -60px; transform: translateY(-50%); }
main.pg-home section.wheel .outer-wrap .wheel-wrap .wheel-content .bonus-wrap .each-wrap:last-of-type { margin-bottom: 0; }

/*----------------------------------
4. Game Page
----------------------------------*/
main.pg-game section.game-banner { position: relative; z-index: 1; }
main.pg-game section.game-banner img { width: 100%; }
main.pg-game section.game-wrap { padding: 20px 0 100px; position: relative; z-index: 1; }
main.pg-game section.game-wrap h3 { display: block; text-align: center; color: #00a1ff; padding-bottom: 25px; }
main.pg-game section.game-wrap .outer-wrap { display: flex; flex-wrap: wrap; justify-content: center; margin: -15px; }
main.pg-game section.game-wrap .outer-wrap .each { width: calc(100% * 1/5 - (30px)); margin: 15px; position: relative; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 10px rgba(0, 161, 255, 0.3); overflow: hidden; transition: .3s; }
main.pg-game section.game-wrap .outer-wrap .each img { width: 100%; transition: .3s; }
main.pg-game section.game-wrap .outer-wrap .each .btn-wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; flex-direction: column; }
main.pg-game section.game-wrap .outer-wrap .each .btn-wrap a.btn { margin: 10px; }
main.pg-game section.game-wrap .outer-wrap .each:hover { transform: scale(1.02); }
main.pg-game section.game-wrap .outer-wrap .each:hover img { opacity: .3; }
main.pg-game section.game-wrap .outer-wrap .each:hover .btn-wrap { opacity: 1; }
main.pg-game section.game-wrap .outer-wrap .each.maintenance:hover { transform: none; }
main.pg-game section.game-wrap .outer-wrap .each.maintenance:hover img { opacity: 1; }
main.pg-game.pg-slot section.slot-game-wrap { padding: 20px 0 100px; position: relative; z-index: 1; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap { display: flex; align-items: flex-start; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap { width: 200px; margin-right: 40px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist { width: 200px; display: flex; flex-direction: column; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each { width: 100%; border: 1px solid #ffffff; border-radius: 5px; display: flex; align-items: center; background: linear-gradient(to right, #0A2048 40%, #0A1432 100%); position: relative; padding: 5px 10px; margin-bottom: 15px; transition: .3; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each img { max-width: 100%; margin: 0 auto; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each img.icon { width: 40px; position: absolute; top: -20px; right: -40px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each:last-of-type { margin-bottom: 0; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each.btnSMaintenance:hover { box-shadow: unset; border-color: #ffffff; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each.btnSMaintenance img { filter: grayscale(100); }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each.active, main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .brand-wrap .lobbylist .each:hover { box-shadow: 0 5px 10px rgba(0, 161, 255, 0.3); border-color: #00a1ff; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap { width: calc(100% - 240px); }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab { display: flex; align-items: center; justify-content: space-between; margin-bottom: 40px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .tab-wrap { display: flex; align-items: center; justify-content: flex-start; background: linear-gradient(to right, #082E66 30%, #051936 100%); border-radius: 5px; border: 1px solid #00a1ff; padding: 5px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .tab-wrap a.each { color: #ffffff; text-align: center; padding: 5px 15px; text-transform: capitalize; transition: .3s; font-weight: 700; margin: 0 10px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .tab-wrap a.each.selected, main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .tab-wrap a.each:hover { background: #00a1ff; border-radius: 8px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .filter-wrap { display: flex; flex-direction: row; justify-content: flex-end; border-radius: 8px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .filter-wrap .filter { width: 220px; max-width: 100%; position: relative; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .filter-wrap .filter input { width: 100%; height: 41px; border-radius: 5px; padding: 5px 35px 5px 15px; transition: .3s; color: #021b44; background: #ffffff; border: 1px solid #8e8e8e; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .game-tab .filter-wrap .filter i { display: flex; justify-content: center; align-items: center; position: absolute; font-size: 16px; right: 10px; top: 50%; transform: translateY(-50%); color: #021b44; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list { margin: -10px; display: flex; flex-wrap: wrap; justify-content: center; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each { width: calc(100% * 1/4 - (20px)); margin: 10px; position: relative; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 10px rgba(0, 161, 255, 0.3); }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each .cover-wrap { background: #021b44; border-radius: 5px; height: 110px; display: flex; align-items: center; overflow: hidden; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each .cover-wrap img { width: 100%; transition: .3s; border-radius: 5px; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each:hover .cover-wrap img { opacity: .5; filter: blur(2px); }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each:hover .game-title { opacity: .5; filter: blur(2px); }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each a.btn { position: absolute; top: 35px; left: 50%; transform: translateX(-50%); margin-top: 10px; opacity: 0; transition: .3s; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each:hover a.btn { opacity: 1; }
main.pg-game.pg-slot section.slot-game-wrap .outer-wrap .game-wrap .g-wrap .gp-game-list .each .game-title { width: 100%; color: #ffffff; font-weight: 600; text-transform: uppercase; text-align: center; padding: 20px 3px 5px; background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #051936 100%); border-radius: 5px; position: absolute; bottom: 0; }

/*----------------------------------
5. Register
----------------------------------*/
main.pg-register { padding: 100px 0; }
main.pg-register section.register-wrap { position: relative; z-index: 1; background: url(../img/register-bg.webp); background-repeat: no-repeat; background-position: center; background-size: cover; border-radius: 5px; border: 1px solid #ffffff; padding: 30px 80px; min-height: 80vh; display: flex; align-items: center; }
main.pg-register section.register-wrap .outer-wrap { border-radius: 5px; padding: 50px; background: rgba(0, 0, 0, 0.6); width: 450px; }
main.pg-register section.register-wrap .outer-wrap #progressbar { margin-bottom: 40px; overflow: hidden; counter-reset: step; display: flex; align-items: center; justify-content: space-between; position: relative; }
main.pg-register section.register-wrap .outer-wrap #progressbar li { list-style-type: none; position: relative; }
main.pg-register section.register-wrap .outer-wrap.step1 #progressbar li::before { content: counter(step); counter-increment: step; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; color: #ffffff; font-weight: 600; background: #0045A1; border: 2px solid #FFB636; border-radius: 50px; box-shadow: inset 0 0 25px #01050b; }
main.pg-register section.register-wrap .outer-wrap.step1 #progressbar li.active::before { background: #FFB636; box-shadow: unset; }
main.pg-register section.register-wrap .outer-wrap.step1 #progressbar::after { content: ''; width: calc(100% - 100px); height: 2px; background: #FFB636; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
main.pg-register section.register-wrap .outer-wrap.step2 #progressbar { justify-content: center; }
main.pg-register section.register-wrap .outer-wrap.step2 #progressbar::before { content: ''; width: calc(100% - 205px); height: 2px; background: #FFB636; position: absolute; left: 0; top: 50%; transform: translateY(-50%); }
main.pg-register section.register-wrap .outer-wrap.step2 #progressbar::after { content: ''; width: calc(100% - 205px); height: 2px; background: #FFB636; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
main.pg-register section.register-wrap .outer-wrap.step2 #progressbar li::before { content: "\f00c"; font-family: "Font Awesome 5 Pro"; font-weight: 400; width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; color: #ffffff; font-weight: 600; background: #FFB636; border: 2px solid #FFB636; border-radius: 50px; }
main.pg-register section.register-wrap .outer-wrap.step2 .content-wrap { text-align: center; }
main.pg-register section.register-wrap .outer-wrap.step2 .content-wrap h4 { color: #FFB636; }
main.pg-register section.register-wrap .outer-wrap.step2 .content-wrap p { color: #ffffff; font-weight: 500; }
main.pg-register section.register-wrap .outer-wrap.step2 .content-wrap .img-wrap { border-radius: 5px; border: 1px solid #ffffff; display: block; overflow: hidden; margin-top: 35px; }
main.pg-register section.register-wrap .outer-wrap.step2 .content-wrap .img-wrap img { width: 100%; display: block; }
main.pg-register section.register-wrap .outer-wrap form.register-form .btn-wrap { border-top: 1px solid #ffffff; margin: 15px 0; }
main.pg-register section.register-wrap .outer-wrap form.register-form .btn-wrap .btn { margin-top: 50px; padding: 8px 15px; width: 100%; }
main.pg-register section.register-wrap .outer-wrap .more-info { color: #ffffff; }
main.pg-register section.register-wrap .outer-wrap .more-info p:last-of-type { margin-top: 20px; }
main.pg-register section.register-wrap .outer-wrap .more-info p:last-of-type a { font-weight: 600; }
main.pg-register section.register-wrap .outer-wrap .more-info span, main.pg-register section.register-wrap .outer-wrap .more-info a { color: #00a1ff; }
main.pg-register section.success-wrap { margin-top: 35px; position: relative; z-index: 1; background: url(../img/gift-banner.webp); background-repeat: no-repeat; background-position: center left; background-size: cover; border-radius: 5px; border: 1px solid #ffffff; padding: 15px 80px; height: 180px; display: flex; align-items: center; justify-content: flex-end; }
main.pg-register section.success-wrap .content-wrap { display: flex; flex-direction: column; align-items: center; }
main.pg-register section.success-wrap .content-wrap .list-wrap { display: flex; align-items: center; margin-bottom: 20px; }
main.pg-register section.success-wrap .content-wrap .list-wrap .ico-wrap { display: flex; align-items: center; margin: 0 20px; }
main.pg-register section.success-wrap .content-wrap .list-wrap .ico-wrap img { height: 35px; }
main.pg-register section.success-wrap .content-wrap .list-wrap .ico-wrap p { color: #ffffff; font-weight: 600; font-size: 15px; text-transform: uppercase; padding-left: 10px; }

/*----------------------------------
6. 4D
----------------------------------*/
main.pg-lottery section.game-wrap .lotto-nav { display: flex; align-items: center; justify-content: center; }
main.pg-lottery section.game-wrap .lotto-nav .btn { margin: 0 15px; }
main.pg-lottery section.game-wrap .lotto-nav .btn.outlined { color: #ffffff; border-color: #ffffff; }
main.pg-lottery section.game-wrap .lotto-nav .btn.outlined:hover { background: #00a1ff; }
main.pg-lottery section.game-wrap .lotto-list { display: flex; flex-wrap: wrap; justify-content: center; padding-top: 30px; }
main.pg-lottery section.game-wrap .lotto-list .each { border-radius: 10px; overflow: hidden; margin-bottom: 30px; width: 300px; margin: 20px 10px; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-head { display: flex; flex-direction: column; color: #fff; position: relative; padding: 8px 80px 8px 15px; background-color: #000; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-head h4 { font-weight: 500; text-transform: uppercase; text-align: left; color: #fff; padding: 0; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-head .date { font-size: 14px; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-head .brand { position: absolute; right: 15px; top: calc(50% - 15px); height: 40px; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body { display: flex; flex-wrap: wrap; text-align: center; background-color: #fff; color: #000; justify-content: space-between; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body h6 { color: #fff; width: 100%; height: 30px; display: flex; justify-content: center; align-items: center; font-weight: 400; background-color: #021b44; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body li { display: block; height: 25px; display: flex; align-items: center; justify-content: center; position: relative; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body li:nth-child(3n+1), main.pg-lottery section.game-wrap .lotto-list .each .lotto-body li:nth-child(3n+2) { border-right: 1px solid #8e8e8e; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body li:last-child { border-bottom: none; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body li:last-child::before { content: ""; left: -1px; position: absolute; background: #8e8e8e; width: 1px; height: 100%; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-top3 { margin-bottom: 0; width: 100%; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small { width: 100%; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul { display: flex; flex-wrap: wrap; justify-content: center; padding: 0; background-color: #fff; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul li { width: 33.333333%; text-align: center; margin: 0; height: 25px; display: flex; align-items: center; justify-content: center; background-color: #fff; position: relative; border-bottom: 1px solid #8e8e8e; color: #8e8e8e; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul li:nth-child(3n+1), main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul li:nth-child(3n+2) { border-right: 1px solid #8e8e8e; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul li:last-child { border-bottom: none; }
main.pg-lottery section.game-wrap .lotto-list .each .lotto-body .prize-small ul li:last-child::before { content: ""; left: -1px; position: absolute; background: #8e8e8e; width: 1px; height: 100%; }
main.pg-lottery section.game-wrap .lotto-list .each#magnum .lotto-head { background-color: #00A0FF; }
main.pg-lottery section.game-wrap .lotto-list .each#pmp .lotto-head { background-color: #00ADA2; }
main.pg-lottery section.game-wrap .lotto-list .each#toto .lotto-head { background-color: #FF7050; }
main.pg-lottery section.game-wrap .lotto-list .each#singapore .lotto-head { background-color: #CD9C31; }
main.pg-lottery section.game-wrap .lotto-list .each#sabah .lotto-head { background-color: #8E8E8E; }
main.pg-lottery section.game-wrap .lotto-list .each#sarawak .lotto-head { background-color: #00507F; }

/*----------------------------------
7. Promo
----------------------------------*/
main.pg-promo section.promo-wrap { padding: 80px 0 160px; position: relative; z-index: 1; }
main.pg-promo section.promo-wrap .tab-wrap { display: inline-flex; align-items: center; justify-content: flex-start; background: linear-gradient(to right, #082E66 30%, #051936 100%); border-radius: 5px; border: 1px solid #00a1ff; padding: 5px; margin-bottom: 40px; }
main.pg-promo section.promo-wrap .tab-wrap a.each { color: #ffffff; text-align: center; padding: 5px 15px; text-transform: capitalize; transition: .3s; font-weight: 700; margin: 0 10px; }
main.pg-promo section.promo-wrap .tab-wrap a.each.selected, main.pg-promo section.promo-wrap .tab-wrap a.each:hover { background: #00a1ff; border-radius: 8px; }
main.pg-promo section.promo-wrap .outer-wrap { display: flex; flex-wrap: wrap; justify-content: center; margin: -15px; }
main.pg-promo section.promo-wrap .outer-wrap .promo-card { width: calc(100% * 1/3 - (30px)); margin: 15px; background-image: url("../img/blue-bg.webp"); background-position: center; background-size: cover; background-repeat: no-repeat; padding: 20px; border-radius: 5px; border: 1px solid #ffffff; overflow: hidden; }
main.pg-promo section.promo-wrap .outer-wrap .promo-card img { width: 100%; border-radius: 5px; border: 1px solid #ffffff; box-shadow: 0 5px 10px rgba(0, 161, 255, 0.3); }
main.pg-promo section.promo-wrap .outer-wrap .promo-card .title { color: #ffffff; font-size: 16px; margin: 10px 0; }
main.pg-promo section.promo-wrap .outer-wrap .promo-card .desc { color: #aaa; margin-bottom: 15px; height: 70px; overflow-y: auto; line-height: 16px; }
main.pg-promo section.promo-wrap .outer-wrap .promo-card .read-more-btn { text-align: right; }
main.pg-promo section.promo-wrap .outer-wrap .promo-card .read-more-btn .btn { width: 100px; }

/*----------------------------------
8. VIP
----------------------------------*/
main.pg-vip section.game-banner { position: relative; z-index: 1; }
main.pg-vip section.game-banner img { width: 100%; }
main.pg-vip section.main-wrap { position: relative; z-index: 1; padding: 20px 0 100px; }
main.pg-vip section.main-wrap .gold-text { color: #CD9C31; }
main.pg-vip section.main-wrap h4.vip-title { color: #CD9C31; text-transform: uppercase; margin-bottom: 10px; }
main.pg-vip section.main-wrap .vip-card { display: flex; align-items: center; border-radius: 5px; background: linear-gradient(to right, #001531 30%, #010914 100%); }
main.pg-vip section.main-wrap .vip-card img { width: 55%; border-radius: 5px; border: 1px solid #CD9C31; }
main.pg-vip section.main-wrap .vip-card .content-wrap { padding: 10px 40px; }
main.pg-vip section.main-wrap .vip-card .content-wrap h4 { margin-bottom: 20px; }
main.pg-vip section.main-wrap .vip-card .content-wrap p { margin-bottom: 10px; }
main.pg-vip section.main-wrap .vip-card .content-wrap p:last-of-type { margin-bottom: 0; }
main.pg-vip section.main-wrap .curr-status-wrap { margin-top: 30px; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-rank { text-align: center; padding: 0 6px; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-rank p { text-transform: capitalize; font-size: 11px; line-height: 14px; padding-top: 5px; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-status { position: relative; padding: 0 6px; margin-top: 20px; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-status::after { content: ""; position: absolute; background-image: url(../img/vip/vip-status-bg.webp); background-position: center; background-repeat: repeat-x; background-size: 100% 100%; bottom: -22px; left: 0; width: 100%; height: 80px; border-radius: 5px; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-status .col-2 { z-index: 1; text-align: center; }
main.pg-vip section.main-wrap .curr-status-wrap .vip-status .vip-stats-img { width: 60%; }
main.pg-vip section.main-wrap .curr-lev-wrap { border: 1px solid #CD9C31; border-width: 1px 0; padding-top: 35px; margin: 50px 0 35px; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap { display: flex; align-items: center; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .curr-ring { position: relative; width: 300px; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .curr-ring img { width: 100%; position: relative; z-index: 2; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .curr-ring::after { content: ""; position: absolute; background-image: url(../img/vip/vip-status-bg.webp); background-position: center; background-repeat: repeat-x; background-size: 100% 100%; bottom: 75px; left: 0; width: 100%; height: 80px; border-radius: 5px; z-index: 1; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .content-wrap { width: calc(100% - (300px)); padding-left: 40px; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .content-wrap .progress-wrap { margin: 5px 0; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .content-wrap .bottom-text { display: flex; align-items: flex-start; justify-content: space-between; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .content-wrap .bottom-text .info { width: 70%; color: #ffffff; padding-right: 30px; }
main.pg-vip section.main-wrap .curr-lev-wrap .outer-wrap .content-wrap .bottom-text .amount { display: block; }
main.pg-vip section.main-wrap .progress-wrap { border: 3px solid #002B4E; padding: 3px; background-color: #004A6E; border-radius: 18px; }
main.pg-vip section.main-wrap .progress-wrap .progress { background-color: #0A6B8B; border-radius: 13px; height: 18px; position: relative; }
main.pg-vip section.main-wrap .progress-wrap .progress::after { content: ""; width: 95%; height: 100%; position: absolute; background: linear-gradient(to right, transparent 10px, #004A6E 7px); background-size: 17px; z-index: 1; transform: skewX(45deg); left: 0; right: 0; margin: 0 auto; }
main.pg-vip section.main-wrap .progress-wrap .progress .progress-bar { background-color: #9DCDDC; z-index: 1; }
main.pg-vip section.main-wrap .line { position: relative; height: 20px; width: 100%; margin-bottom: 5px; }
main.pg-vip section.main-wrap .line::after { content: ""; position: absolute; top: 0; left: 50%; width: 2px; height: 100%; background: #8e8e8e; }
main.pg-vip section.main-wrap .none h5 { color: #8e8e8e; text-transform: uppercase; }
main.pg-vip section.main-wrap .none .line::after { background: #8e8e8e; }
main.pg-vip section.main-wrap .boss h5 { color: #ffffff; text-transform: uppercase; }
main.pg-vip section.main-wrap .boss .line::after { background: #ffffff; }
main.pg-vip section.main-wrap .big h5 { color: #00AAA0; text-transform: uppercase; }
main.pg-vip section.main-wrap .big .line::after { background: #00AAA0; }
main.pg-vip section.main-wrap .super h5 { color: #FF7A5A; text-transform: uppercase; }
main.pg-vip section.main-wrap .super .line::after { background: #FF7A5A; }
main.pg-vip section.main-wrap .mega h5 { color: #CD9C31; text-transform: uppercase; }
main.pg-vip section.main-wrap .mega .line::after { background: #CD9C31; }
main.pg-vip section.main-wrap .ultra h5 { color: #00a1ff; text-transform: uppercase; }
main.pg-vip section.main-wrap .ultra .line::after { background: #00a1ff; }
main.pg-vip section.main-wrap .vip-promo { border-bottom: 1px solid #CD9C31; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap h4 { color: #CD9C31; text-transform: uppercase; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap .list-sub .col-2 { padding: 10px 5px; text-align: center; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-head { border-bottom: 1px solid #CD9C31; padding-bottom: 20px; margin-bottom: 20px; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-head .list-wrap-item .list-sub .row { position: relative; z-index: 2; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-head .list-wrap-item .list-sub::after { content: ""; position: absolute; background-image: url(../img/vip/vip-status-bg.webp); background-position: center; background-repeat: repeat-x; background-size: 100% 100%; bottom: 25px; left: 0; width: 100%; height: 60px; border-radius: 5px; z-index: 1; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-head .list-wrap-item .list-sub .each img.vip-stats-img { width: 100%; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-info { margin-bottom: 60px; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-info h4 { margin-bottom: 20px; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-info .list-wrap-item .list-sub .each { padding: 10px 0; border-right: 1px solid #25253A; }
main.pg-vip section.main-wrap .vip-promo .outer-wrap .list-wrap-info .list-wrap-item .list-sub .each p { color: #CD9C31; }
main.pg-vip section.main-wrap .vip-tnc { padding-top: 30px; }

/*----------------------------------
9. Member
----------------------------------*/
main.pg-tournament section.game-banner { position: relative; z-index: 1; background: url(../img/banner/tournament-banner.webp); background-repeat: no-repeat; background-position: center; background-size: cover; height: 600px; display: flex; align-items: center; }
main.pg-tournament section.game-banner .container { display: flex; flex-direction: column; align-items: flex-end; }
main.pg-tournament section.game-banner .content-wrap h4.gold-text { text-align: left; color: #CD9C31; margin-bottom: 10px; }
main.pg-tournament section.game-banner .content-wrap .clock-wrap { position: relative; height: 60px; margin-bottom: 30px; }
main.pg-tournament section.game-banner .content-wrap .clock { width: fit-content; margin: auto; display: flex; justify-content: center; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-wrapper ul { width: 40px; height: 45px; line-height: 45px; margin: 1px; background: #ffffff; border: 2px solid #CD9C31; border-radius: 8px; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-wrapper ul li { line-height: 40px; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-divider { width: 7px; height: 45px; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-divider:first-child { width: 0 !important; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-divider .flip-clock-label { color: #ffffff !important; top: auto; right: -60px; bottom: -25px; font-size: 14px; text-transform: uppercase; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-divider.hours .flip-clock-label { right: -67px; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-divider.minutes .flip-clock-label, main.pg-tournament section.game-banner .content-wrap .flip-clock-divider.seconds .flip-clock-label { right: -75px; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-wrapper ul li a div div.inn { background-color: #ffffff; font-size: 20px; font-weight: 500; text-shadow: none !important; color: #00a1ff !important; }
main.pg-tournament section.game-banner .content-wrap .flip-clock-dot { display: none; }
main.pg-tournament section.leaderboard { padding-bottom: 100px; }
main.pg-tournament section.leaderboard .tourn-date { width: 100%; text-align: center; display: flex; align-items: center; justify-content: center; }
main.pg-tournament section.leaderboard .tourn-date p { text-transform: capitalize; color: #F7B839; padding: 0 20px; font-weight: 500; font-size: 15px; }
main.pg-tournament section.leaderboard .tourn-date p:first-of-type { border-right: 1px solid #F7B839; }
main.pg-tournament section.leaderboard .date-list { width: 100%; padding: 10px 60px; margin-top: 30px; border-radius: 5px; border: 1px solid #ffffff; background: linear-gradient(to bottom, #082E66 0%, #051936 100%); }
main.pg-tournament section.leaderboard .date-list .slick-arrow { position: absolute; z-index: 9; top: 0; display: flex; align-items: center; justify-content: center; width: 20px; height: 100%; color: #ffffff; cursor: pointer; font-size: 20px; transition: .3s; }
main.pg-tournament section.leaderboard .date-list .slick-arrow.slick-disabled { opacity: .2; }
main.pg-tournament section.leaderboard .date-list .slick-arrow.fa-chevron-right { right: 20px; }
main.pg-tournament section.leaderboard .date-list .slick-arrow.fa-chevron-left { left: 20px; }
main.pg-tournament section.leaderboard .date-list .each { display: flex; align-items: center; flex-direction: column; border-radius: 5px; overflow: hidden; transition: .3s; margin: 0 5px; padding: 10px; }
main.pg-tournament section.leaderboard .date-list .each.slick-current { background: #00a1ff; }
main.pg-tournament section.leaderboard .date-list .each.slick-current span.day, main.pg-tournament section.leaderboard .date-list .each.slick-current span.date { color: #ffffff; }
main.pg-tournament section.leaderboard .date-list .each span.date { color: #F7B839; font-weight: 500; font-size: 15px; border-bottom: 1px solid #ffffff; display: block; width: 100%; text-align: center; padding-bottom: 3px; }
main.pg-tournament section.leaderboard .date-list .each span.day { color: #ffffff; font-weight: 500; text-transform: capitalize; display: block; width: 100%; text-align: center; padding-top: 3px; }
main.pg-tournament section.leaderboard .date-list .each:hover { cursor: pointer; background: #00a1ff; }
main.pg-tournament section.leaderboard .date-list .each:hover span { color: #ffffff; }
main.pg-tournament section.leaderboard .winner-list { border-radius: 5px; border: 1px solid #ffffff; margin-top: 40px; padding: 10px 60px; background: rgba(0, 0, 0, 0.4); }
main.pg-tournament section.leaderboard .winner-list .each table { width: 100%; text-align: center; border-collapse: separate; border-spacing: 0 20px; }
main.pg-tournament section.leaderboard .winner-list .each table th { color: #ffffff; font-weight: 500; text-transform: capitalize; font-size: 15px; padding-bottom: 5px; }
main.pg-tournament section.leaderboard .winner-list .each table tbody td { padding: 15px 0; }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr { padding: 3px; }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr:nth-child(-n+3) { background: linear-gradient(to bottom, #082E66 0%, #051936 100%); }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr:nth-child(-n+3) .rank { width: 30px; height: 30px; color: #ffffff; background: radial-gradient(50% 50% at center, #0045a1 0.56%, #051835 100%); display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid #F7B839; margin: auto; font-weight: 500; }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr:nth-child(-n+3) td { border-top: 1px solid #CD9C31; border-bottom: 1px solid #CD9C31; }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr:nth-child(-n+3) td:first-child { border-radius: 5px 0 0 5px; border-left: 1px solid #CD9C31; }
main.pg-tournament section.leaderboard .winner-list .each table tbody tr:nth-child(-n+3) td:last-child { border-radius: 0 5px 5px 0; border-right: 1px solid #CD9C31; }
main.pg-tournament section.leaderboard .winner-list .each table tbody .up { width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 10px solid #00AAA0; margin: auto; }
main.pg-tournament section.leaderboard .winner-list .each table tbody .down { width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 10px solid #F90808; margin: auto; }
main.pg-tournament section.leaderboard .winner-list .each table tbody .none::after { content: "-"; }

/*----------------------------------
10. Member
----------------------------------*/
main.pg-member { padding: 80px 0 100px; }
main.pg-member section.main-mem-wrap { position: relative; z-index: 1; display: flex; }
main.pg-member section.main-mem-wrap section.member-nav { background-image: url("../img/blue-bg.webp"); background-position: center; background-size: cover; background-repeat: no-repeat; border-radius: 5px; width: 240px; padding: 40px 30px 140px; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap { padding-bottom: 30px; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .pp { width: 100px; height: 100px; border-radius: 100px; margin: 0 auto; display: flex; align-items: center; justify-content: center; overflow: hidden; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .pp img { width: 100%; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap { padding: 40px 15px 0; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap span { display: block; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap span.username, main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap span.level { font-size: 14px; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap span.level { text-transform: uppercase; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap span.title { color: #00a1ff; text-transform: capitalize; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .profile-wrap .wrap .mem-lev { padding-top: 5px; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap { border-top: 1px solid #ffffff; padding: 35px 0; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap h4 { padding: 0 15px 20px; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap a.link-each { margin-bottom: 10px; display: block; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap a.link-each span { display: block; padding: 5px 15px; transition: .3s; text-transform: capitalize; color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap a.link-each span:hover { cursor: pointer; background: #00a1ff; border-radius: 5px; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap a.link-each.active span { background: #00a1ff; border-radius: 5px; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap a.link-each:last-of-type { margin-bottom: 0; }
main.pg-member section.main-mem-wrap section.member-nav .outer-wrap .nav-wrap:last-of-type { border-bottom: 1px solid #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap { width: calc(100% - (270px)); margin-left: 30px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ { padding-top: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap { display: flex; align-items: center; border-bottom: 1px solid #ffffff; padding-bottom: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap .mem-lev { display: flex; align-items: center; padding-right: 40px; border-right: 1px solid #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap .mem-lev .ico-vip { width: 60px; margin-right: 20px; margin-bottom: -30px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap .mem-lev .ico-vip img { width: 100%; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap .detail-wrap { display: flex; align-items: center; padding-left: 30px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap .detail-wrap .wrap:first-of-type { padding-right: 80px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap span { display: block; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap span.title { text-transform: capitalize; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .outer-wrap span.det { text-transform: uppercase; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap { padding-top: 30px; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap span.title { text-transform: capitalize; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap { display: flex; align-items: flex-start; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap span.curr { text-transform: uppercase; font-size: 20px; line-height: 60px; padding-right: 10px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap span.bal { font-size: 54px; font-weight: 500; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap button.refresh-btn { background: transparent; color: #00a1ff; font-size: 24px; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap button.refresh-btn .fa-redo-alt { transition: .8s ease-out; -webkit-transition: .8s ease-out; -moz-transition: .8s ease-out; }
main.pg-member section.main-mem-wrap section.member-content-wrap section.profile-summ .wallet-bal-wrap .bal-wrap button.refresh-btn:hover .fa-redo-alt { transform: rotateZ(720deg); -webkit-transform: rotateZ(720deg); -moz-transform: rotateZ(720deg); }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap { margin-top: 20px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin: -5px; line-height: 1; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance p { margin: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; color: #ffffff; overflow: hidden; display: flex; justify-content: center; align-items: center; flex-direction: column; width: 150px; height: 70px; flex-grow: 1; margin: 5px; transition: .5s; position: relative; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box .title { margin-bottom: 8px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box .playnow { display: flex; width: 100%; height: 100%; position: absolute; z-index: 2; left: 0; top: 0; justify-content: center; align-items: center; flex-direction: column; transition: .5s; opacity: 0; color: #ffffff; text-transform: uppercase; font-weight: 600; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box .amount { font-weight: 600; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box.total { width: 100%; flex-direction: row; border: 0; justify-content: space-between; background: transparent; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box.total .title { margin: 0; font-size: 16px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box.total .amount { color: #00a1ff; font-size: 22px; font-weight: 600; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box:hover .playnow { opacity: 1; background-color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box:first-child { width: 100%; flex-direction: row; justify-content: space-between; padding: 5px 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box:first-child .title { margin: 0; font-size: 14px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .credit-balance .box:first-child .amount { font-size: 16px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .member-info { display: flex; align-items: flex-start; justify-content: space-between; margin: 0 -15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .member-info .wrap { width: calc(100% * 1/3 - (30px)); margin: 0 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .member-info .wrap .info-row { margin-bottom: 25px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .member-info .wrap .info-row label { color: #00a1ff; font-weight: 500; text-transform: capitalize; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .member-info .wrap .info-row .info { text-transform: capitalize; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-password { max-width: 500px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-password .form-action { text-align: right; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap h4.title { color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap p.des { padding: 10px 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .btn.outlined-blue { text-transform: capitalize; font-weight: 500; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .referral-qr { display: flex; align-items: center; justify-content: space-between; width: 80%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .referral-qr .content-wrap { width: 60%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .referral-qr .qr-wrap { width: 120px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .referral-qr .qr-wrap img { width: 100%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .invite-wrap { margin-top: 40px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .invite-wrap .copy-link { display: flex; align-items: center; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .invite-wrap .copy-link .form-item { min-width: 330px; text-align: center; padding: 10px 40px; background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; color: #ffffff; margin-right: 20px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .turnover-link-wrap { margin-top: 30px; margin-bottom: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details { margin-top: 50px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details h4 { margin-bottom: 15px; margin-left: -15px; margin-top: 50px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .gray-table-wrap { border: 1px solid #8e8e8e; border-radius: 5px; overflow: hidden; width: 500px; max-width: 100%; margin: 30px 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table { color: #8e8e8e; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table tr:first-of-type th, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table tr:first-of-type td { border-top: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table th { text-align: left; border-right: 1px solid #8e8e8e; border-color: #8e8e8e; padding: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table td { text-align: center; border-color: #8e8e8e; padding: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap .data-details .table td:not(:last-child) { border-right: 1px solid #8e8e8e; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap ol li, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .referral-wrap ol p { margin-bottom: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; padding-bottom: 0; margin-bottom: 40px; display: flex; justify-content: center; flex-wrap: wrap; position: relative; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap .each { width: calc(100% * 1/2 - (30px)); margin: 15px; padding: 10px 0; text-align: center; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap .each a { display: inline-block; text-transform: capitalize; color: #ffffff; font-weight: 500; font-size: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap .each a:hover, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap .each a.active { color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .turnover-link-wrap .each:first-of-type::after { content: ''; display: block; width: 1px; height: calc(100% - 30px); background: #0D72B9; position: absolute; left: 50%; transform: translateX(-50%); top: 15px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .btn-wrap { justify-content: flex-end; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .btn-wrap .form-action { margin-right: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .btn { padding: 10px 40px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file { width: unset; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file .custom-file-input { width: unset; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file .custom-file-input:hover { cursor: pointer; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file .custom-file-input:focus ~ .custom-file-label { box-shadow: none; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file .custom-file-label { height: unset; border: 1px solid #00a1ff; margin-bottom: 0; top: -1px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .custom-file .custom-file-label::after { display: none; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap h4.form-title { color: #00a1ff; font-weight: 500; margin-bottom: 15px; margin-top: 20px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group { margin-bottom: 20px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group label.input-label { color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .blue-box { background-color: #182D55; border: 1px solid #0D72B9; border-radius: 5px; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.form-flex { display: flex; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.form-flex .leftbox { min-width: 180px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.form-flex .leftbox label.input-label { color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.form-flex .rightbox { min-width: 400px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.form-flex .rightbox .form-item:nth-child(2) { margin-top: 5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; padding-bottom: 0; margin-bottom: 50px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img { display: flex; justify-content: center; flex-wrap: wrap; padding: 8px 0; margin: 0 -5px; position: relative; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each { width: calc(100% * 1/3 - (10px)); margin: 0 5px; border-right: 1px solid #0D72B9; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each input { display: block; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each label.opt-label { height: 80px; border-radius: 5px; padding: 0 8px; margin-bottom: 0; transition: .3s; position: relative; cursor: pointer; color: #ffffff; display: flex; align-items: center; justify-content: center; flex-direction: column; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each label.opt-label i { font-size: 24px; margin-bottom: 3px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each label.opt-label span { margin-top: 3px; text-align: center; text-transform: capitalize; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each:hover label.opt-label, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each.checked label.opt-label { color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.payment-opt .method-img .each:last-of-type { border-right: unset; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .rightbox { width: calc(100% - 180px); }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; padding: 15px 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .row-wrap { display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 10px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .row-wrap:last-of-type { margin-bottom: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .each { display: flex; justify-content: center; align-items: center; width: calc(100% * 1/4 - (10px)); text-align: center; border-right: 1px solid #ffffff; margin: 15px 5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .each label.opt-label { transition: .3s; position: relative; margin: 0; cursor: pointer; color: #ffffff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .each label.opt-label img { width: 85px; display: block; margin: auto; padding-bottom: 5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .each.checked label.opt-label { color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.bank-opt .radio-img .each:last-child { border-right: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.date-selection .date-wrap { display: flex; align-items: center; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.date-selection .date-wrap .wrap { display: flex; align-items: center; width: 100%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.date-selection .date-wrap .wrap span { font-size: 15px; padding: 0 10px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group.date-selection .date-wrap .form-action { margin-left: 30px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list { display: flex; flex-wrap: wrap; margin: -5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each { width: calc(100% * 1/3 - (10px)); margin: 5px; display: flex; align-items: center; cursor: pointer; flex-wrap: wrap; overflow: hidden; position: relative; border-radius: 5px; overflow: hidden; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each img { width: 100%; transition: .3s; display: block; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each img ~ i { font-size: .85rem; transition: .3s; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: flex-end; align-items: flex-end; border: 1px solid #ffffff; border-radius: 5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each img ~ i::before { font-size: 20px; transition: .5s; transform: scale(0); color: white; z-index: 2; text-shadow: 0 0 8px #3B5F93; padding: 15px; color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each input[type="radio"] { display: none; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each input[type="radio"]:checked ~ img { opacity: .3; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each input[type="radio"]:checked ~ img ~ i { border-color: #00a1ff; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .form-group .promo-list label.each input[type="radio"]:checked ~ img ~ i::before { transform: scale(1); }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap { display: flex; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap .wrap { width: 100%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap .transfer-arrow-wrap { position: relative; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap .transfer-arrow-wrap::before { content: ""; display: block; border: 1px solid #ffffff; border-width: 1px 1px 0 0; height: 40px; width: 30px; position: absolute; top: 18px; left: 10px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap .transfer-arrow-wrap::after { content: ""; display: block; border: 1px solid #ffffff; border-width: 0 1px 1px 0; height: 40px; width: 30px; position: absolute; bottom: 54px; left: 10px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .transfer-wrap .transfer-arrow-wrap img { width: 30px; position: absolute; top: calc(50% - 35px); left: 25px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap form.form-transfer .rightbox { width: 100%; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table-wrap { background: #182D55; border: 1px solid #0D72B9; border-radius: 5px; overflow: hidden; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table { color: #ffffff; margin-bottom: 0; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table i { font-size: 20px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table th, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table td { border-color: #00a1ff; text-align: center; vertical-align: middle; padding: 10px 5px; font-weight: 500; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table th small, main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table td small { display: block; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table thead th { border: 0; background-color: rgba(0, 161, 255, 0.4); text-transform: uppercase; padding: 10px 5px; font-weight: 600; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table tbody th { padding: 15px 5px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table tbody tr.approve { color: lime; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table tbody tr.reject { color: red; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table tbody td a { color: #00a1ff; font-weight: 500; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table-history tbody td:last-child:not(:first-child) { font-size: 14px; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table-turnover tbody { text-transform: uppercase; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table-turnover tbody tr:first-child { text-transform: lowercase; }
main.pg-member section.main-mem-wrap section.member-content-wrap .form-mem-wrap .table-turnover tbody tr:last-child td { padding: 15px 5px; font-weight: 500; }

/*----------------------------------
12. Info
----------------------------------*/
main.pg-info { padding: 60px 0 100px; }
main.pg-info section.info-wrap { position: relative; z-index: 1; margin: 0 auto; padding: 40px 50px; border-radius: 5px; background: linear-gradient(to bottom, #001531 30%, #010914 100%); border: 1px solid #FFB636; }
main.pg-info section.info-wrap .t-title h3 { margin-bottom: 20px; color: #FFB636; }
main.pg-info section.info-wrap .each { margin-bottom: 15px; color: #ffffff; }
main.pg-info section.info-wrap .each h5 { font-size: 16px; color: #00a1ff; margin-bottom: 5px; font-weight: 500; text-transform: capitalize; }
main.pg-info section.info-wrap .each p { margin-bottom: 10px; }
main.pg-info section.info-wrap .each p:last-of-type { margin-bottom: 0; }
main.pg-info section.info-wrap .each ol { margin-bottom: 10px; }
main.pg-info section.info-wrap .each:last-of-type { margin-bottom: 0; }

/*----------------------------------
12. Lucky Wheel
----------------------------------*/
main.pg-wheel { position: relative; background: linear-gradient(to bottom, #11294E 30%, #000314 100%); padding-bottom: 100px; }
main.pg-wheel section.wheel-wrap { position: relative; z-index: 1; background-image: url(../img/spin/lucky-wheel-bg.webp); background-size: 100% auto; background-position: center top; background-repeat: no-repeat; width: 100%; height: 100%; top: 0; padding: 60px 0 30px; }
main.pg-wheel section.wheel-wrap .main-wrap { display: flex; align-items: center; justify-content: center; position: relative; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap { padding-top: 60px; position: absolute; left: 0; top: 0; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame { border: 1px solid #CD9C31; background: linear-gradient(#000314 0%, #0D2E55 20%, #000314 100%); overflow-x: auto; border-radius: 5px; padding: 10px 5px; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box { position: relative; text-align: center; margin: 20px 15px; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box img { width: 60%; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .question-mark { position: absolute; right: 0; border-radius: 50%; background-color: #fff; opacity: 1; width: 15px; height: 15px; font-size: 12px; color: #021b44; font-weight: bold; display: flex; justify-content: center; align-items: center; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap { width: 100%; display: flex; justify-content: center; align-items: center; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap .dot { background: transparent; min-width: 10px; height: 10px; border-radius: 50%; margin: 0 3px; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.gold .dot { border: 1px solid #CD9C31; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.gold .dot.full { background: #CD9C31; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.silver .dot { border: 1px solid #D1D1D1; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.silver .dot.full { background: #D1D1D1; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.bronze .dot { border: 1px solid #FF865C; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.bronze .dot.full { background: #FF865C; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.normal .dot { border: 1px solid #91622F; }
main.pg-wheel section.wheel-wrap .main-wrap .chest-wrap .chest-frame .chest-box .dot-wrap.normal .dot.full { background: #91622F; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap { display: flex; flex-direction: column; justify-content: center; width: 50%; margin: 0 auto; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl { margin-top: 40px; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl .wrap { display: flex; justify-content: center; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl .box-frame { border: 1px solid #CD9C31; background: linear-gradient(#000314 0%, #0D2E55 20%, #000314 100%); width: 75px; padding: 15px 5px; border-radius: 5px; margin: 0 30px; transition: .3s; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl .box-frame:hover { transform: scale(1.02); }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl .box-frame .icon-frame { width: 45px; height: 45px; border: 2px solid #CD9C31; display: flex; align-items: center; justify-content: center; border-radius: 50px; background: radial-gradient(50% 50% at center, #0045a1 0.56%, #051835 100%); font-size: 20px; color: #ffffff; margin: 0 auto; }
main.pg-wheel section.wheel-wrap .main-wrap .mid-wrap .wheel-ctrl .box-frame p { text-align: center; color: #ffffff; font-weight: 600; line-height: 14px; margin-top: 8px; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board { position: absolute; right: -70px; top: 80px; height: 360px; width: 340px; text-align: center; padding: 50px 0 110px; display: flex; flex-direction: column; justify-content: center; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board::before { content: ""; position: absolute; background-image: url(../img/spin/white-board.webp); background-position: center; background-repeat: no-repeat; background-size: contain; width: 100%; height: 100%; top: 0; bottom: 0; left: 0; right: 0; margin: 0 auto; overflow: visible; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board p { position: relative; margin: auto; font-weight: 700; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board p.dark-blue-text { color: #2E3192; margin: 5px 0; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board p.spin-count { color: #00a1ff; font-size: 22px; margin-bottom: 20px; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board p.rm { color: #EDB252; font-size: 24px; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board p.amount { color: #EDB252; font-size: 14px; margin-top: 5px; border: 2px solid #2E3192; border-radius: 8px; display: inline-block; padding: 3px 10px; }
main.pg-wheel section.wheel-wrap .main-wrap .white-board .btn.claim-now { position: relative; background: radial-gradient(#edb252 0%, #ebaf4f 33.8%, #e5a847 53.21%, #da9c39 68.97%, #cb8a25 82.78%, #b8740c 95.2%, #b06a00 100%); border: 1px solid #CD9C31; color: #021b44; font-weight: 500; padding: 5px 10px; margin: 30px auto 0; border-radius: 50px; transform: scale(0.8); }
main.pg-wheel .wheel-chest { display: flex; align-items: center; justify-content: center; padding-top: 30px; }
main.pg-wheel .wheel-chest .wrap { width: 250px; display: block; background: #161616; border: 1px solid #CD9C31; border-radius: 5px; margin: 0 10px; overflow: hidden; }
main.pg-wheel .wheel-chest .wrap img { width: 100%; }
main.pg-wheel .wheel-chest .wrap .zoom-img { scale: 1.5; }
main.pg-wheel .wheel-chest .wrap .jackpot1-zoom-img { scale: 1.6; }
main.pg-wheel .wheel-chest .wrap .jp-amount { margin-bottom: 15px; }
main.pg-wheel .wheel-chest .wrap .jp-amount h5 { color: #FBC24A; text-align: center; font-size: 14px; display: block; text-transform: uppercase; padding-bottom: 3px; }
main.pg-wheel .wheel-chest .wrap .jp-amount .each { position: relative; display: inline-block; left: 50%; transform: translateX(-50%); }
main.pg-wheel .wheel-chest .wrap .jp-amount .each img.tag { height: 23px; display: block; width: auto; margin: auto; }
main.pg-wheel .wheel-chest .wrap .jp-amount .each .number-meter { position: absolute; top: 0; line-height: 23px; right: 10px; font-weight: 500; color: #161616; font-size: 15px; }
main.pg-wheel .wheel-chest .wrap .jp-amount .each .number-meter span { display: block; }
main.pg-wheel section.big-winner { border: 1px solid #CD9C31; padding-bottom: 50px; position: relative; margin: 30px 0; border-radius: 5px; background: #000619; background: url(../img/spin/big-win-banner.webp); background-repeat: no-repeat; background-position: center top; background-size: 100%; }
main.pg-wheel section.big-winner .outer-wrap { padding: 40px 80px; }
main.pg-wheel section.big-winner .outer-wrap h3.gold-text { display: block; text-align: center; color: #FBC24A; padding-bottom: 40px; }
main.pg-wheel section.big-winner .outer-wrap table { width: 100%; text-align: center; padding: 0 15px; table-layout: fixed; font-weight: 500; }
main.pg-wheel section.big-winner .outer-wrap table tbody { color: #ffffff; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr { background: rgba(0, 27, 127, 0.3); }
main.pg-wheel section.big-winner .outer-wrap table tbody tr:nth-child(2n) { background: transparent; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr td { padding: 15px 5px; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr td:first-child { border-radius: 5px 0 0 5px; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr td:last-child { border-radius: 0 5px 5px 0; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr .amount-td { width: 195px; padding-right: 40px; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr .amount-frame { position: relative; height: 24px; padding-left: 23px; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr .amount-frame::before { content: ""; position: absolute; background-image: url(../img/spin/1-tag.webp); background-position: left; background-repeat: no-repeat; background-size: contain; width: 100%; height: 24px; left: 0; }
main.pg-wheel section.big-winner .outer-wrap table tbody tr .amount-frame span { color: #000; line-height: 24px; position: relative; display: block; }
main.pg-wheel section.big-winner .outer-wrap::after { content: ""; position: absolute; background-image: url(../img/spin/big-win-icon.webp); background-position: center; background-repeat: no-repeat; background-size: 100%; width: 240px; height: 240px; right: -215px; transform: translateX(-50%); bottom: -25%; }

#segment-wheel { display: flex; justify-content: center; align-items: center; position: relative; padding-top: 30px; }

#segment-wheel::before { content: ""; position: absolute; background-image: url(../img/wheel/top-arrow.webp); background-position: center; background-repeat: no-repeat; background-size: contain; width: 100%; height: 25px; left: 50%; top: 0; transform: translateX(-50%); }

#segment-wheel #wheel-container { width: 100%; position: relative; }

#segment-wheel #the-wheel-frame, #segment-wheel #the-wheel, #segment-wheel #the-shadow { pointer-events: none; }

#segment-wheel #the-wheel-frame, #segment-wheel #the-wheel, #segment-wheel #the-shadow, #segment-wheel #the-button { background-size: contain; background-repeat: no-repeat; background-position: center; }

#segment-wheel #the-wheel-frame, #segment-wheel #the-wheel, #segment-wheel #the-shadow, #segment-wheel #the-button, #segment-wheel #result-ticker { position: absolute; overflow: hidden; }

#segment-wheel #the-frame { width: 100%; padding-top: 100%; border-radius: 50%; box-shadow: 0 0 15px black; }

#segment-wheel #the-wheel-frame { z-index: 24; background-image: url("../img/wheel/the-wheel-outer-glow.webp"); top: 0; left: 0; right: 0; bottom: 0; }

#segment-wheel #the-wheel { z-index: 18; background-image: url("../img/wheel/the-wheel.webp"); filter: contrast(1.5); top: 0; left: 0; right: 0; bottom: 0; border-radius: 100%; }

#segment-wheel #the-wheel[state=spinning] { animation: pulseSpin 0.25s alternate infinite; }

#segment-wheel #the-button { z-index: 22; background-image: url("../img/wheel/the-wheel-spin.webp"); cursor: pointer; top: 40%; left: 40%; right: 40%; bottom: 40%; }

#segment-wheel #the-shadow { z-index: 20; background-image: url("../img/wheel/the-shadow.webp"); top: 0; left: 0; right: 0; bottom: 0; transition: opacity 0.5s; opacity: 0; }

#segment-wheel #the-shadow.is-spinning, #segment-wheel #the-shadow[state=spinning] { opacity: 1; }

#segment-wheel #result-ticker { position: static; transition: .5s; opacity: 0; background: rgba(28, 24, 46, 0.3); border: 1px solid #534054; box-sizing: border-box; box-shadow: 0px 4px 10px #1e1b30; border-radius: 5px; padding: 15px 15px; position: relative; overflow: hidden; display: flex; flex-direction: column; text-align: center; justify-content: center; margin-top: 30px; min-height: 80px; }

#segment-wheel #result-ticker.is-visible { opacity: 1; }

#segment-wheel #result-ticker h4 { margin: 0; font-size: 18px; text-transform: uppercase; position: absolute; padding: 8px 25px; top: 24px; right: -35px; width: 150px; z-index: 1; text-transform: uppercase; font-size: 14px; line-height: 1; background: #4c3b50; color: white; transform: rotate(45deg); text-align: center; }

#segment-wheel #result-ticker .each { display: block; text-align: left; color: white; z-index: 2; text-transform: capitalize; margin: 0; padding: 0; margin-top: 8px; font-size: 14px; }

#segment-wheel #result-ticker .each:nth-of-type(1) { font-weight: 600; color: #8ffe00; text-shadow: 2px 0 5px black; font-size: 14px; }

#segment-wheel #result-ticker .each:nth-of-type(2) { opacity: 0.8; }

#segment-wheel #result-ticker .each:nth-of-type(3) { opacity: 0.6; }

#segment-wheel #result-ticker .each:nth-of-type(4) { opacity: 0.4; }

#segment-wheel #result-ticker .each:nth-of-type(5) { opacity: 0.2; }

#segment-wheel #result-ticker div { padding: 0 5px 8px; }

#segment-wheel #result-ticker div p { white-space: nowrap; font-size: 1rem; text-transform: uppercase; font-weight: 600; padding-bottom: 0.25rem; color: #ffb400; }

#segment-wheel .wheel-right { max-width: calc(40% - 30px); display: flex; justify-content: flex-start; flex-direction: column; }

#segment-wheel .wheel-bonus { display: flex; flex-direction: column; }

#segment-wheel .wheel-bonus .each { display: flex; align-items: flex-start; justify-content: flex-start; }

#segment-wheel .wheel-bonus .each:not(:last-child) { margin-bottom: 30px; }

#segment-wheel .wheel-bonus .each .left { margin-right: 8px; }

#segment-wheel .wheel-bonus .each .left img { width: 60px; }

#segment-wheel .wheel-bonus .each .right { position: relative; display: flex; flex-direction: column; padding-right: 20px; }

#segment-wheel .wheel-bonus .each .right .wb-progress { display: flex; width: 150px; justify-content: space-between; align-items: center; }

#segment-wheel .wheel-bonus .each .right .wb-progress i { color: white; opacity: .3; }

#segment-wheel .wheel-bonus .each .right .wb-progress i.active { opacity: 1; transition: .5s; transform: scale(1.3); }

#segment-wheel .wheel-bonus .each .right .info { display: block; font-size: 20px; color: white; opacity: .8; top: -2px; right: 0; position: absolute; }

#segment-wheel .wheel-bonus .each .claim .claim-bonus-active { display: inline-block; transform: skewX(-15deg); color: #1a162d; margin-top: 10px; text-transform: uppercase; padding: 5px 8px; font-weight: 600; line-height: 1; }

#segment-wheel .wheel-bonus .each#wb-diamond i.active { color: #ffb606; }

#segment-wheel .wheel-bonus .each#wb-diamond .claim-bonus-active { background-color: #ffb606; }

#segment-wheel .wheel-bonus .each#wb-club i.active { color: #4fff0f; }

#segment-wheel .wheel-bonus .each#wb-club .claim-bonus-active { background-color: #4fff0f; }

#segment-wheel .wheel-bonus .each#wb-heart i.active { color: #ff0ad3; }

#segment-wheel .wheel-bonus .each#wb-heart .claim-bonus-active { background-color: #ff0ad3; color: white; }

#segment-wheel .wheel-bonus .each#wb-spade i.active { color: #32e3ff; }

#segment-wheel .wheel-bonus .each#wb-spade .claim-bonus-active { background-color: #32e3ff; }

#segment-wheel .wheel-bonus .each h4 { font-size: 18px; text-transform: capitalize; line-height: 1; }

/*# sourceMappingURL=style.css.map */
