.content {
   display: none;
 }

 .content.visible {
   display: block;
 }

 .main-content {
   overflow-y: auto;
   padding-bottom: 20%;
   /* for bottom */
 }

 .site-nav-marquee {
   display: flex;
   line-height: 25px;
   align-items: center;
   background: var(--marquee-bg);
   border: 1px solid var(--marquee-border);
   border-radius: 5px;
 }

 .site-nav-marquee i {
   padding: 5px;
 }

 .site-nav-marquee .elem1 {
   font-size: 12px;
   letter-spacing: 0.8px;
   white-space: nowrap;
 }

 #footer-bar {
   display: none;
 }

 @media (max-width: 550px) {

   /*  .app-header {
     display: none;
   }

   #sidebar {
     display: none;
   } */

   #footer-bar {
     display: flex;
   }

   .site-header3 {
     display: none;
   }

   .containerspe {
     margin: auto;
   }
 }

 /*-Footer Menu-*/
 #footer-bar {
   padding: 0px 10px;
   position: fixed;
   bottom: 0px;
   left: 0px;
   right: 0px;
   z-index: 98;
   backdrop-filter: blur(10px);
   -webkit-backdrop-filter: blur(10px);
   background: rgba(255, 255, 255, 0.55);
   box-shadow: 0 -5px 5px 0 rgba(0, 0, 0, 0.04);
   /* height: 60px; */
   height: calc(65px + (env(safe-area-inset-bottom))*1.1);
   text-align: center;
   transition: all 250ms ease;
   align-items: center;
   background: var(--custom-footernav-bg);

 }

 #footer-bar a:not(.btn) {
   position: relative;
   /* flex: 1 1 auto; */
   flex: 1 1 0;
   color: #fff;
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
 }

 #footer-bar a:not(.btn) span {
   position: relative;
   z-index: 2;
   display: block;
   font-size: 11px;
   font-weight: 300;
   line-height: 1.2;
   margin-top: 5px;
   /* opacity: 0.7; */
   font-family: "Poppins", sans-serif !important;
 }

 #footer-bar a:not(.btn) i {
   display: block;
   font-size: 22px;
   position: relative;
   z-index: 2;
 }

 #footer-bar .badge {
   display: inline-block !important;
   min-width: 10px;
   height: 10px;
   right: 30px;
   top: 10px;
   border-radius: 50%;
   height: 15px;
   min-width: 15px;
   line-height: 16px;
   font-size: 8px;
   font-style: normal;
   border-radius: 15px;
   text-align: center;
   padding: 0px;
   position: absolute;
   top: 8px;
   margin-right: -5px;
   z-index: 3;
 }

 #footer-bar .btn {
   padding-top: 9px;
   margin-top: 9px;
   height: 38px;
 }

 #footer-bar .badge-text {
   padding: 0px 5px;
 }

 .footer-bar-no-text .active-nav {
   margin-top: 22px;
 }

 .footer-bar-no-text .active-nav i {
   padding-top: 2px;
 }

 .footer-bar-no-text i {
   padding-top: 8px;
 }

 #footer-bar.position-relative {
   z-index: 90 !important;
 }

 .footer-bar .active-nav {
   color: #1f1f1f;
 }

 .footer-bar .active-nav span {
   padding-top: 17px;
   font-weight: 600 !important;
   font-size: 13px !important;
   /* color: #fff !important; */
 }

 .footer-bar .active-nav i {
   position: absolute !important;
   width: 55px;
   height: 55px;
   left: 50%;
   margin-left: -28px;
   transform: translateY(-33px);
   border-radius: 22px;
   line-height: 55px;
   font-size: 26px !important;
 }

 .theme-light #footer-bar {
   background-color: rgba(255, 255, 255, 0.95);
   /* background: linear-gradient(181deg, #aac6ea, #f9f9f9 85%); */
 }

 .theme-light #footer-bar a {
   color: #818181;
 }

 .theme-dark #footer-bar {
   background-color: rgb(15 46 73 / 50%);
 }

 .footer-bar-detached {
   border-radius: 20px;
   left: 10px !important;
   right: 10px !important;
   bottom: 15px !important;
   box-shadow: 0 0px 15px 0 rgba(0, 0, 0, 0.1) !important;
   height: 60px !important;
 }

 /* game */
 .site-games {
   display: grid;
   /* display: flex; */
   justify-items: center;
 }

 .sgames-nav ul {
   /* display: grid; */
   display: flex;
   justify-content: center;
 }

 .sgames-nav li {
   display: flex;
   padding: 0 4px;
   margin: auto 5px;
   min-height: 40px;
   border-radius: 5px;
   border-bottom: 2px solid #fff;
   box-shadow: 0 3px 6px #5c5f857d;
   transition: filter 0.3s ease;
   border: 1px solid #191816;
   background: url(../images/buttonbg2.png) no-repeat center;
   background-size: auto;
   cursor: pointer;
 }

 .sgames-nav li a {
   display: flex;
   width: 100%;
 }

 .sgames-nav li:hover,
 .sgames-nav li:active {
   filter: brightness(1.05);
 }

 .sgames-nav li.active {
   border: 1px solid #75705c;
   background: url(../images/buttonbg.png) no-repeat center;
   animation: fadeIn 0.6s;
 }

 .sgames-nav li.active span {
   color: #fff !important;
   text-shadow: 0 1px 3px #a57549;
 }

 .sgames-nav li img {
   width: 24px;
   height: 24px;
   object-fit: cover;
   margin: auto;
 }

 .sgames-nav li span {
   margin: auto;
   margin-left: 3px;
   word-break: keep-all;
 }

 .sgames-list {
   display: block;
   width: 100%;
   padding-bottom: 20px;
 }

 .sgames-item {
   position: relative;
   display: flex;
   margin: auto;
   margin-bottom: 5px;
 }

 .sgames-item img {
   width: 100%;
   max-height: 120px;
   object-fit: contain;
 }

 .sgames-gmenu {
   display: none;
 }

 .sgames-gmenu:first-child {
   display: block;
 }


 .card.custom-card {
   border-radius: 10px;
   margin-bottom: 10px;
   border: 1px solid white;
   background: var(--card-bg);
 }

 .indexbutton {
   background: url(../images/indexbutton.png) center no-repeat;
   background-size: cover;
   min-width: 100px;
   /* margin: 0px; */
   color: white;
   justify-content: center;
   align-content: center;

   min-height: 50px;
   padding: 0px 20px;
 }

 .indexbuttonold {
   background: url(../images/indexbutton.png) center no-repeat;
   background-size: cover;
   min-width: 80px;
   /* margin: 0px; */
   color: white;
   justify-content: center;
   align-content: center;
 }

 .authentication .card.custom-card {
   border-radius: 20px;
   background: var(--authenticationcard-bg) !important;
 }

 /* ADD NEW */

 ::placeholder {
   color: #999 !important;
 }

 ::selection {
   background-color: #2472ff;
   color: #fff;
 }

 .flex {
   display: flex !important;
 }

 .grid {
   display: grid !important;
 }

 .floatl {
   float: left;
 }

 .floatr {
   float: right;
 }

 .bold {
   font-weight: bold !important;
 }

 .br0 {
   border-radius: unset !important;
 }

 .txtc {
   text-align: center !important;
 }

 .hidden,
 .hide {
   display: none;
   opacity: 0;
 }

 .textl {
   text-align: left !important;
 }

 .textr {
   text-align: right !important;
 }

 .textc {
   text-align: center !important;
 }

 .bgwhite {
   background: #fff !important;
 }

 .form-group {
   margin-bottom: 0.7rem;
 }

 .overflow-x,
 .overflow-x body {
   overflow-x: hidden;
 }

 .mrg-0 {
   margin: 0 !important;
 }

 .mrg-top-50 {
   margin-top: 50px !important;
 }

 .mrg-top-60 {
   margin-top: 60px !important;
 }

 .mrg-top-80 {
   margin-top: 80px !important;
 }

 .mrg-top-90 {
   margin-top: 90px !important;
 }

 .mrg-top-100 {
   margin-top: 100px !important;
 }

 .underline {
   text-decoration: underline !important;
 }

 .red {
   color: #ff2222 !important;
 }

 .green {
   color: #0d9b26 !important;
 }

 input {
   letter-spacing: 0.4px;
 }

 input,
 select,
 textarea,
 button {
   outline: none !important;
 }

 .btn:hover {
   box-shadow: 0 5px 12px -7px rgba(0, 0, 0, 0.4) !important;
 }

 .icon-search2:before {
   content: "\e8b6";
 }

 .icon-lock2:before {
   content: "\e897";
 }

 .icon-person:before {
   content: "\e7fd";
 }

 .icon-phone2:before {
   content: "\e0cd";
 }

 .icon-volume_up:before {
   content: "\e050";
 }

 /**** Background Setting ****/
 .site-wrap {
   position: relative;
   margin: auto;
   padding-top: 50px;
   padding-bottom: 90px;
   width: 100%;
   height: auto;
   z-index: 1;
   margin-top: 20px;
 }

 .site-section {
   width: 100%;
   max-width: 1200px;
   padding: 0;
   margin: auto;
 }

 body.slideout,
 body.slideout:before {
   animation: righttoleft 0.4s;
 }

 body.slidein,
 body.slidein:before {
   right: -120%;
   animation: lefttoright 0.3s forwards;
 }

 @keyframes righttoleft {
   0% {
     right: -100%;
     position: fixed;
   }

   100% {
     right: 0;
     position: fixed;
   }
 }

 @keyframes lefttoright {
   0% {
     right: 0;
     position: fixed;
   }

   100% {
     right: -120%;
     position: fixed;
   }
 }

 .fadeInTop,
 .fadeInBottom,
 .fadeInLeft,
 .fadeInRight,
 .fadeInZoom,
 .fadeInZoom2,
 .fadeIn {
   opacity: 0;
 }

 .fadeInTop.animated {
   animation: fadeInTop 1s;
   animation-fill-mode: forwards;
 }

 .fadeInBottom.animated {
   animation: fadeInBottom 1s;
   animation-fill-mode: forwards;
 }

 .fadeInLeft.animated {
   animation: fadeInLeft 1s;
   animation-fill-mode: forwards;
 }

 .fadeInRight.animated {
   animation: fadeInRight 1s;
   animation-fill-mode: forwards;
 }

 .fadeIn.animated {
   animation: fadeIn 1s;
   animation-fill-mode: forwards;
 }

 .fadeInZoom.animated {
   animation: fadeInZoom 1.2s;
   animation-fill-mode: forwards;
 }

 .fadeInZoom2.animated {
   animation: fadeInZoom2 0.8s;
   animation-fill-mode: forwards;
 }

 .delay {
   opacity: 0;
   animation-delay: .2s !important;
 }

 .delay2 {
   opacity: 0;
   animation-delay: .4s !important;
 }

 .delay3 {
   opacity: 0;
   animation-delay: .6s !important;
 }

 .delay4 {
   opacity: 0;
   animation-delay: .8s !important;
 }

 .delay5 {
   opacity: 0;
   animation-delay: 1s !important;
 }

 .duration2 {
   animation-duration: 1.15s !important;
 }

 @keyframes fadeInTop {
   0% {
     opacity: 0;
     transform: translateY(-15px);
   }

   100% {
     opacity: 1;
     transform: translateY(0);
   }
 }

 @keyframes fadeInBottom {
   0% {
     opacity: 0;
     transform: translateY(15px);
   }

   100% {
     opacity: 1;
     transform: translateY(0);
   }
 }

 @keyframes fadeInLeft {
   0% {
     opacity: 0;
     transform: translateX(-15px);
   }

   100% {
     opacity: 1;
     transform: translateX(0);
   }
 }

 @keyframes fadeInRight {
   0% {
     opacity: 0;
     transform: translateX(15px);
   }

   100% {
     opacity: 1;
     transform: translateX(0);
   }
 }

 @keyframes fadeInZoom {
   0% {
     opacity: 0;
     transform: scale(0.5);
   }

   40% {
     transform: scale(1.10);
   }

   55% {
     transform: scale(0.90);
   }

   70% {
     transform: scale(1.05);
   }

   85% {
     transform: scale(0.95);
   }

   100% {
     opacity: 1;
     transform: scale(1);
   }
 }

 @keyframes fadeInZoom2 {
   0% {
     opacity: 0;
     transform: scale(0.8);
   }

   100% {
     opacity: 1;
     transform: scale(1);
   }
 }

 .rotate {
   font-size: 16px !important;
   animation: rotate360 0.7s infinite;
 }

 @keyframes fadeIn {
   0% {
     opacity: 0;
   }

   100% {
     opacity: 1;
   }
 }

 @keyframes fadeOut {
   0% {
     opacity: 1;
   }

   100% {
     opacity: 0;
   }
 }

 @keyframes glowing {
   0% {
     filter: brightness(1);
   }

   50% {
     filter: brightness(1.15);
   }

   100% {
     filter: brightness(1);
   }
 }

 @keyframes rotate360 {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 .delayIN>div,
 .delayIN>a {
   animation: fadeInBottom 0.7s backwards;
   animation-delay: 1s;
 }

 .delayIN>div:nth-child(1),
 .delayIN>a:nth-child(1) {
   animation-delay: 0.1s;
 }

 .delayIN>div:nth-child(2),
 .delayIN>a:nth-child(2) {
   animation-delay: 0.2s;
 }

 .delayIN>div:nth-child(3),
 .delayIN>a:nth-child(3) {
   animation-delay: 0.3s;
 }

 .delayIN>div:nth-child(4),
 .delayIN>a:nth-child(4) {
   animation-delay: 0.4s;
 }

 .delayIN>div:nth-child(5),
 .delayIN>a:nth-child(5) {
   animation-delay: 0.5s;
 }

 .delayIN>div:nth-child(6),
 .delayIN>a:nth-child(6) {
   animation-delay: 0.6s;
 }

 .delayIN>div:nth-child(7),
 .delayIN>a:nth-child(7) {
   animation-delay: 0.7s;
 }

 .delayIN>div:nth-child(8),
 .delayIN>a:nth-child(8) {
   animation-delay: 0.8s;
 }

 .delayIN>div:nth-child(9),
 .delayIN>a:nth-child(9) {
   animation-delay: 0.9s;
 }

 .delayIN>div:nth-child(10),
 .delayIN>a:nth-child(10) {
   animation-delay: 1s;
 }

 /***** Button *****/
 .btn-css2,
 .btn-css3 {
   display: inline-flex;
   box-shadow: 0 1px 5px #000a;
   border: none;
   border-radius: 10px;
   height: 36px;
   cursor: pointer;
   padding: 0 10px;
   outline: none !important;
   margin-bottom: 10px;
   transition: all 0.3s ease;
 }

 .btn-css2 {
   background: linear-gradient(180deg, #ffd843 20%, #c77f0b 70%, #d38406);
 }

 .btn-css3 {
   background: linear-gradient(180deg, #7e8082, #4e4e4e);
 }

 .btn-css2>img,
 .btn-css3>img {
   width: 22px;
   height: 22px;
   margin: auto 0;
   margin-right: 8px;
 }

 .btn-css2>span,
 .btn-css3>span {
   text-align: center;
   font-size: 14px;
   line-height: 140%;
   color: #eee;
   margin: auto;
   padding-top: 3px;
 }

 .btn-css2:active,
 .btn-css2:focus,
 .btn-css3:active,
 .btn-css3:focus {
   filter: brightness(1.3);
 }

 .btn-css2.drop-down:after,
 .btn-css3.drop-down:after {
   content: '';
   width: 10px;
   height: 10px;
   background: url(../images/icon/drop-w.png) no-repeat center;
   background-size: contain;
   margin: auto 0;
   margin-left: 5px;
   margin-right: -3px;
 }

 /***** Slider *****/
 .nonloop-block-14 {
   position: relative;
   width: 100%;
   overflow: hidden;
   padding: 4px;
 }

 .nonloop-block-14 .owl-stage-outer {
   border: 1px solid #141416;
 }

 .nonloop-block-14,
 .nonloop-block-14 .owl-item img {
   object-fit: cover;
   min-height: 150px;
   max-height: 400px;
 }

 .nonloop-block-14 .owl-item {
   transition: all 0.5s ease;
 }

 .nonloop-block-14 .owl-item img {
   object-fit: cover;
   max-height: 400px;
 }

 .nonloop-block-14 .owl-dots {
   display: flex;
   position: absolute;
   bottom: 5px;
   width: 100%;
 }

 .nonloop-block-14 .owl-dots .owl-dot:first-child {
   margin-left: auto;
 }

 .nonloop-block-14 .owl-dots .owl-dot:last-child {
   margin-right: auto;
 }

 .nonloop-block-14 .owl-dots .owl-dot {
   display: flex;
   padding: 8px 4px;
 }

 .nonloop-block-14 .owl-dots .owl-dot span {
   display: inline-block;
   width: 7px;
   height: 7px;
   background: #fff9;
   border-radius: 50%;
 }

 .nonloop-block-14 .owl-dots .owl-dot.active span {
   background: #fff;
 }

 .nonloop-block-15 {
   background: #000;
   box-shadow: 0 1px 10px #0008;
 }

 @keyframes backhome2 {
   0% {
     margin-left: -50px;
     opacity: 0;
   }

   60% {
     margin-left: -50px;
     opacity: 0;
   }

   100% {
     margin-left: 0;
     opacity: 1;
   }
 }

 .site-nav-marquee {
   position: relative;
   display: flex;
   width: 100%;
   background: #000;
   margin-bottom: 5px;
 }

 .site-nav-marquee marquee {
   font-size: 13px;
   width: 100%;
   white-space: nowrap;
   padding-top: 2px;
   margin: auto;
   display: flex;
 }

 .site-nav-marquee marquee span {
   padding-right: 50%;
   line-height: 28px;
 }

 .site-nav-marquee>img {
   /*width: 40px;
    height: 20px;*/
   width: 100px;
   height: 26px;
   margin: auto;
 }

 /****** Header3 *****/
 .site-header3 {
   position: fixed;
   display: flex;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   top: 0;
   width: 100%;
   height: 50px;
   z-index: 1000;
   align-items: center;
 }

 .site-header3.transparent {
   background: unset;
   box-shadow: unset;
 }

 .site-header3 a {
   position: absolute;
   left: 0;
   width: 10%;
   height: 100%;
   margin: auto;
   display: flex;
   z-index: 10;
   text-align: center;
   animation: fadeInZoom2 0.5s backwards;
   animation-delay: 0.3s;
   align-items: center;
   justify-content: center;
 }

 .site-header3 a:active:before,
 .site-header3 a:focus:before {
   filter: grayscale(1);
 }


 .sheader2-back {
   position: absolute;
   top: 0;
   left: 0;
   width: 50px;
   height: 50px;
   display: flex;
   padding-right: 8px;
 }

 .sheader2-back:before {
   content: "\f104";
   font-family: 'icomoon' !important;
   font-size: 26px;
   color: #e7ddd2;
   margin: auto;
   line-height: 50px;
   transition: all 0.3s ease;
 }

 .sheader2-back:hover,
 .sheader2-back:active {
   filter: brightness(0.7);
 }


 .containerspe {
   margin-top: 15%;
 }

 .sheader3-center {
   display: flex;
   height: 100%;
   width: 100%;
 }

 .sheader3-center h4 {
   font-size: 15px;
   text-shadow: 0 0 1px #fff5;
   color: #fff;
   margin: auto;
   letter-spacing: 0.5px;
   padding-top: 10px;
 }

 /****** Header4 *****/
 .site-header4 {
   position: fixed;
   display: flex;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   top: 0;
   width: 100%;
   height: 50px;
   z-index: 1000;
 }

 .site-header4.transparent {
   background: unset;
   box-shadow: unset;
 }

 .site-header4 a {
   position: absolute;
   left: 0;
   width: 60px;
   height: 100%;
   display: flex;
   z-index: 10;
   color: #000;
   animation: fadeInZoom2 0.5s backwards;
   animation-delay: 0.3s;
 }

 .site-header4 a:before {
   content: '';
   background: url(../images/icon/icon-back.png) no-repeat;
   background-size: contain;
   background-position: center;
   width: 30px;
   height: 30px;
   margin: auto;
   filter: drop-shadow(2px 4px 5px #000);
   margin-bottom: 8px;
 }

 .site-header4 a:active:before,
 .site-header4 a:focus:before {
   filter: grayscale(1);
 }

 .sheader4-center {
   display: flex;
   height: 100%;
   width: 100%;
 }

 .sheader4-center h4 {
   font-size: 15px;
   text-shadow: 0 0 1px #fff5;
   color: #fff;
   margin: auto;
   letter-spacing: 0.5px;
   padding-top: 10px;
 }

 /*************** Header ***************/
 .site-header {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   z-index: 12;
 }

 .sheader-main {
   display: flex;
   height: 50px;
   width: 100%;
 }

 .sheader-logo {
   height: inherit;
   padding: 0 5px;
   margin-right: auto;
 }

 .sheader-logo img {
   height: inherit;
 }

 .sheader-nav {
   display: flex;
   padding: 0 5px;
 }

 .sheader-lang {
   display: flex;
   height: 40px;
   width: 40px;
   padding: 3px;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   box-shadow: 0 1px 5px #000a;
   filter: drop-shadow(0 1px 4px #000a);
   transition: filter 0.4s ease;
   border-radius: 50%;
   margin: auto;
   margin-right: 5px;
   cursor: pointer;
 }

 .sheader-lang img {
   height: 100%;
   border-radius: 50%;
   border: 1px solid #222;
   box-shadow: 0 1px 3px #0008;
 }

 .sheader-currency {
   position: relative;
   display: flex;
   cursor: pointer;
   margin: auto;
 }

 .scurrency-button {
   display: flex;
   background: url(../images/icon/currency.png) no-repeat;
   background-size: contain;
   background-position: center;
   transition: filter 0.4s ease;
   filter: grayscale(0);
   width: 100px;
   height: 40px;
 }

 .sheader-currency span {
   font-size: 15px;
   text-shadow: 0 1px 4px #0005;
   line-height: 100%;
   letter-spacing: -0.2px;
   margin: auto;
   margin-left: 45px;
 }

 .sheader-lang:hover {
   filter: grayscale(0) brightness(1.1);
 }

 .sheader-lang:active,
 .sheader-lang:focus,
 .sheader-currency.active .scurrency-button {
   filter: grayscale(1) brightness(0.9);
 }

 /** dropdown **/
 .sdropdown-curr {
   position: absolute;
   display: none;
   top: 44px;
   left: 0;
   width: 100px;
   padding: 5px 10px;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   box-shadow: inset 0 1px 5px #fff;
   filter: drop-shadow(0 1px 5px #0008);
   border-radius: 20px;
   z-index: -1;
 }

 .sheader-currency.active .sdropdown-curr {
   display: grid;
   animation: fadeInTop 0.7s;
 }

 .sdropdown-curr a {
   height: 38px;
   line-height: 40px;
   font-size: 15px;
   letter-spacing: 1px;
   text-shadow: 0 1px 5px #ad5800;
   padding: 0 5px;
 }

 .sdropdown-curr a:not(:last-child) {
   border-bottom: 1px solid #fc7;
 }

 .sdeposit-currency {
   position: relative;
   display: flex;
   cursor: pointer;
 }

 .sdeposit-button {
   background: linear-gradient(180deg, #ffd843 20%, #c77f0b 70%, #d38406);
   display: inline-flex;
   box-shadow: 0 1px 5px #000a;
   border: none;
   border-radius: 10px;
   height: 36px;
   cursor: pointer;
   padding: 0 10px;
   outline: none !important;
   margin-bottom: 10px;
   transition: all 0.3s ease;
 }

 /* .sdeposit-button:after {
   content: '';
   width: 10px;
   height: 10px;
   background: url(../images/icon/drop-w.png) no-repeat center;
   background-size: contain;
   margin: auto 0;
   margin-left: 5px;
   margin-right: -3px;
 } */

 .sdeposit-currency img {
   width: 22px;
   height: 22px;
   margin: auto 0;
   margin-right: 8px;
 }

 .sdeposit-currency span {
   text-align: center;
   font-size: 14px;
   line-height: 140%;
   color: #eee;
   margin: auto;
   padding-top: 3px;
 }

 .sdeposit-currency.active .scurrency-button {
   filter: grayscale(1) brightness(0.9);
 }

 /** dropdown **/
 .sdepodropdown-curr {
   position: absolute;
   top: 40px;
   left: 0;
   margin: auto;
   text-align: center;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   box-shadow: inset 0 1px 5px #fff;
   filter: drop-shadow(0 1px 5px #0008);
   border-radius: 10px;
   z-index: 999;
 }

 .sheader-currency.active .sdepodropdown-curr {
   display: grid;
   animation: fadeInTop 0.7s;
 }

 .sdepodropdown-curr a {
   height: 38px;
   line-height: 25px;
   font-size: 15px;
   letter-spacing: 1px;
   text-shadow: 0 1px 5px #ad5800;
   padding: 0 5px;
 }

 .sdepodropdown-curr a:not(:last-child) {
   border-bottom: 1px solid #fc7;
 }

 /*************** Footer ***************/
 .icon2-home {
   background-image: url(../images/footer/home.png);
 }

 .icon2-contact {
   background-image: url(../images/footer/contact.png);
 }

 .icon2-transfer {
   background-image: url(../images/footer/transfer.png);
 }

 .icon2-user {
   background-image: url(../images/footer/user.png);
 }

 .icon2-mission {
   background-image: url(../images/footer/mission.png);
 }

 a.active .icon2-home {
   background-image: url(../images/footer/home-active.png);
 }

 a.active .icon2-contact {
   background-image: url(../images/footer/contact-active.png);
 }

 a.active .icon2-transfer {
   background-image: url(../images/footer/transfer-active.png);
 }

 a.active .icon2-user {
   background-image: url(../images/footer/user-active.png);
 }

 .site-footer {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   background: linear-gradient(0deg, #22252aee, #303338ee);
   box-shadow: 0 1px 5px #fff4;
   border-top: 1px solid #121416;
   z-index: 13;
 }

 .sfooter-main {
   position: relative;
   display: flex;
   width: 100%;
 }

 .sfooter-main>a {
   width: 100%;
   display: grid;
   padding-top: 8px;
   padding-bottom: 5px;
 }

 .sfooter-main>a i {
   width: 35px;
   height: 35px;
   margin: auto;
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   animation: glowing 4s infinite;
 }

 .sfooter-main>a span {
   font-size: 12px;
   margin: auto;
   text-align: center;
   color: #afafaf;
   line-height: 180%;
   transition: color .2s ease;
 }

 .sfooter-main>a.active span {
   color: #ebba39;
 }

 .sfooter-center {
   width: 110% !important;
 }

 .sfooter-center i {
   position: absolute;
   display: flex;
   top: -25px;
   left: calc(50% - 38px);
   width: 84px !important;
   height: 84px !important;
 }

 .sfooter-center i font {
   display: flex;
   margin: auto;
   font-size: 12px;
   margin-bottom: 16px;
   line-height: 15px;
   padding-right: 8px;
   filter: drop-shadow(0 1px 5px #000);
 }

 .sfooter-center i font:before {
   content: '';
   background: url(../images/icon/ifont.png) no-repeat;
   background-size: contain;
   background-position: center;
   height: 15px;
   width: 9px;
   margin: auto;
   margin-top: -1px;
 }

 .sfooter-voicechat {
   position: fixed;
   display: flex;
   right: 5px;
   bottom: 90px;
   z-index: 10;
   animation: fadeInBottom 1s backwards;
   animation-delay: 1s;
 }

 .sfooter-voicechat:before {
   content: '';
   background: url(../images/icon/icon-services.png) no-repeat;
   background-size: contain;
   background-position: center;
   width: 70px;
   height: 70px;
   margin: auto;
   animation: glowing 5s infinite;
 }

 /*************** Index ****************/
 .sindex-box {
   box-shadow: 0 1px 8px #000a;
 }

 .sindex-box-flex {
   display: flex;
 }

 .sindex-qrscan {
   display: flex;
   margin: auto;
   margin-left: 5px;
   margin-bottom: 3px;
   padding: 5px;
   animation: fadeInZoom 0.7s;
 }

 .sindex-qrscan img {
   width: 55px;
   height: 55px;
   margin: auto;
 }

 .swallet-group {
   display: flex;
   width: 100%;
   padding: 2px 0;
   margin-bottom: 4px;
 }

 .swallet-item {
   display: flex;
   margin: 0;
   margin-right: 10px;
   width: 100%;
 }

 .swallet-item:not(:first-child) {
   border-left: 2px solid #ccc;
 }

 .sindex-box-flex .swallet-item:not(:first-child) {
   border-color: #444;
 }

 .swallet-item:after {
   content: '';
   background: url(../images/icon/arrow2.png) no-repeat;
   background-size: contain;
   background-position: center;
   transform: scaleX(0.9);
   width: 12px;
   height: 90%;
 }

 .swallet-content {
   display: grid;
   min-width: 60%;
   margin: auto;
   justify-items: center;
 }

 .swallet-content>div {
   font-size: 13px;
   letter-spacing: 1px;
 }

 /* .swallet-content>div:before {
   content: '';
   background-repeat: no-repeat !important;
   background-size: contain !important;
   background-position: center !important;
   display: block;
   height: 25px;
   width: 25px;
   margin: auto 0;
   margin-right: 8px;
 }

 .swallet-content>div.cash:before {
   background: url(../images/icon/money.png);
 } */

 .swallet-content>div.chip:before {
   background: url(../images/icon/info.png);
 }

 .swallet-content span {
   min-width: max-content;
   font-size: 16px;
   color: #ffc800;
   padding-left: 2px;
 }

 .sjackpot-main {
   position: relative;
   display: grid;
   margin: 0 10px;
   width: calc(100% - 20px);
   border-bottom: 1px solid #fff;
   margin-bottom: 5px;
 }

 .sjackpot-item {
   position: relative;
   display: flex;
   height: 140px;
   width: 100%;
   margin-bottom: 5px;
 }

 .sjackpot-item:before {
   content: '';
   position: absolute;
   width: 100%;
   height: 230px;
   background: url(../images/jackpot.png) no-repeat;
   background-size: contain;
   background-position: center;
   background-position-y: -10px;
   z-index: -1;
 }

 .sjackpot-item span {
   font-size: 32px;
   text-align: center;
   letter-spacing: 0.5px;
   color: #fff683;
   margin: auto;
   margin-bottom: 5px;
 }

 .sjackpot-topup {
   position: absolute;
   top: 5px;
   left: 0;
   /*    display: block;*/
   display: flex;
   z-index: 2;
 }

 .sjackpot-topup a {
   display: inline-flex;
   /*  background: #1d1f23;
    box-shadow: inset 0 1px 5px #0005;
    border: 1px outset #ffd02d;*/
   border-radius: 6px;
   height: 33px;
   margin-right: 2px;
 }

 .sjackpot-topup a>img {
   width: 90px;
   height: 40px;
   margin: auto 5px;
   margin-right: 0;
 }

 .sjackpot-topup a>span {
   font-size: 13px;
   text-align: center;
   margin: auto 10px;
   margin-left: 8px;
   line-height: 100%;
   padding-top: 2px;
 }

 .sjackpot-topup a:hover,
 .sjackpot-topup a:focus,
 .sjackpot-topup a:active {
   filter: grayscale(1);
 }

 .slider-nav {
   position: relative;
   padding: 5px 20px;
   overflow: hidden;
   margin-bottom: 20px;
 }

 .slider-nav .owl-stage-outer {
   height: 35px;
   border-radius: 7px;
 }

 .slider-nav .slide-item {
   position: relative;
   overflow: hidden;
   display: flex;
   cursor: pointer;
   background-size: contain !important;
   background-position: left center !important;
   background-repeat: no-repeat !important;
   width: 92px;
   height: 35px;
   padding-left: 25px;
   filter: grayscale(1);
   margin: auto;
 }

 .slider-nav .slide-item.active {
   filter: grayscale(0);
 }

 .slider-nav .slide-item span {
   font-size: 12px;
   text-shadow: 0 0 0 #fffa;
   letter-spacing: -0.2px;
   line-height: 110%;
   text-align: center;
   margin: auto;
   width: 80%;
 }

 .icrown-all {
   background: url(../images/icon2/Home-10.png);
 }

 .icrown-hot {
   background: url(../images/icon2/Home-11.png);
 }

 .icrown-live {
   background: url(../images/icon2/Home-12.png);
 }

 .icrown-slot {
   background: url(../images/icon2/Home-13.png);
 }

 .icrown-lottery {
   background: url(../images/icon2/Home-14.png);
 }

 .icrown-short {
   background: url(../images/icon2/Home-15.png);
 }

 .icrown-fishing {
   background: url(../images/icon2/Home-16.png);
 }

 .icrown-poker {
   background: url(../images/icon2/Home-36.png);
 }

 .slider-nav .owl-prev,
 .slider-nav .owl-next {
   position: absolute;
   display: flex;
   width: 20px;
   height: 45px;
   top: 0;
 }

 .slider-nav .owl-prev:before,
 .slider-nav .owl-next:before {
   content: '';
   width: 15px;
   height: 15px;
   background: url(../images/icon/drop.png) no-repeat;
   background-size: contain;
   background-position: center;
   margin: auto;
 }

 .slider-nav .owl-prev {
   left: 0;
 }

 .slider-nav .owl-next {
   right: 0;
 }

 .slider-nav .owl-prev:before {
   transform: rotate(90deg);
 }

 .slider-nav .owl-next:before {
   transform: rotate(-90deg);
 }

 .sgames-menu {
   padding: 0 5px;
   margin: 0;
   margin-bottom: 30px;
 }

 .sgames-menu a {
   position: relative;
   display: none;
   padding: 0 5px;
   margin-bottom: 10px;
   border-radius: 10%;
   overflow: hidden;
 }

 .sgames-menu a:before {
   content: '';
   position: absolute;
   left: 0;
   bottom: 0;
   width: 30%;
   height: 86%;
   background: rgb(255 234 152 / 0.3);
   animation: shining-layer 4s infinite linear;
   transform: skewX(30deg);
   mix-blend-mode: hard-light;
 }

 .sgames-menu a.active,
 .sgames-menu.active a {
   display: block;
   animation: fadeInZoom 0.5s;
 }

 .sgames-menu a img {
   width: 100%;
   border-radius: 10%;
 }

 @keyframes shining-layer {
   0% {
     left: -130%;
     background: rgb(255 234 152 / 0.3);
   }

   20% {
     left: 130%;
     background: rgb(255 224 112 / 0.1);
   }

   100% {
     left: 130%;
     opacity: 0;
   }
 }


 .smenu-panel {
   display: flex;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   padding: 10px 5px;
   padding-left: 10px;
   gap: 5px;
 }

 .smenu-panel>a {
   display: flex;
   height: 70px;
   width: 100%;
   padding: 0 5px;
 }

 .smenu-panel>a:active,
 .smenu-panel>a:focus {
   animation: glowing 2s infinite;
 }

 .smenu-panel>a:not(:last-child) {
   border-right: 1px solid #eee;
 }

 .smenu-panel>a img {
   width: 25%;
   max-width: 55px;
   height: 40px;
   margin: auto 5px;
   margin-left: 5%;
 }

 .smenu-panel>a span {
   font-size: 14px;
   color: #ffc800;
   margin: auto 0;
   width: 100%;
   padding: 0 5px;
 }

 /**************** Invite ****************/
 .sinvite-main {
   display: grid;
   padding: 0 15px;
   padding-top: 50px;
   width: 100%;
   max-width: 600px;
   margin: auto;
 }

 .sinvite-main h4 {
   font-size: 24px;
   text-align: center;
 }

 .sinvite-qrcode {
   width: 75%;
   text-align: center;
   max-width: 400px;
   max-height: 400px;
   background: linear-gradient(45deg, #fbc603, #d38303);
   padding: 6px;
   margin: auto;
   margin-bottom: 30px;
   border-radius: 15px;
 }

 .sinvite-qrcode-inner {
   position: realtive;
   background: #fff;
   width: 100%;
   height: 100%;
   border-radius: 12px;
   overflow: hidden;
 }

 .sinvite-menu {
   display: flex;
   gap: 10px;
   margin: auto;
   margin-bottom: 50px;
   justify-content: center;
 }

 .sinvite-menu a {
   width: 70px;
   height: 70px;
 }

 .sinvite-reflink {
   display: grid;
   width: 90%;
   margin: auto;
   margin-bottom: 50px;
   cursor: pointer;
   justify-items: center;
 }

 .sinvite-reflink h5 {
   font-size: 17px;
   text-align: center;
   margin-bottom: 5px;
 }

 .refcode-copy {
   position: relative;
   display: flex;
   width: 100%;
   background: #000;
   border-radius: 10px;
   overflow: hidden;
   height: 35px;
 }

 .refcode-copy span {
   position: relative;
   font-size: 14px;
   letter-spacing: 0;
   width: 100%;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
   padding-left: 10px;
   line-height: 100%;
   margin: auto;
 }

 .refcode-copy:after {
   content: '';
   width: 20px;
   height: 20px;
   background: url(../images/icon/copy-w.png) center no-repeat;
   background-size: contain;
   margin: auto 10px;
 }

 /**************** Mission ****************/
 .sheader3-mission {
   position: relative;
   width: 100%;
   height: 100%;
 }

 .sheader3-mission:before {
   content: '';
   position: absolute;
   left: calc(50% - 80px);
   top: 10px;
   display: block;
   background: url(../images/mission/mission.png) no-repeat center;
   background-size: contain;
   width: 160px;
   height: 80px;
   z-index: 1;
 }

 .smission-top-panel {
   display: flex;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   padding-top: 15px;
   min-height: 100px;
 }

 .smission-title {
   margin-top: auto;
   padding: 5px 15px;
 }

 .smission-title h5 {
   font-size: 17px;
   font-weight: 700;
 }

 .smission-log {
   display: block;
   margin-top: auto;
   margin-left: auto;
   padding: 0 15px;
 }

 .smission-log>span {
   display: block;
   font-size: 12px;
   width: 100%;
   margin-bottom: 3px;
 }

 .smission-log>a {
   float: right;
 }

 .smission-list {
   padding: 10px;
   width: 100%;
   max-width: 1000px;
   margin: auto;
   margin-bottom: 20px;
 }

 .smission-item {
   position: relative;
   display: flex;
   border-radius: 5px;
   background: #383b40;
   mix-blend-mode: exclusion;
   box-shadow: 0 1px 10px #0005;
   height: 68px;
   margin-top: 10px;
   margin-bottom: 20px;
 }

 .smission-item:before {
   content: '';
   position: absolute;
   background-size: contain !important;
   background-position: left center !important;
   background-repeat: no-repeat !important;
   top: -10px;
   width: 110px;
   height: calc(100% + 15px);
 }

 .smission-item.live:before {
   background: url(../images/mission/Mission-b3.png);
 }

 .smission-item.slot:before {
   background: url(../images/mission/Mission-b1.png);
 }

 .smission-item.slot2:before {
   background: url(../images/mission/Mission-b1.png);
 }

 .smission-item.sport:before {
   background: url(../images/mission/Mission-b4.png);
 }

 .smission-item.poker:before {
   background: url(../images/mission/Mission-b5.png);
 }

 .smission-item.fish:before {
   background: url(../images/mission/Mission-b2.png);
 }

 .smission-item.daily:before {
   background: url(../images/mission/Mission-Daily.png);
 }

 .smission-item.weekly:before {
   background: url(../images/mission/Mission-13.png);
 }

 .smission-item.leaderbox:before {
   background: url(../images/mission/Mission-Tour.png);
 }

 .smission-item.chenactive:before {
   background: url(../images/checkinbtn/checkinactive_en.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-item.chcnactive:before {
   background: url(../images/checkinbtn/checkinactive_cn.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-item.chmyactive:before {
   background: url(../images/checkinbtn/checkinactive_my.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-item.chenunactive:before {
   background: url(../images/checkinbtn/checkinunactive_en.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-item.chcnunactive:before {
   background: url(../images/checkinbtn/checkinunactive_cn.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-item.chmyunactive:before {
   background: url(../images/checkinbtn/checkinunactive_my.png);
   top: 0;
   height: calc(80% + 15px);
 }

 .smission-detail {
   display: grid;
   padding: 10px 2%;
   margin-left: 95px;
   width: 70%;
 }

 .smission-detail h5 {
   font-size: 14px;
   color: #ffd129;
   letter-spacing: 0;
   margin: auto 0;
   line-height: 120%;
 }

 .smission-detail p {
   font-size: 12px;
   margin: auto 0;
   color: #eee;
 }

 .smission-sumbit {
   position: relative;
   display: flex;
   width: 58px;
   min-width: 58px;
   height: calc(100% - 2px);
   background-size: contain !important;
   background-position: right center !important;
   background-repeat: no-repeat !important;
   margin: auto;
   margin-right: 5px;
   margin-top: -2px;
   margin-left: auto;
   border-radius: 6px;
   cursor: pointer;
 }

 .smission-sumbit:active,
 .smission-sumbit:focus {
   animation: glowing 2s infinite;
 }

 .smission-sumbit.bonus {
   background: url(../images/mission/bonus.png);
 }

 .smission-sumbit.gift {
   background: url(../images/mission/gift.png);
 }

 .smission-sumbit span {
   font-size: 10px;
   color: #b98200;
   text-align: center;
   line-height: 120%;
   width: 100%;
   margin: auto;
   margin-left: 7px;
   margin-bottom: 2px;
 }

 .smission-sumbit.gift span {
   margin-bottom: 0;
 }

 /**************** Contact ****************/
 .scontact-main {
   padding: 15px;
 }

 .scontact-search {
   display: flex;
   width: 100%;
   background: #000;
   border-radius: 10px;
   padding: 2px 5px;
   margin: auto;
   margin-bottom: 15px;
 }

 .scontact-search:before {
   content: '';
   min-width: 20px;
   height: 20px;
   background: url(../images/icon/search.png) center no-repeat;
   background-size: contain;
   margin: auto 5px;
 }

 .scontact-search input {
   background: unset;
   color: #fff;
   font-size: 13px;
   border: none;
   outline: unset !important;
   margin: auto;
   width: 100%;
   padding: 5px;
 }

 .scontact-search button {
   display: none;
   font-size: 12px;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   min-width: max-content;
   border: none;
   height: 28px;
   line-height: 30px;
   color: #fff;
   margin: auto 0;
   border-radius: 50px;
   cursor: pointer;
   padding: 0 10px;
   outline: none !important;
 }

 .scontact-search input:valid:not(:placeholder-shown)+button {
   display: inline-flex;
   animation: fadeIn 0.5s;
 }

 .scontact-list {
   margin-bottom: 30px;
 }

 .scontact-item {
   display: flex;
   height: 40px;
   padding: 0 10px;
   margin-bottom: 15px;
 }

 .scontact-item>img {
   width: 40px;
   height: 40px;
   filter: drop-shadow(0 1px 5px #000a);
 }

 .scontact-user {
   display: flex;
   border-radius: 5px;
   background: #0006;
   height: 35px;
   padding: 5px;
   padding-right: 15px;
   width: 100%;
   margin: auto 0;
   margin-left: 8px;
 }

 .scontact-user:before {
   content: '';
   background: url(../images/icon/edit.png) center no-repeat;
   background-size: contain;
   width: 12px;
   height: 12px;
   margin: auto 5px;
 }

 .scontact-user span {
   font-size: 14px;
   line-height: 120%;
   margin: auto 5px;
 }

 .scontact-swap {
   display: block;
   width: 60px;
   height: 40px;
   background: url(../images/icon/swap.png) center no-repeat;
   background-size: contain;
   margin-left: -10px;
 }

 .sreport-main {
   display: grid;
   padding: 5px 10px;
 }

 .sreport-item {
   position: relative;
   display: flex;
   background: #383b42;
   box-shadow: 0 1px 5px #0005;
   padding: 3px 5px;
   border-radius: 5px;
   margin-bottom: 10px;
 }

 .sreport-logo {
   min-width: 50px;
   height: 50px;
   border: 1px solid #aaa;
   box-shadow: inset 0 1px 10px #0005;
   border-radius: 5px;
   margin: auto;
   margin-right: 10px;
 }

 .sreport-logo img {
   width: 100%;
   height: 100%;
 }

 .sreport-detail {
   width: 100%;
   padding: 5px;
   display: grid;
 }

 .sreport-detail h5 {
   font-size: 15px;
   font-family: Any-400, Microsoft Yahei;
   color: #ffdc5e;
   margin: 0;
 }

 .sreport-detail p {
   font-size: 12px;
   font-family: system-ui;
   letter-spacing: 0.2px;
   color: #ddd;
   margin: 0;
 }

 .sreport-date {
   display: flex;
 }

 .sreport-date:before {
   content: '';
   position: absolute;
   top: 5px;
   right: 10px;
   width: 20px;
   height: 20px;
   background: url(../images/icon/check.png) no-repeat center;
   background-size: contain;
   filter: brightness(2.4);
 }

 .sreport-date span {
   font-size: 18px;
   font-family: Any-600, Microsoft Yahei;
   letter-spacing: 0;
   display: flex;
   margin-top: auto;
   min-width: max-content;
   padding: 0 5px;
   line-height: 100%;
 }

 .sreport-date span font {
   font-size: 12px;
   margin-bottom: 2px;
   margin-top: auto;
   margin-right: 8px;
 }

 /*************** Deposit ***************/
 .stables-main {
   display: grid;
   width: 100%;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   margin: 5px 0 20px 0;
 }

 .stables-nav {
   display: flex;
   padding: 15px;
   padding-bottom: 5px;
 }

 .stables-nav>a {
   margin-left: auto;
   margin-right: auto;
   height: 34px;
   padding: 0 8px;
 }

 .stables-nav>a:first-child {
   margin-left: 0;
 }

 .stables-nav>a:last-child {
   margin-right: 0;
 }

 .stables-main .swallet-content>div {
   line-height: 25px;
 }

 .stables-main .swallet-content span {
   text-align: center;
 }

 .stables-menu {
   display: flex;
   padding: 15px;
   width: 100%;
   max-width: 470px;
   margin: auto;
   gap: 10px;
 }

 .stables-menu>a {
   position: relative;
   display: flex;
   width: calc(25% - 5px);
   max-width: 100px;
 }

 .stables-menu>a img {
   transition: all 0.4s ease;
   filter: grayscale(1) brightness(0.8);
 }

 .stables-menu>a.active img,
 .sprofile-main .stables-menu>a img {
   filter: grayscale(0) brightness(1);
 }

 .stables-menu>a span {
   position: absolute;
   bottom: 1px;
   left: 0;
   font-size: 9px;
   color: #eee;
   width: 100%;
   z-index: 1;
   text-align: center;
 }

 @media(max-width: 396px) {
   .stables-menu>a span {
     font-size: 13px;
   }
 }

 .sdeposit-form {
   padding: 25px 15px;
   animation: fadeInBottom 1s backwards;
   animation-delay: 0.3s;
 }

 .sdeposit-form input,
 .sdeposit-form select,
 .sdeposit-form textarea {
   width: 100%;
   background: #25272b;
   border: 1px solid #aaa;
   border-radius: 6px;
   height: 44px;
   padding: 8px 10px;
   font-size: 13px;
   color: #eee;
   letter-spacing: 0.4px;
 }

 .custom-select2 {
   position: relative;
   width: 100%;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
 }

 .custom-select2 select {
   appearance: none;
   padding-right: 32px !important;
   cursor: pointer;
 }

 .custom-select2:after {
   content: '';
   position: absolute;
   width: 15px;
   height: 15px;
   right: 12px;
   top: calc(50% - 7px);
   background: url(../images/icon/drop.png) no-repeat center;
   background-size: contain;
   pointer-events: none;
 }

 .sdeposit-bank {
   display: flex;
   width: 100%;
   background: #555861;
   margin-bottom: 15px;
   border-radius: 6px;
   box-shadow: 0 1px 5px #0002;
   padding: 4px 0;
 }

 .sdeposit-bank>img {
   width: 80px;
   height: 50px;
   margin: auto 5px;
 }

 .sdeposit-bank-inner {
   display: grid;
   padding: 0 5px;
   width: 100%;
   padding-top: 5px;
   margin: auto;
 }

 .sdeposit-bank-inner h5 {
   font-size: 14px;
   margin: auto 0;
 }

 .sdeposit-bank-inner span {
   display: flex;
   font-size: 13px;
   margin: auto 0;
 }

 .sdeposit-bank-copy {
   margin-left: 6px;
   width: 18px;
   height: 18px;
   background: url(../images/icon/copy-w.png) no-repeat center;
   background-size: contain;
 }

 .sdeposit-amount {
   display: grid;
   padding: 5px;
   border-bottom: 1px solid #8d909d;
   margin-bottom: 10px;
 }

 .sdeposit-amount label {
   font-size: 17px;
   text-align: center;
 }

 .sdeposit-amount input {
   font-size: 42px;
   text-align: center;
   line-height: 100%;
   color: #ffc800;
   background: unset;
   letter-spacing: 2px;
   border: none;
   width: 100%;
 }

 .sdeposit-notice {
   padding: 5px;
   margin-bottom: 5px;
   max-width: 1200px;
   margin: auto;
 }

 .sdeposit-notice p {
   line-height: 160%;
   font-size: 13px;
   letter-spacing: 0;
   /* word-break: break-all; */
   margin-bottom: 0;
   color: #eee;

 }

 .btn-submit {
   display: block;
   font-size: 18px;
   margin: auto;
   margin-top: 10px;
   margin-bottom: 20px;
   color: #fff;
   min-width: 150px;
   height: 44px;
   text-align: center;
 }

 .sdeposit-upload {
   display: grid;
   padding: 10px;
   padding-top: 12px;
   margin-bottom: 10px;
   background: #64676dcf;
   border-radius: 10px;
 }

 .sdeposit-upload h5 {
   font-size: 14px;
   color: #fff;
   margin-bottom: 5px;
   padding: 0 25px;
 }

 .sdeposit-upload-image {
   position: relative;
   width: 100%;
   margin: auto;
   height: 46vw;
   max-height: 400px;
   background: #eee;
   overflow: hidden;
   border-radius: 6px;
 }

 .sdeposit-upload-image img {
   position: relative;
   width: 100%;
   height: 100%;
   object-fit: contain;
   z-index: 1;
 }

 .sdeposit-upload-image>span.sample {
   display: grid;
   position: absolute;
   top: calc(50% - 35px);
   width: 100%;
   font-size: 15px;
   color: #222;
   font-weight: bold;
   text-align: center;
 }

 .sdeposit-upload-image>span.sample:before {
   content: '';
   width: 100%;
   height: 40px;
   background: url(../images/upload-images.png) no-repeat center;
   background-size: contain;
   margin-bottom: 10px;
 }

 .sdeposit-upload input {
   display: none;
 }

 .sdeposit-qrcode {
   display: flex;
   gap: 10px;
   margin: 10px auto;
 }

 .sdeposit-qrcode>a {
   width: 70px;
   height: 70px;
 }

 .sdeposit-password {
   display: grid;
   margin-top: 40px;
   margin-bottom: 30px;
 }

 .sdeposit-password h5 {
   font-size: 15px;
   text-align: center;
 }

 .sdeposit-passkey {
   position: relative;
   width: 100%;
   max-width: 155px;
   margin: auto;
 }

 .sdeposit-passkey ul {
   display: flex;
   margin: auto;
   width: 100%;
   gap: 5px;
 }

 .sdeposit-passkey ul li {
   width: 100%;
   font-size: 20px;
   height: 35px;
   line-height: 38px;
   text-align: center;
   background: #fff;
   color: #000;
   border-radius: 5px;
   box-shadow: inset 0 1px 5px #0005;
 }

 .sdeposit-passkey input {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1;
   color: #0000;
   background: #0000;
   border: none;
   transform: scale(1.1);
 }

 /**************** Profile ***************/
 .stables-panel {
   display: flex;
   padding: 10px;
 }

 .stables-qrcode {
   display: block;
   font-size: 11px;
   width: 70px;
   min-width: 70px;
   height: 70px;
   line-height: 72px;
   background: url(../images/icon2/Personal-01.png) no-repeat center;
   background-size: contain;
   text-align: center;
   margin: auto 5px;
 }

 .stables-user {
   display: grid;
   padding: 5px 10px;
   width: 100%;
 }

 .stables-user label {
   font-size: 13px;
   font-family: 'Any-400';
   color: #eee;
   margin: 0;
 }

 .stables-user p {
   font-size: 15px;
   margin: 0;
 }

 .stables-user p>font {
   color: #ffc800;
 }

 .stables-user .refcode-copy {
   height: 25px;
   border-radius: 5px;
 }

 .stables-user .refcode-copy span {
   font-size: 12px;
 }

 .stables-user .refcode-copy:after {
   width: 16px;
   height: 16px;
 }

 .stables-setting {
   width: 30px;
   height: 30px;
   min-width: 30px;
   margin-top: 5px;
 }

 .stables-setting:before {
   content: '';
   display: block;
   background: url(../images/icon/setting.png) no-repeat center;
   background-size: contain;
   width: 25px;
   height: 25px;
   margin: auto;
 }

 .stables-setting:hover:before,
 .stables-setting:active:before,
 .stables-setting:focus:before {
   animation: rotate360 2s infinite;
 }

 .sprofile-info {
   position: relative;
   padding: 15px 5px;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   margin-bottom: 10px;
   z-index: -1;
 }

 .sprofile-team {
   padding: 0 15px;
   margin-top: 3px;
 }

 .sprofile-team ul {
   display: flex;
   width: 100%;
   gap: 10px;
 }

 .sprofile-team li {
   display: grid;
   width: 100%;
 }

 .sprofile-team li>label {
   position: relative;
   height: 28px;
   line-height: 28px;
   background: #2f3239;
   font-family: initial;
   box-shadow: inset 0 1px 2px #0007;
   text-align: center;
   color: #fff;
   font-size: 15px;
   padding: 2px 4px;
   border-radius: 5px;
   margin-bottom: 5px;
   letter-spacing: 0.4px;
   white-space: nowrap;
   overflow: hidden;
 }

 .sprofile-team li>span {
   font-size: 13px;
   color: #ddd;
   text-align: center;
   width: 100%;
 }

 .sprofile-content {
   padding: 10px 5px;
 }

 .sprofile-navbar {
   display: flex;
 }

 .sprofile-navbar h5 {
   font-size: 14px;
   margin: auto 0;
   padding: 0 15px;
   color: #eee;
 }

 .sprofile-navbar>a {
   display: flex;
   font-size: 14px;
   line-height: 25px;
   padding: 0 10px;
   color: #eee;
   margin: auto;
   margin-right: 0;
 }

 .sprofile-navbar>a:after {
   content: "\f105";
   margin-left: 10px;
   font-family: 'icomoon' !important;
   font-size: 18px;
   line-height: 100%;
 }

 @media(max-width: 396px) {

   .sprofile-navbar h5,
   .sprofile-navbar>a {
     font-size: 13px;
   }
 }

 .sheader-loginsignup {
   display: flex;
   padding: 6px;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   box-shadow: 0 1px 5px #000a;
   filter: drop-shadow(0 1px 4px #000a);
   transition: filter 0.4s ease;
   border-radius: 10px;
   margin: auto;
   margin-right: 5px;
   cursor: pointer;
 }


 /*** p_loading.php **/

 .ssload-flip {
   display: grid;
   width: 100%;
   margin-top: 50%;
 }

 .ssload-center {
   display: flex;
   margin: auto;
   width: 210px;
   overflow: hidden;
 }

 .ssload-center span {
   display: flex;
   width: 70px;
   height: 70px;
 }

 .ssload-center span:nth-child(1):before {
   background: url(../images/p_logo.png);
 }

 .ssload-center span:nth-child(2):before {
   background: url(../images/s_logo.png);
 }

 .ssload-center span:nth-child(3):before {
   background: url(../images/7_logo.png);
 }

 .ssload-center span:before {
   content: '';
   background-size: contain !important;
   background-repeat: no-repeat !important;
   background-position: center !important;
   width: 100%;
   height: 100%;
   margin: 5px;
 }

 .ssload-center span:nth-child(1) {
   animation: coinMove1 2.1s infinite;
 }

 .ssload-center span:nth-child(2) {
   animation: coinMove2 2.1s infinite;
 }

 .ssload-center span:nth-child(3) {
   animation: coinMove3 2.1s infinite;
 }

 @keyframes coinMove1 {
   0% {
     transform: scale(0);
     opacity: 0;
   }

   20% {
     opacity: 0;
   }

   50% {
     transform: scale(1);
     opacity: 1;
   }

   65% {
     opacity: 1;
   }

   100% {
     opacity: 0;
   }
 }

 @keyframes coinMove2 {
   0% {
     transform: scale(0);
     opacity: 0;
   }

   20% {
     opacity: 0;
   }

   50% {
     transform: scale(1);
     opacity: 1;
   }

   65% {
     opacity: 1;
   }

   100% {
     opacity: 0;
   }
 }

 @keyframes coinMove3 {
   0% {
     transform: scale(0);
     opacity: 0;
   }

   20% {
     opacity: 0;
   }

   50% {
     transform: scale(1);
     opacity: 1;
   }

   65% {
     opacity: 1;
   }

   100% {
     opacity: 0;
   }
 }

 .ssload-flip label {
   color: black;
   background: -webkit-linear-gradient(90deg, #ee740a, #ff9815);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   margin: auto;
   letter-spacing: 12px;
   font-size: 12px;
   font-weight: 400;
   font-family: Mont500, system-ui;
   margin-top: 15px;
   filter: brightness(1.5);
   animation: shake2 3.2s infinite;
 }

 @keyframes shake2 {
   0% {
     transform: translateX(0);
   }

   30% {
     transform: translateX(0);
   }

   31% {
     transform: translateX(2px);
   }

   32% {
     transform: translateX(-2px);
   }

   33% {
     transform: translateX(3px);
   }

   34% {
     transform: translateX(-1px);
   }

   35% {
     transform: translateX(2px);
   }

   36% {
     transform: translateX(-2px);
   }

   37% {
     transform: translateX(1px);
   }

   38% {
     transform: translateX(-3px);
   }

   39% {
     transform: translateX(2px);
   }

   40% {
     transform: translateX(0);
   }

   100% {
     transform: translateX(0);
   }
 }


 /*** end p_loading.php ***/
 /****************** Signup ********************/
 .site-header .header-backbtn {
   position: absolute;
   display: flex;
   width: 50px;
   height: 50px;
 }

 .site-header .header-backbtn img {
   width: 30px;
   height: 30px;
   object-fit: contain;
   margin: auto 6px;
 }

 .site-header .header-center {
   color: #fff;
   font-family: system-ui;
   font-size: 23px;
   text-shadow: 0 1px 2px #000;
   margin: auto;
 }

 .site-login-main {
   max-width: 500px;
   margin: auto;
 }

 .site-login-logo {
   display: flex;
   margin: 10px 0;
 }

 .site-login-logo img {
   width: 50%;
   object-fit: contain;
   max-width: 240px;
   margin: auto;
 }

 .site-login-section label {
   margin: 0;
   font-size: 12px;
   color: #ddd;
 }

 .site-login-section input,
 .site-login-section select {
   background: #fffffc !important;
   color: #000 !important;
   border: 1px groove #d6b22d99 !important;
   box-shadow: 0 1px 2px #000a;
   height: 35px;
   font-size: 14px;
   padding: 2px 15px;
 }

 .form-verified-btn {
   display: flex;
 }

 .form-verified-btn input,
 .form-verified-btn select {
   border-radius: 5px 0 0 5px;
   height: 36px;
   margin-top: 10px;
   width: 100%;
 }

 .form-verified-btn .btn-verified {
   width: 50%;
   min-width: 100px;
   height: 35px;
   color: #000;
   border-radius: 0 5px 5px 0;
   font-size: 13px;
   text-shadow: 0 0 1px #000a;
   text-transform: uppercase;
   border: 1px groove #fff9ba8f;
   background: linear-gradient(0deg, #debd60, #fff5ca 50%);
 }

 .site-login-section .btn-login {
   display: table;
   margin: auto;
   min-width: 224px;
   border: 1px groove #ffcd6d5c;
   box-shadow: 0 2px 4px #0007;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   border-radius: 3px;
   color: #000;
   font-size: 16px;
   padding: 0 5px;
   text-shadow: 0 0 1px #000;
   height: 34px;
   line-height: 28px;
 }

 .site-login-lang {
   display: flex;
   margin-bottom: 50px;
   padding-top: 10px;
 }

 .site-login-lang a {
   display: inline-block;
 }

 .site-login-lang a:hover img,
 .site-login-lang a:focus img,
 .site-login-lang a:active img {
   filter: brightness(1.4) drop-shadow(0px 0px 2px #ff0000aa);
 }

 .site-login-lang a:first-child {
   margin-left: auto;
 }

 .site-login-lang a:last-child {
   margin-right: auto;
 }

 .site-login-lang a img {
   width: 35px;
   height: 35px;
   object-fit: contain;
   transition: all 0.5s ease;
 }

 .login-notes {
   font-size: 12px;
   font-size: 12px;
   font-family: Mont300, system-ui;
   color: #ff9191;
   padding-top: 5px;
   margin-top: 2px;
   margin-bottom: 5px;
 }

 /*** lang header **/
 .header-lang-bar {
   position: absolute;
   display: none;
 }

 .header-lang-bar.active {
   display: block;
 }

 .header-lang-list {
   background: linear-gradient(0deg, #300d66, #31c9ceee);
   border: 1px solid #080d25;
   border-radius: 20px;
 }

 .header-lang-list a {
   display: block;
 }

 .header-lang-list a img,
 .header-lang-main img {
   width: 40px !important;
   height: 40px !important;
 }

 .header-lang {
   position: relative;
   display: flex;
   margin-right: 5px;
 }

 .header-lang-menu {
   display: flex;
   height: 40px;
   width: 40px;
   padding: 3px;
   background: linear-gradient(180deg, #f3c721, #d58a14);
   box-shadow: 0 1px 5px #000a;
   filter: drop-shadow(0 1px 4px #000a);
   transition: filter 0.4s ease;
   border-radius: 50%;
   margin: auto;
   margin-right: 5px;
   cursor: pointer;
 }

 .header-lang-menu:hover {
   filter: grayscale(0) brightness(1.1);
 }

 .header-lang-menu img {
   height: 100%;
   border-radius: 50%;
   border: 1px solid #222;
   box-shadow: 0 1px 3px #0008;
 }

 .header-lang-hide {
   display: none;
   position: absolute;
   top: 38px;
   right: -4px;
   background: #000e;
   box-shadow: 0 1px 4px #0007;
   border-radius: 50px;
   border: 2px solid #fff;
   padding: 5px 0;
 }

 .header-lang-hide.active {
   display: block;
   animation: fadeIn 0.7s;
 }

 .header-lang-hide a {
   display: flex;
   padding: 8px 10px;
 }

 .header-lang-hide a img {
   width: 32px;
   height: 32px;
   border-radius: 50%;
 }


 /*game*/
 .site-games-board {
   display: flex;
   width: 100%;
   /*padding: 20px;
    background: linear-gradient(to bottom, rgb(40 169 218) 0%, #43c0ff 100%);
    border-radius: 0px 0px 20px 20px;*/
   /*background-color: #fff;*/
   /*height: 150px;
    margin-top: 26px;*/
 }

 .site-games-logo {
   width: 30%;
   display: contents;
 }

 /*.site-games-logo img {
    display: block;
    margin: 10%;
    margin-left: 20%;
    margin-right: 20%;
    text-align: center;
    width: 60%;
}*/
 .site-games-logo img {
   display: block;
   margin: auto;
   margin-top: 5%;
   margin-bottom: 5%;
   text-align: center;
   width: 80%;
 }

 .subpage-gamestransfer {
   width: 100%;
   padding: 10px;
   /*padding-top:80px;*/
   padding-bottom: 15px;
   background-color: #ffffff;
   border-radius: 5px;
 }

 .subpage-gamestransfer-left {
   width: 50%;
   float: left;
   margin-bottom: 10px;
   text-align: left;
 }

 .subpage-gamestransfer-left span {
   font-size: 17px;
   font-weight: 600;
   /*font-size: 14px;*/
   color: #000;
   text-align: left;
 }

 .subpage-gamestransfer-right {
   width: 50%;
   float: right;
   margin-bottom: 10px;
   text-align: right;
 }

 .subpage-gamestransfer-right span {
   font-size: 14px;
   font-weight: 600;
   color: #000;
   margin-right: 10px;
 }

 .subpage-gamestransfer-right img {
   width: 10%;
 }

 .subpage-gamestransfer-display {
   text-align: center;
   border-bottom: 1px solid #000;
 }

 .subpage-gamestransfer-display input {
   color: #000 !important;
   font-size: 35px;
   width: 80%;
   background: transparent;
   border: none;
   text-align: center;
 }

 .subpage-gamestransfer-total-text {
   width: 15%;
   float: left;
   margin-bottom: 10px;
 }

 .subpage-gamestransfer-total-text span {
   font-size: 14px;
   color: #000;
 }

 .subpage-gamestransfer-total-amount {
   width: auto;
   margin-bottom: 10px;
 }

 .subpage-gamestransfer-total-amount span {
   font-size: 14px;
   color: #FF9800;
   margin-left: 10px;
 }

 .subpage-gamestransfer-explain-left {
   width: 40%;
   float: left;
   margin-bottom: 10px;
 }

 .subpage-gamestransfer-explain-left span {
   font-size: 14px;
   color: #543f00;
 }

 .subpage-gamestransfer-explain-right {
   width: 60%;
   margin-bottom: 10px;
   float: right;
   text-align: left;
 }

 .subpage-gamestransfer-explain-right span {
   font-size: 14px;
   color: #543f00;
 }

 .subpage-gamestransfer-button {
   width: 100%;
   margin-bottom: 10px;
 }

 .subpage-gamestransfer-button button,
 .subpage-gamestransfer-button a {
   width: 98%;
   line-height: 15px;
   color: #000;
   background: linear-gradient(0deg, #FFC107, #FF5722) !important;
   margin-top: 30px;
   padding: 10px;
   border: 2px solid #F44336;
   justify-content: center;
 }

 .subpage-games {
   width: 100%;
   padding: 10px;
   /*padding-top:80px;*/
   padding-bottom: 15px;
   background-color: #fff8d0;
   border-radius: 5px;
 }

 .subpage-games-left {
   width: 50%;
   float: left;
   margin-bottom: 10px;
   text-align: left;
 }

 .subpage-games-left span {
   font-size: 14px;
   color: #000;
 }

 .subpage-games-right {
   width: 50%;
   float: right;
   margin-bottom: 10px;
   text-align: right;
 }

 .subpage-games-right span {
   font-size: 14px;
   color: #000;
   margin-right: 10px;
 }

 .subpage-games-right img {
   width: 10%;
 }

 .subpage-games-display {
   text-align: center;
   border-bottom: 1px solid #000;
 }

 .subpage-games-display span {
   color: #000 !important;
   font-size: 35px;
 }

 .subpage-games-total-text {
   width: 15%;
   float: left;
   margin-bottom: 10px;
 }

 .subpage-games-total-text span {
   font-size: 14px;
   color: #000;
 }

 .subpage-games-total-amount {
   width: auto;
   margin-bottom: 10px;
 }

 .subpage-games-total-amount span {
   font-size: 14px;
   color: darkseagreen;
   margin-left: 10px;

 }

 .subpage-games-explain-left {
   width: 40%;
   float: left;
   margin-bottom: 10px;
 }

 .subpage-games-explain-left span {
   font-size: 14px;
   color: #808080;
 }

 .subpage-games-explain-right {
   width: 60%;
   margin-bottom: 10px;
   float: right;
   text-align: left;
 }

 .subpage-games-explain-right span {
   font-size: 14px;
   color: #808080;
 }

 .subpage-games-button {
   width: 100%;
   margin-bottom: 10px;
 }

 .subpage-games-button a {
   width: 98%;
   line-height: 15px;
   color: #000;
   background: linear-gradient(5deg, #a7864a 5%, #eac989 95%);
   margin-top: 30px;
   padding: 10px;
 }


 /**************** Others ****************/
 .site-ccservices {
   display: grid;
   width: 100%;
   margin: auto;
   margin-top: 50px;
   max-width: 600px;
 }

 .ccservices-main {
   border: 1px solid #555;
   min-height: 500px;
   margin: 0 10px;
 }

 .ccservices-main a {
   display: block;
   margin: 10px;
   padding-bottom: 5px;
   border-bottom: 1px solid #555;
   box-shadow: 0 2px 3px #000a;
   filter: drop-shadow(2px 4px 6px black);
 }

 .ccservices-main a:hover,
 .ccservices-main a:active,
 .ccservices-main a:focus {
   filter: brightness(1.3);
   border-radius: 15px 15px 0 0;
   border-color: #0b7b6d;
 }

 .ccservices-main a:after {
   content: '';
   background: url(../images/icon2/arrow-right.png) no-repeat;
   background-size: 25px 25px;
   background-position: center right;
   width: 30px;
   height: 50px;
   position: absolute;
   right: 0;
   top: 0;
 }

 .ccservices-main a img {
   width: 50px;
   height: 50px;
   object-fit: contain;
 }

 .ccservices-main a span {
   color: #fff;
   margin-left: 5px;
   font-size: 14px;
   text-shadow: 0 1px 3px #000a;
 }

 .ccservices-main h4 {
   text-transform: uppercase;
   font-size: 20px;
   color: antiquewhite;
   margin-left: 5px;
   text-shadow: 0 1px 3px #000a;
 }

 .btn-fcss1 {
   background: linear-gradient(0deg, #b58925, #fffb82) !important;
   height: 45px;
   line-height: 45px;
   color: #000 !important;
   text-shadow: 0 0 1px #0008;
   text-align: center;
   border: none;
   border-radius: 4px;
   font-family: system-ui;
   width: 100%;
 }

 .btn-fcss1 span i {
   font-size: 20px;
   margin: auto;
   margin-right: 5px;
 }

 .btn-fcss2 {
   background: linear-gradient(90deg, #f44336, #be352b) !important;
   height: 45px;
   line-height: 45px;
   color: #fff !important;
   text-shadow: 0 0 1px #0008;
   text-align: center;
   border: none;
   border-radius: 4px;
   font-family: system-ui;
   width: 100%;
 }

 .btn-fcss2 span i {
   font-size: 20px;
   margin: auto;
   margin-right: 5px;
 }

 .form-note {
   background: #e5e5e5;
   color: #888;
   font-size: 13px;
   padding: 5px 10px;
   font-family: system-ui;
   margin-bottom: 10px;
 }



 .site-friend {
   margin: 10px 0;
 }

 .site-friend form {
   display: grid;
 }

 .site-fsearch {
   display: flex;
   margin: 0 15px;
   width: calc(100% - 30px);
   background: #eaeaea;
   border-radius: 5px;
 }

 .site-fsearch i {
   font-size: 20px;
   margin: auto 10px;
   margin-right: 0;
   color: #999;
 }

 .site-fsearch input {
   border: none;
   outline: none !important;
   padding: 0 10px;
   font-size: 14px;
   width: 100%;
   background: unset;
   height: 33px;
 }

 .sfriend-group {
   margin-bottom: 50px;
 }

 .sfriend-item {
   display: flex;
   padding-top: 10px;
 }

 .sfriend-item img {
   width: 45px;
   height: 45px;
   object-fit: contain;
   border-radius: 50%;
   margin: auto 10px;
 }

 .sfriend-name {
   display: grid;
   width: 100%;
   border-bottom: 1px solid #e5e5e5;
   padding-left: 5px;
   padding-right: 15px;
   min-height: 50px;
 }

 .sfriend-name h5 {
   font-size: 16px;
   /*
 text-shadow: 0 0 1px #030303;*/
   margin: auto 0;
   color: #ffc73d;
 }

 .sfriend-name span {
   font-size: 13px;
   color: #999;
   letter-spacing: 0.4px;
 }

 .sfriend-header {
   background: #eee;
   height: 33px;
   line-height: 33px;
   padding: 0 15px;
   margin: 10px 0;
   color: #777;
   text-shadow: 0 0 1px #333;
 }

 .fsearch-scan {
   display: flex;
   width: 40px;
 }

 .fsearch-scan i {
   margin: auto;
   font-size: 24px;
   color: #735806;
 }

 .fsearch-scan i:after {
   top: 11px;
   width: 16px;
 }

 .sfriend-header.sc2 {
   font-size: 14px;
   text-shadow: unset;
   margin-bottom: 3px;
   color: #555;
 }

 .sfriend-request {
   margin-bottom: 50px;
 }

 .sfriend-nav {
   display: flex;
 }

 .sfriend-nav span {
   position: relative;
   text-align: center;
   height: 45px;
   line-height: 40px;
   width: 100%;
   font-family: system-ui;
   border-bottom: 2px solid #eee;
   transition: all 0.4s ease;
   color: #fff;

 }

 .sfriend-nav span:first-child:before {
   content: '';
   position: absolute;
   top: calc(50% - 10px);
   right: 0;
   width: 1px;
   height: 20px;
   background: #ccc;
 }

 .sfriend-nav span.active {
   color: #e09f2e;
   text-shadow: 0 0 1px #e09f2e;
   border-bottom: 2px solid #e09f2e;
 }

 .sfriend-detail {
   display: none;
   position: relative;
   width: 100%;
   min-height: 300px;
 }

 .sfriend-detail.active {
   display: block;
   animation: fadeIn 0.5s ease;
 }

 .sfriend-detail.empty:before {
   content: '';
   position: absolute;
   top: 15%;
   left: 15%;
   background-size: contain;
   background-position: center;
   width: 70%;
   height: 70%;
 }

 .site-bclist {
   display: grid;
 }

 .site-bcitem {
   display: flex;
   width: 100%;
   background: #000;
   padding: 5px;
   border-top: 1px solid #eee;
   border-bottom: 1px solid #eee;
 }

 .site-bcitem:nth-child(even) {
   background: #eff3f6;
 }

 .sbcitem-logo {
   display: flex;
   margin-left: 8px;
   margin-right: 8px;
 }

 .sbcitem-logo img {
   border-radius: 50%;
   width: 44px;
   height: 44px;
   object-fit: cover;
   background: #aaa;
   margin: auto;
 }

 .sbcitem-detail,
 .sbcitem-cash {
   padding: 8px 5px;
   display: grid;
   min-height: 60px;
 }

 .sbcitem-detail h5,
 .sbcitem-cash h5 {
   font-size: 15px;
   font-family: sans-serif;
   text-shadow: 0 0 1px #0008;
   margin: 0;
   color: #fff;
 }

 .sbcitem-detail span,
 .sbcitem-cash span {
   font-size: 13px;
   color: #888;
 }

 .sbcitem-cash {
   margin-left: auto;
   text-align: right;
 }

 .sbcitem-cash span {
   font-weight: bold;
   font-family: sans-serif;
   font-size: 15px;
   margin-top: 2px;
   color: #000;
 }

 .sbcitem-cash span font {
   font-weight: normal;
   margin-right: 10px;
   font-size: 11px;
   color: #999;
 }

 .noticeinsidepage {
   width: 100%;
   padding: 5%;
   border: solid 2px #FFC107;
 }

 .noticeinsidepage h5 {
   font-size: 20px;
   color: #FFC107;
 }

 /*customerservice*/

 .sservice-main {
   display: grid;
   padding: 5px 10px;
 }

 .sservice-item {
   position: relative;
   display: flex;
   background: #383b42;
   box-shadow: 0 1px 5px #0005;
   padding: 3px 5px;
   border-radius: 5px;
   margin-bottom: 10px;
 }

 .sservice-logo {
   min-width: 50px;
   height: 50px;
   border: 1px solid #aaa;
   box-shadow: inset 0 1px 10px #0005;
   border-radius: 5px;
   margin: auto;
   margin-right: 10px;
 }

 .sservice-logo img {
   width: 100%;
   height: 100%;
 }

 .sservice-detail {
   width: 100%;
   padding: 5px;
   display: grid;
 }

 .sservice-detail h5 {
   font-size: 15px;
   font-family: Any-400, Microsoft Yahei;
   color: #ffdc5e;
   margin: 0;
 }

 .sservice-detail p {
   font-size: 12px;
   font-family: system-ui;
   letter-spacing: 0.2px;
   color: #ddd;
   margin: 0;
 }

 .sservice-date {
   display: flex;
 }

 .sservice-date:before {
   content: '';
   position: absolute;
   top: 5px;
   right: 10px;
   width: 20px;
   height: 20px;
   background: url(../images/icon/check.png) no-repeat center;
   background-size: contain;
   filter: brightness(2.4);
 }

 .sservice-date span {
   font-size: 18px;
   font-family: Any-600, Microsoft Yahei;
   letter-spacing: 0;
   display: flex;
   margin-top: auto;
   min-width: max-content;
   padding: 0 5px;
   line-height: 100%;
 }

 .sservice-date span font {
   font-size: 12px;
   margin-bottom: 2px;
   margin-top: auto;
   margin-right: 8px;
 }

 /*bankaccount*/

 .baccounts-main {
   display: grid;
   padding: 5px 10px;
 }

 .baccounts-item {
   position: relative;
   display: flex;
   background: #383b42;
   box-shadow: 0 1px 5px #0005;
   padding: 3px 5px;
   border-radius: 5px;
   margin-bottom: 10px;
 }

 .baccounts-logo {
   min-width: 50px;
   height: 50px;
   border: 1px solid #aaa;
   box-shadow: inset 0 1px 10px #0005;
   border-radius: 5px;
   margin: auto;
   margin-right: 10px;
 }

 .baccounts-logo img {
   width: 100%;
   height: 100%;
 }

 .baccounts-detail {
   width: 100%;
   padding: 5px;
   display: grid;
 }

 .baccounts-detail h5 {
   font-size: 15px;
   font-family: Any-400, Microsoft Yahei;
   color: #ffdc5e;
   margin: 0;
 }

 .baccounts-detail p {
   font-size: 12px;
   font-family: system-ui;
   letter-spacing: 0.2px;
   color: #ddd;
   margin: 0;
 }

 .baccounts-date {
   margin-top: 13px;
 }

 /*.baccounts-date:before{
  content: '';
    position: absolute;
    top: 5px;
    right: 10px;
    width: 20px;
    height: 20px;
    background: url(../images/icon/check.png) no-repeat center;
    background-size: contain;
    filter: brightness(2.4);
}*/
 .baccounts-date span {
   font-size: 18px;
   font-family: Any-600, Microsoft Yahei;
   letter-spacing: 0;
   display: flex;
   margin-top: auto;
   min-width: max-content;
   padding: 0 5px;
   line-height: 100%;
 }

 .baccounts-date span font {
   font-size: 12px;
   margin-bottom: 2px;
   margin-top: auto;
   margin-right: 8px;
 }

 /* transfer */

 .stransfer-bank {
   display: flex;
   width: 100%;
   background: #555861;
   margin-bottom: 15px;
   border-radius: 6px;
   box-shadow: 0 1px 5px #0002;
   padding: 4px 0;
 }

 .stransfer-bank>img {
   width: 80px;
   height: 50px;
   margin: auto 5px;
 }

 .stransfer-bank-inner {
   display: grid;
   padding: 0 5px;
   width: 100%;
   padding-top: 5px;
   margin: auto;
 }

 .stransfer-bank-inner h5 {
   font-size: 14px;
   margin: auto 0;
 }

 .stransfer-bank-inner span {
   display: flex;
   font-size: 13px;
   margin: auto 0;
 }

 .stransfer-bank-copy {
   margin-left: 6px;
   width: 18px;
   height: 18px;
   background: url(../images/icon/copy-w.png) no-repeat center;
   background-size: contain;
 }

 .stransfer-amount {
   display: grid;
   padding: 5px;
   border-bottom: 1px solid #8d909d;
   margin-bottom: 10px;
 }

 .stransfer-amount label {
   font-size: 17px;
   text-align: center;
 }

 .stransfer-amount input {
   font-size: 42px;
   text-align: center;
   line-height: 100%;
   color: #ffc800;
   background: unset;
   letter-spacing: 2px;
   border: none;
   width: 100%;
 }

 .stransfer-notice {
   padding: 5px;
   margin-bottom: 5px;
 }

 .stransfer-notice p {
   line-height: 160%;
   font-size: 13px;
   letter-spacing: 0;
   word-break: break-all;
   margin-bottom: 0;
   color: #eee;
 }

 .stransfer-upload {
   display: grid;
   padding: 10px;
   padding-top: 12px;
   margin-bottom: 10px;
   background: #64676dcf;
   border-radius: 10px;
 }

 .stransfer-upload h5 {
   font-size: 14px;
   color: #fff;
   margin-bottom: 5px;
   padding: 0 25px;
 }

 .stransfer-upload-image {
   position: relative;
   width: 100%;
   margin: auto;
   height: 46vw;
   max-height: 400px;
   background: #eee;
   overflow: hidden;
   border-radius: 6px;
 }

 .stransfer-upload-image img {
   position: relative;
   width: 100%;
   height: 100%;
   object-fit: contain;
   z-index: 1;
 }

 .stransfer-upload-image>span.sample {
   display: grid;
   position: absolute;
   top: calc(50% - 35px);
   width: 100%;
   font-size: 15px;
   color: #222;
   font-weight: bold;
   text-align: center;
 }

 .stransfer-upload-image>span.sample:before {
   content: '';
   width: 100%;
   height: 40px;
   background: url(../images/upload-images.png) no-repeat center;
   background-size: contain;
   margin-bottom: 10px;
 }

 .stransfer-upload input {
   display: none;
 }

 .stransfer-qrcode {
   display: flex;
   gap: 10px;
   margin: 10px auto;
 }

 .stransfer-qrcode>a {
   width: 70px;
   height: 70px;
 }

 .stransfer-password {
   display: grid;
   margin-top: 40px;
   margin-bottom: 30px;
 }

 .stransfer-password h5 {
   font-size: 15px;
   text-align: center;
 }

 .stransfer-passkey {
   position: relative;
   width: 100%;
   max-width: 231px;
   margin: auto;
 }

 .stransfer-passkey ul {
   display: flex;
   margin: auto;
   width: 100%;
   gap: 5px;
 }

 .stransfer-passkey ul li {
   width: 100%;
   font-size: 20px;
   height: 35px;
   line-height: 38px;
   text-align: center;
   background: #fff;
   color: #000;
   border-radius: 5px;
   box-shadow: inset 0 1px 5px #0005;
 }

 .stransfer-passkey input {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 1;
   color: #0000;
   background: #0000;
   border: none;
   transform: scale(1.1);
 }


 .site-nav-marquit {
   position: relative;
   display: inline-flex;
   width: 100%;
   height: 28px;
   background: #000;
   border-radius: 50px;
   margin-bottom: 5px;
   overflow: hidden;
   white-space: nowrap;
 }

 .site-nav-marquit>img {
   width: 40px;
   height: 20px;
 }

 .site-nav-marquit i {
   object-fit: contain;
   margin: 3px;
   color: #ffd25a;
   font-size: 18px;
   text-align: center;
   width: 5%;
 }

 .site-nav-marquit span {
   padding-right: 50%;
   color: #fff;
   letter-spacing: 1px;
   font-family: fangsong;
   font-size: 12px;
   line-height: 22px;
   width: 40%;
 }

 .site-nav-marquit a {
   color: #fff;
   font-size: 11px;
   background: linear-gradient(0deg, #010100, #222, #010100);
   margin: auto 4px;
   padding: 0 15px;
   min-width: 60px;
   text-align: center;
   border-radius: 15px;
   border: 2px groove #ffd794;
   box-shadow: 0 1px 3px #ffd79447;
 }

 /***************** Promotion ******************/
 .site-promo-list {
   display: grid;
   max-width: 550px;
   margin: auto;
   margin-top: 10px;
 }

 .site-promo-item {
   margin: 15px;
   border: 1px solid #dbb750;
   border-radius: 5px;
   background: #000;
 }

 .site-promo-item a {
   display: grid;
 }

 .site-promo-item a h4 {
   box-shadow: 0 2px 6px #0007;
   border: 1px groove #ffe49969;
   background: linear-gradient(0deg, #ad740f, #d8b145, #efde97 60%, #fff3bd, #ffe66e);
   text-shadow: 0 0 1px #000;
   border-radius: 4px;
   height: 36px;
   line-height: 36px;
   font-size: 15px;
   color: #000;
   padding: 0 10px;
   margin: -2px;
   z-index: 1;
 }

 .site-promo-item a img {
   width: 100%;
   max-height: 300px;
   object-fit: cover;
   border-radius: 0 0 15px 15px;
   margin-top: -20px;
 }

 .site-promo-view {
   max-width: 800px;
   margin: auto;
 }

 .site-promo-view .banner-img {
   width: 100%;
   max-height: 350px;
   object-fit: cover;
   border-radius: 10px;
 }

 .site-promo-field {
   border: 1px solid #dbb750;
   border-radius: 15px;
   background: linear-gradient(45deg, #0004, #0000 30%);
   margin: 5px;
 }

 .site-promo-field h4 {
   color: #000;
   font-size: 17px;
   padding: 0 15px;
   border: 1px groove #2c62ff5c;
   box-shadow: 0 2px 6px #0007;
   background: linear-gradient(0deg, #ad740f, #d8b145, #efde97 60%, #fff3bd, #ffe66e);
   text-shadow: 0 0 1px #000;
   border-radius: 4px;
   height: 36px;
   line-height: 36px;
   margin: -2px;
 }

 .site-promo-field p {
   font-size: 13px;
   color: #ddd;
   padding: 10px 15px;
   padding-bottom: 30px;
   min-height: 220px;
 }


 /**** popup rate ****/

 .popratexx {
   z-index: 9900;
   display: flex;
   position: absolute;
   width: 90%;
   top: 5%;
   height: 50%;
   margin: 0 5% 5% 5%;
   justify-content: center;
 }

 .poprate_div {
   display: inline-table !important;
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: none;
   background: rgba(0, 0, 0, 0.5);
   z-index: 99;
   color: #000000 !important;
 }

 .poprate_div .section {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
 }

 .poprate_div .poprate_box {
   text-align: center;
   position: relative;
   display: inline-block;
   background-color: white;
   border-radius: 6px;
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
   -webkit-transition: all .18s;
   width: 90%;
   margin-left: 5%;
   margin-right: 5%;
 }

 .poprate_box h3 {
   color: #000000 !important;
   text-align: center;
   padding: 0;
   height: 40px;
   line-height: 40px;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   font-size: 16px;
   font-weight: 400;
   border-radius: 5px 5px 0 0;
   border-bottom: 1px solid #EBEBEB;
   margin: 0px;
 }

 .poprate_box .poprate_content {
   padding: 20px;
   text-align: center;
   width: 100%;
   background: beige;
   overflow-y: scroll;
   height: 562px;
 }

 .poprate_box .poprate_content h4 {
   font-family: fangsong;
   font-size: 21px;
   color: #000;
 }

 .poprate_box .poprate_content01 {
   width: 100%;
   margin-top: 10%;
   display: grid
 }

 .poprate_box .poprate_content01 a {
   padding: 5px;
 }

 .poprate_box .poprate_content01 img {
   width: 15%;
   border: solid 1px #000;
   border-radius: 50px;
 }

 .poprate_box .poprate_content01 span {
   color: #000;
   font-family: monospace;
   font-size: 15px;
   padding-left: 10%;
 }

 .poprate_box .poprate_content01 table {
   font-size: 14px;
   font-family: monospace;
 }

 .poprate_box .poprate_content01 table thead {
   background-color: #FFC107;
 }

 .poprate_box .confirmation_btn {
   position: relative;
   height: 50px;
   text-align: center;
   border-top: 1px solid #EBEBEB;
 }

 .poprate_box .confirmation_btn span {
   position: relative;
   display: inline-block;
   text-align: center;
   font-size: 12px;
   cursor: pointer;
   white-space: nowrap;
   color: #000000;
 }

 .poprate_box .confirmation_btn span button {
   font-size: 14px;
   /*height: 32px;*/
   line-height: 32px;
   box-shadow: none !important;
   color: #000000 !important;
 }

 .poprate_box .confirmation_btn span:first-child {
   height: 46px;
   border-radius: 0 0 0 5px;
   width: 100%;
 }

 .poprate_box .confirmation_btn span:nth-last-of-type(2) {
   width: 49%;
   border-right: 1px solid #d8d8d8;
 }

 .poprate_box .confirmation_btn span:nth-of-type(2) {
   font-weight: 700;
   width: 49%;
   height: 39px;
   border-radius: 0 3px 0 0;
 }


 .border-exchangerate {
   display: block;
   color: #0000;
   padding: 10px;
   font-size: 12px;
   margin-bottom: 40px;
   margin-top: 30px;
   min-height: 90px;
   border: solid 2px #ffd146;
   padding-bottom: 10%;
   background: currentColor;
 }

 .border-exchangerate .exchangerate-head01 {
   width: 100%;
   text-align: center;
   margin-top: 10%;
 }

 .border-exchangerate .exchangerate-head01 label {
   color: #fff;
   font-size: 20px;
   font-family: fantasy;
 }

 .border-exchangerate .exchangerate-head01 span {
   color: #ea8b00;
   font-size: 50px;
   padding-left: 10px;
   font-family: serif;
 }

 .border-exchangerate .exchangerate-head02 {
   width: 100%;
   display: flex;
 }

 .border-exchangerate .exchangerate-head02 a {
   width: 30%;
   line-height: 34px;
   text-align: center;
 }

 .border-exchangerate .exchangerate-head02 a span {
   background: linear-gradient(0deg, #b58925, #ffea82);
   color: #000;
   padding: 10px;
   border-radius: 50px;
   font-size: 15px;
   font-family: monospace;
 }

 .border-exchangerate .exchangerate-head02 input {
   background: #fffffc !important;
   color: #000 !important;
   border: 1px groove #d6b22d99 !important;
   box-shadow: 0 1px 2px #000a;
   height: 35px;
   font-size: 14px;
   padding: 2px 15px;
   width: 211px;
   border-radius: 10px;
   width: 60%;
 }



 .border-exchangerate .exchangerate-head03 {
   padding-top: 10%;
   padding-bottom: 10%;
   text-align: center;
   padding-bottom: 10%;
 }


 .border-exchangerate .exchangerate-head04 {
   width: 100%;
   display: flex;
 }

 .border-exchangerate .exchangerate-head04 a {
   width: 30%;
   line-height: 34px;
   text-align: center;
 }

 .border-exchangerate .exchangerate-head04 a span {
   background: linear-gradient(0deg, #b58925, #ffea82);
   color: #000;
   padding: 10px;
   border-radius: 50px;
   font-size: 15px;
   font-family: monospace;
 }

 .border-exchangerate .exchangerate-head04 input {
   background: #fffffc !important;
   color: #000 !important;
   border: 1px groove #d6b22d99 !important;
   box-shadow: 0 1px 2px #000a;
   height: 35px;
   font-size: 14px;
   padding: 2px 15px;
   width: 211px;
   border-radius: 10px;
   width: 60%;
 }



 .border-exchangerate .exchangerate-head05 {
   display: grid;
   width: 100%;
   text-align: center;
   margin-top: 5%;
 }


 .border-exchangerate .exchangerate-head05 button {
   display: table;
   margin: auto;
   min-width: 224px;
   border: 1px groove #ffcd6d5c;
   box-shadow: 0 2px 4px #0007;
   background: linear-gradient(0deg, #b58925, #fffb82);
   border-radius: 3px;
   color: #000;
   font-size: 16px;
   padding: 0 5px;
   text-shadow: 0 0 1px #000;
   height: 34px;
   line-height: 28px;
   margin-bottom: 5px;
 }


 .border-exchangerate .exchangerate-head05 a {
   display: table;
   margin: auto;
   min-width: 224px;
   border: 1px groove #ffcd6d5c;
   box-shadow: 0 2px 4px #0007;
   background: beige;
   border-radius: 3px;
   color: #000;
   font-size: 16px;
   padding: 0 5px;
   height: 34px;
   line-height: 28px;
 }



 /**** popup popfromrate ****/

 .popfromratexx {
   z-index: 9900;
   display: flex;
   position: absolute;
   width: 90%;
   top: 5%;
   height: 50%;
   margin: 0 5% 5% 5%;
   justify-content: center;
 }

 .popfromrate_div {
   display: inline-table !important;
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: none;
   background: rgba(0, 0, 0, 0.5);
   z-index: 99;
   color: #000000 !important;
 }

 .popfromrate_div .section {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
 }

 .popfromrate_div .popfromrate_box {
   width: 320px;
   text-align: center;
   position: relative;
   display: inline-block;
   background-color: white;
   border-radius: 6px;
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
   -webkit-transition: all .18s;
 }

 .popfromrate_box h3 {
   color: #000000 !important;
   text-align: center;
   padding: 0;
   height: 40px;
   line-height: 40px;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   font-size: 16px;
   font-weight: 400;
   border-radius: 5px 5px 0 0;
   border-bottom: 1px solid #EBEBEB;
   margin: 0px;
 }

 .popfromrate_box .popfromrate_content {
   padding: 20px;
   text-align: center;
   width: 100%;
 }

 .popfromrate_box .popfromrate_content h4 {
   font-family: fangsong;
   font-size: 21px;
   color: #000;
 }

 .popfromrate_box .popfromrate_content01 {
   width: 100%;
   margin-top: 10%;
   display: grid
 }

 .popfromrate_box .popfromrate_content01 a {
   padding: 5px;
 }

 .popfromrate_box .popfromrate_content01 img {
   width: 15%;
   border: solid 1px #000;
   border-radius: 50px;
 }

 .popfromrate_box .popfromrate_content01 span {
   color: #000;
   font-family: monospace;
   font-size: 15px;
   padding-left: 10%;
 }

 .popfromrate_box .confirmation_btn {
   position: relative;
   height: 50px;
   text-align: center;
   border-top: 1px solid #EBEBEB;
 }

 .popfromrate_box .confirmation_btn span {
   position: relative;
   display: inline-block;
   text-align: center;
   font-size: 12px;
   cursor: pointer;
   white-space: nowrap;
   color: #000000;
 }

 .popfromrate_box .confirmation_btn span button {
   font-size: 14px;
   /*height: 32px;*/
   line-height: 32px;
   box-shadow: none !important;
   color: #000000 !important;
 }

 .popfromrate_box .confirmation_btn span:first-child {
   height: 46px;
   border-radius: 0 0 0 5px;
   width: 100%;
 }

 .popfromrate_box .confirmation_btn span:nth-last-of-type(2) {
   width: 49%;
   border-right: 1px solid #d8d8d8;
 }

 .popfromrate_box .confirmation_btn span:nth-of-type(2) {
   font-weight: 700;
   width: 49%;
   height: 39px;
   border-radius: 0 3px 0 0;
 }


 /**** popup poptorate ****/

 .poptoratexx {
   z-index: 9900;
   display: flex;
   position: absolute;
   width: 90%;
   top: 5%;
   height: 50%;
   margin: 0 5% 5% 5%;
   justify-content: center;
 }

 .poptorate_div {
   display: inline-table !important;
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: none;
   background: rgba(0, 0, 0, 0.5);
   z-index: 99;
   color: #000000 !important;
 }

 .poptorate_div .section {
   display: table-cell;
   vertical-align: middle;
   text-align: center;
 }

 .poptorate_div .poptorate_box {
   width: 320px;
   text-align: center;
   position: relative;
   display: inline-block;
   background-color: white;
   border-radius: 6px;
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
   -webkit-transition: all .18s;
 }

 .poptorate_box h3 {
   color: #000000 !important;
   text-align: center;
   padding: 0;
   height: 40px;
   line-height: 40px;
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   font-size: 16px;
   font-weight: 400;
   border-radius: 5px 5px 0 0;
   border-bottom: 1px solid #EBEBEB;
   margin: 0px;
 }

 .poptorate_box .poptorate_content {
   padding: 20px;
   text-align: center;
   width: 100%;
 }

 .poptorate_box .poptorate_content h4 {
   font-family: fangsong;
   font-size: 21px;
 }

 .poptorate_box .poptorate_content01 {
   width: 100%;
   margin-top: 10%;
   display: grid
 }

 .poptorate_box .poptorate_content01 a {
   padding: 5px;
 }

 .poptorate_box .poptorate_content01 img {
   width: 15%;
   border: solid 1px #000;
   border-radius: 50px;
 }

 .poptorate_box .poptorate_content01 span {
   color: #000;
   font-family: monospace;
   font-size: 15px;
   padding-left: 10%;
 }

 .poptorate_box .confirmation_btn {
   position: relative;
   height: 50px;
   text-align: center;
   border-top: 1px solid #EBEBEB;
 }

 .poptorate_box .confirmation_btn span {
   position: relative;
   display: inline-block;
   text-align: center;
   font-size: 12px;
   cursor: pointer;
   white-space: nowrap;
   color: #000000;
 }

 .poptorate_box .confirmation_btn span button {
   font-size: 14px;
   /*height: 32px;*/
   line-height: 32px;
   box-shadow: none !important;
   color: #000000 !important;
 }

 .poptorate_box .confirmation_btn span:first-child {
   height: 46px;
   border-radius: 0 0 0 5px;
   width: 100%;
 }

 .poptorate_box .confirmation_btn span:nth-last-of-type(2) {
   width: 49%;
   border-right: 1px solid #d8d8d8;
 }

 .poptorate_box .confirmation_btn span:nth-of-type(2) {
   font-weight: 700;
   width: 49%;
   height: 39px;
   border-radius: 0 3px 0 0;
 }


 .sprofile-tables {
   font-family: Mont300, system-ui;
   letter-spacing: 0.4px;
   padding: 5%;
   border: 2px solid #807301;
   border-radius: 10px;
   margin: 5%;
   width: 90%;
 }

 .sprofile-tbtitle {
   text-align: center;
 }

 .sprofile-tbtitle h4 {
   font-size: 18px;
   color: #FFC107;
   font-weight: bold;
   margin-bottom: 5px;
 }

 .sprofile-tbtitle h5 {
   font-size: 14px;
   font-weight: bold;
   text-transform: uppercase;
   margin-bottom: 5px;
   color: #fff;
 }

 .sprofile-tables table {
   text-align: center;
   font-size: 12px;
   width: 100%;
   letter-spacing: 0;
   margin-bottom: 15px;
   color: #fff;
 }

 .sprofile-tables table thead {
   background: linear-gradient(0deg, #83781b, #dbcb44, #f2e150, #fcea4c) !important;
   color: #000;
 }

 input[type="radio"] {
   position: absolute;
   opacity: 0;
   cursor: pointer;
 }

 .radio-nobonus label {
   position: relative;
   cursor: pointer;
   padding-left: 40px;
   display: inline-block;
   line-height: 1.8;
   margin-right: 15px;
   color: #fff;
   width: 100%;
 }

 .radio-nobonus span {
   position: absolute;
   left: 0;
   top: 3px;
   height: 21px;
   width: 21px;
   background: #FFF;
   border: 2px solid black;
   border-radius: 50%;
 }

 .radio-nobonus span:after {
   content: '';
   position: absolute;
   left: 3px;
   top: 3px;
   width: 11px;
   height: 11px;
   border-radius: 50%;
   background: #ffd500;
   display: none;
 }

 input[type="radio"]:checked~span:after {
   display: block;
 }

 input[type="radio"]:focus~span {
   outline: 2px solid orange;
 }

 .insurance-deposit label {
   border-radius: 5px;
   width: 100%;
 }

 .insurance-deposit .row {
   width: 100%;
   margin: 0;
 }

 .insurance-deposit .col-4 {
   padding: 0 10px;
 }

 .insurance-deposit .radio input {
   display: none;
 }

 .insurance-deposit .highlight {
   text-align: center;
   margin-bottom: 10px;
   padding: 10px 5px;
   transition: .5s all ease;
   color: #ffc73b;
   text-align: center;
   border: 1px solid #ffc107;
   border-radius: 0.25rem;
 }

 .insurance-deposit .highlight img {
   width: 100%;
   max-width: 120px;
   max-height: 120px;
   object-fit: contain;
   border: none;

 }

 .insurance-deposit .highlight.active {
   background: #ffb100;
   border-radius: 0.25rem;
   box-shadow: 0px 0px 8px #fff1bc;
   color: #000;
 }

 .result_div {
   display: table;
   position: fixed;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   display: none;
   background: rgba(0, 0, 0, 0.5);
   z-index: 9999;
 }

 .promotion-group {
   padding: 15px 0;
   border-top: 1px solid #f0decd;
   width: 100%;
 }


 .site-deposit-item {
   display: flex;
   margin: 0px 5px 20px;
   /* background-color: rgb(71, 53, 21,0.4); */
   background-color: #ffffff;
   padding: 10px;
   border-radius: 7px;
   color: #000000;
 }

 .site-deposit-item img {
   width: 100%;
   border-radius: 7px;
 }

 .site-deposit-item span {
   display: block;
   color: #694c4c;
   text-align: center;
   letter-spacing: -1px;
 }

 .site-deposit-item label {
   color: #000000;
   margin-bottom: 0px;
 }

 .deposit_description {
   border-radius: 10px;
   border: 1px solid #dfe3ee;
   margin: 15px 0px;
   max-height: 200px;
   overflow: scroll;
   font-size: 14px;
   width: 100%;
   padding: 5px 10px;
 }

 .deposit_details {
   margin: 5px 0px;
   font-size: 14px;
 }

 .deposit_details span {
   padding: 0px 5px;
 }

 .deposit_details span:first-child {
   width: 30%;
 }

 .deposit_details span:last-child {
   width: 70%;
 }

 .site-title-deposit {
   height: 40px;
   line-height: 40px;
   text-align: center;
 }

 .site-title-deposit h5 {
   letter-spacing: 0px;
   line-height: 40px;
   margin: 0;
   font-size: 1rem;
   color: #ffffff;
 }

 .site-deposit table {
   background-color: #ece3de;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   border-radius: 10px;
   border-collapse: inherit;
   border: 1px solid #463615;
   border-spacing: 0px;
 }

 .site-deposit .table th {
   padding: 10px;
   color: #463615;
   font-size: 14px;
   text-align: center;
   border-right: 1px solid #463615;
   border-top: 1px solid #000000;
   border-bottom: 1px solid #000000;
 }

 .site-deposit table tr:last-child td:first-child {
   border-bottom-left-radius: 10px;
 }

 .site-deposit .table td:first-child {
   border-left: none;
 }

 .site-deposit table tr:first-child td {
   border-top: 1px solid #463615;
 }

 .site-deposit table tr:last-child td {
   border-bottom: none;
 }

 .site-deposit .table td {
   padding: 10px 5px;
   color: #463615;
   font-size: 12px;
   text-align: center;
   border-right: 1px solid #463615;
   border-bottom: 1px solid #463615;
 }

 .site-deposit .outline-badge-warning {
   background: #ff9821;
   color: #ffffff;
 }

 .site-deposit .outline-badge-success {
   background-color: #00a75b;
   color: #ffffff;
 }

 .site-deposit .outline-badge-danger {
   background-color: #e10002;
   color: #ffffff;
 }

 .site-deposit .badge-site {
   display: inline-block;
   padding: 0.25em 0.4em;
   text-align: center;
   border-radius: .25rem;
 }

 .site-deposit .btn-edit {
   background: #818285;
   color: #ffffff;
   font-size: 12px;
   padding: 3px;
 }

 .site-deposit .btn-edit:hover {
   color: #dfe3ee;
 }

 html body .widthpercent70 {
   width: 70% !important;
 }

 .site-deposit .table th:last-child {
   border-right: none;
 }

 .radio_dgroup {
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   flex-direction: unset;
   display: flex;

 }

 .radio_date input:checked+span {
   background: linear-gradient(180deg, #ec8d31, #f5c151, #fefb94, #f4cb62, #f39133, #f8d066) !important;
   color: #000;
 }

 .radio_dgroup label {
   border-radius: 5px;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .radio_date span {
   width: 100%;
   min-width: max-content;
   transition: background 0.4s ease;
   display: inline-block;
   font-weight: 400;
   text-align: center;
   white-space: nowrap;
   vertical-align: middle;
   user-select: none;
   border: 1px solid transparent;
   padding: 0.375rem 0.75rem;
   font-size: 11px;
   line-height: 1.5;
   border-radius: 0.25rem;
   background: lightgrey;
   color: #000;
   margin: 2px;
 }

 .smenu-content {
   margin: 20px;
 }

 /* wallet */
 .listctrytransaction {
   width: 100%;
   display: block;
   margin-top: 20px;
 }

 .head-listctrytransaction {
   display: flex;
   background: #22252a;
   box-shadow: 0 1px 8px #000;
   width: 100%;
   height: 50px;
 }

 .head-listctrytransaction h4 {
   font-size: 15px;
   text-shadow: 0 0 1px #fff5;
   color: #fff;
   margin: auto;
   letter-spacing: 0.5px;
   padding-top: 10px;
 }

 .ctnt-listctrytransaction {
   display: flex;
   gap: 10%;
   padding: 4% 10% 0 10%;
   justify-content: center;
 }

 .ctnt01-listctrytransaction a {
   display: flex;
   flex-direction: column;
   align-items: center;
   /* Centers text below the image */
   gap: 10px;
 }

 .ctnt01-listctrytransaction {
   text-align: center;
 }

 .ctnt01-listctrytransaction img {
   display: block;
   width: 90%;
   margin: 0 auto;
 }

 .maintaining {
   filter: grayscale(1);
 }

 .maintainingp {
   position: absolute;
   transform: translate(0%, 140%) !important;
   width: 100%;
   text-align: center;
   display: flex;
   padding: 5px 20px;
   background: #000000c7;
   align-items: center;
   justify-content: center;
 }

 .imagebadgeheaderright {
   top: 0% !important;
   right: 0% !important;
   transform: translate(-90%, -0%) !important;
   position: absolute;
   width: 50px;
 }

 .favoritebtn {
   position: absolute !important;
   top: 8px;
   right: 8px;
   width: 30px !important;
   cursor: pointer;
 }

 .copy {
   display: inline-block;
   border: 1px solid #e1e2ed;
   padding: 5px 15px;
   border-radius: 5px;
   background: aliceblue;
 }

 .copy span {
   /* margin-left: 10px;
   display: inline; */
   display: flex;
   align-items: center;
 }


 /*************** Others **************/
 .promotion-group {
   padding: 15px 0;
   border-top: 1px solid #f0decd;
 }

 .promotion-image img {
   width: 100%;
   max-height: 350px;
   object-fit: cover;
 }

 .promotion-detail {
   padding: 5px 10px;
   padding-top: 20px;
   color: #ffffff;
 }

 .promotion-detail p {
   font-size: 13px;
   color: #ffffff;
   margin-bottom: 10px;
 }

 .sprofile-top {
   background-size: cover;
   background-position: bottom;
   padding-top: 70px;
 }

 .sprofile-photo {
   display: grid;
   background: #000000;
   padding: 5px;
   border-top: 1px solid #e6e6f3;
   border-bottom: 1px solid #e6e6f3;
   min-height: 70px;
 }

 .sprofile-photo img {
   width: 100px;
   height: 100px;
   object-fit: contain;
   border-radius: 50%;
   background: #000000;
   border: 5px solid #cdcdf1;
   margin: auto;
   margin-top: -50px;
   margin-bottom: 5px;
 }

 .sprofile-photo h5 {
   margin: auto;
   color: #f5dbbd;
   background: -webkit-linear-gradient(#d5a063, #fff1e1, #f0bd86, #bc9567);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   font-size: 17px;
   font-weight: bold;
   filter: drop-shadow(1px 1px 0 #6f491e);
 }

 .sprofile-photo span {
   color: #495177;
   margin: auto;
   font-size: 13px;
   letter-spacing: 0.4px;
   padding: 5px;
 }

 .sprofile-menu {
   background: #fff;
   width: 100%;
   display: flex;
   border-bottom: 1px solid #e6e6f3;
 }

 .sprofile-menu a {
   width: 100%;
   text-align: center;
   color: #ffffff;
   text-shadow: 0 0 2px #b7dbff;
   box-shadow: 0 2px 3px #d8dce3;
   /* background: linear-gradient(45deg, #fff 30% , #f4f5fd 30%, #ebedff, #f4f5fd 70%, #fff 70%); */
   background: linear-gradient(to top right, #000000 11.76%, #3c3333 29.83%, #000000, #3c3333 70.59%, #332e2e 86.13%);
   border-right: 1px solid #e6e6f3;
   font-size: 15px;
   padding: 10px;
   margin: auto;
 }

 .sprofile-menu a:last-child {
   border-right: unset;
   /* background: linear-gradient(135deg, #fff 30% , #f4f5fd 30%, #ebedff, #f4f5fd 70%, #fff 70%); */
   background: linear-gradient(to top left, #000000 11.76%, #3c3333 29.83%, #000000, #3c3333 70.59%, #332e2e 86.13%);
 }

 .sprofile-panel {
   display: grid;
 }

 .sprofile-panel a {
   width: 100%;
   background: linear-gradient(to top, #000000, #34312c);
   border-top: 1px solid #0f0d0d;
   border-bottom: 1px solid #0f0d0d;
   transition: all 0.5s ease;
   display: flex;
   height: 40px;
 }

 .sprofile-panel a:hover,
 .sprofile-panel a:active {
   background: #515153;
   border-color: #080808;
 }

 .sprofile-panel a:hover i,
 .sprofile-panel a:active i {
   border-color: #080808;
 }

 .sprofile-panel a i {
   color: #ffffff;
   font-size: 18px;
   border-right: 1px solid #e1e2ed;
   height: 40px;
   line-height: 40px;
   width: 40px;
   text-align: center;
   display: flex;
   justify-content: center;
 }

 .sprofile-panel a span {
   margin: auto 10px;
   font-size: 14px;
   color: #ffffff;
 }


 .sprofile-panel .list-item {
   width: 100%;
   background: linear-gradient(to top, #000000, #34312c);
   border-top: 1px solid #0f0d0d;
   border-bottom: 1px solid #0f0d0d;
   transition: all 0.5s ease;
   display: flex;
 }

 .sprofile-panel .list-item:hover,
 .sprofile-panel .list-item:active {
   background: #515153;
   border-color: #080808;
 }

 .sprofile-panel .list-item font {
   width: 30%;
   color: #ffffff;
   font-size: 14px;
   border-right: 1px solid #e1e2ed;
   line-height: 40px;
   text-align: center;
 }

 .sprofile-panel .list-item .content-item {
   margin: auto 10px;
   font-size: 14px;
   color: #ffffff;
   margin: auto 0px;
   width: 70%;
   padding-left: 10px;
 }

 .sprofile-panel .list-item .content-item .copy {
   display: inline-block;
   margin-left: 10px;
   border: 1px solid #e1e2ed;
   padding: 5px 15px;
   border-radius: 5px;

   color: black;
   display: flex;
   align-items: center;
   justify-content: center;
   width: fit-content;
 }

 .sprofile-panel .list-item .content-item .copy span {
   margin-left: 10px;
 }

 .btn-playgame {
   position: relative;
   background: linear-gradient(180deg, #fce2c3, #d4b79e, #9f8571);
   color: #fff !important;
   font-size: 14px;
   box-shadow: 0 1px 3px #f2d7b8;
   padding: 10px 6px;
   border-radius: 20px;
   border: 2px outset #b38c6847;
   border-top: 2px solid #f2d2b2;
   line-height: 160%;
 }

 .btn-playgame:before {
   content: '';
   position: absolute;
   left: 7%;
   bottom: 2px;
   background: linear-gradient(#ffe9cf14, #f9e7d380);
   width: 86%;
   height: 18px;
   border-radius: 30px;
 }

 .usernamebutton {
   display: flex;
   width: 100%;
   max-width: 200px;
   margin: auto;
   justify-content: center;
   align-items: center;
 }

 .usernamebutton span {
   max-width: 100px;
   overflow: auto;
   display: flex;
   align-items: center;
 }

 .shakee {
   animation-name: tada;
   animation-duration: 1.5s;
   animation-fill-mode: both;
   animation-iteration-count: infinite;
   -webkit-animation-name: tada;
   -webkit-animation-duration: 1.5s;
   -webkit-animation-fill-mode: both;
   -webkit-animation-iteration-count: infinite;
 }

 @-webkit-keyframes tada {
   0% {
     -webkit-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
   }

   10%,
   20% {
     -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
     transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
   }

   30%,
   50%,
   70%,
   90% {
     -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
     transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
   }

   40%,
   60%,
   80% {
     -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
     transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
   }

   100% {
     -webkit-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
   }
 }

 @keyframes tada {
   0% {
     -webkit-transform: scale3d(1, 1, 1);
     -ms-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
   }

   10%,
   20% {
     -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
     -ms-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
     transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
   }

   30%,
   50%,
   70%,
   90% {
     -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
     -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
     transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
   }

   40%,
   60%,
   80% {
     -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
     -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
     transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
   }

   100% {
     -webkit-transform: scale3d(1, 1, 1);
     -ms-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
   }
 }

 .img_gamelist img {
   width: 25%;
 }

 /* custom marquee */
 .marquee {
   width: 100%;
   overflow: hidden;
   white-space: nowrap;
   position: relative;
 }

 .marquee-track {
   width: 100%;
   display: inline-flex;
   animation: marqueeScroll 15s linear infinite;
   will-change: transform;
 }

 @keyframes marqueeScroll {
   from {
     /* transform: translateX(130%); */
     transform: translateX(100%);
   }

   to {
     transform: translateX(-100%);
   }
 }