/* Define CSS Variables */
:root {
    /* Base Colors */
    --primary-color: #8c6f5e;
    --secondary-color: #ccb1a2;
    --tertiary-color: #6b564c;
    --fourth-color: #d6a779;
    --white-color: #ffffff;
    --black-color: #000000;

    /* Text & link */
    --primary-text-color: #333;
    --secondary-text-color: #000;
    --tertiary-text-color: #fff;

    /*Body*/
    --body-background-color: #fff;
    --body-text-color: #333;

    /* Header, Footer */
    --header-bg-color: #8c6f5e;
    --header-text-color: #fff;
    --header-text-hover: #521b00;
    --footer-bg-color: #8c6f5e;
    --footer-text-color: #fff;

    /*scrolling message*/
    --scrollingmsg-bg-color: linear-gradient(90deg, #8c6f5e, #ccb1a2, #8c6f5e);
    --scrollingmsg-text-color: #1a202c;

    /* Button Colors */
    --button-bg-color: #ccb1a2;
    --button-text-color: ;
    --button-hover-bg-color: ;
    --button-active-bg-color: ;
    --playnow-gradient-color: linear-gradient(180deg, #ffecce, #ffc55e, #c9ab77);
    --playbutton-bg-color: #ffa300;
    --demobutton-bg-color: #98825b;

    /* Form Elements */
    --input-bg-color: #fff;
    --input-border-color: #ccc;
    --input-focus-border-color: #3498db;
    --input-text-color: #333;

    /* Notification Colors */
    --success-color: #2ecc71;
    --error-color: #e74c3c;
    --warning-color: #f39c12;

    /* Card and Container Backgrounds */
    --card-bg-color: #fff;
    --container-bg-color: #ecf0f1;

    /* VIP */
    --vip-background: #12100f;

    /* Banking */
    --bank-linearOne-color: #98825b;
    --bank-linearTwo-color: #65583f;

    /* Modal Popup */
    --close-btn: #ec1c12;
}

::-webkit-scrollbar {  width: 8px;  height: 8px;  }
::-webkit-scrollbar-thumb {  background: var(--secondary-color);  border-radius: 10px;  }
::-webkit-scrollbar-track {  background: var(--primary-color);  border-radius: 0px;  }


html, body {
    height: 100%;
    width: 100%;
    margin: 0px;
    padding: 0px;
    font-size: 16px !important;
    font-family: "Nunito", sans-serif;
    font-family: poppin, sans-serif !important;
    font-weight: 400;
    line-height: 1.5;
    overflow-x: hidden;
    text-align: left;
    background: var(--body-background-color);
}

body {  color: var(--primary-color) !important;  }

input {  outline: unset;  }
img {  width: 100%;  }
a {  color: var(--primary-text-color);  text-decoration: none;  background-color: transparent;  }
a:focus, a:hover {  text-decoration: none !important;  color: var(--tertiary-text-color);  }
img {  width: 100%;  vertical-align: middle;  border-style: none;  }

.btn {  line-height: 1 !important;  }
.page {  display: flex;  }
.page.active {  display: block !important;  }

.menu-top-header {  display: none;  }
.clearboth {  clear: both;  }

.themetbl {  display: table;  }
.themetblrow {  display: block;  }
.themetblcell {  display: block;  }
.themetblwidth {  width: 100%;  }
.themetblheight {  height: 100%;  }
.theme-container-box {  width: 100%;  height: auto;  }

#theme {  display: block;  height: 100%;  width: 100%;  position: relative;  background-size: cover;  }
#theme-frame {  height: 100%;  background: var(--body-background-color);  margin: auto;  width: 100%;  }
#theme-header {  display: block;  position: fixed;  z-index: 1050;  }
#theme-header-link {  width: 100%;  position: fixed;  color: var(--header-text-color);  display: flex;  justify-content: space-between;  }

#theme-header-link .container {  display: flex;  align-content: center;  justify-content: center;  align-items: center;  }

#theme-header-logo {  }
#theme-header-logo img {  border: 0px;  width: auto;  height: 40px;  margin: 10px 0 10px 10px;}
#theme-menu {  flex-grow: 1;  clear: both;  background: var(--header-bg-color);  position: fixed;  z-index: 9;  width: 100%;  }
#theme-container {  clear: both;  min-height: 0px;  }
#theme-title {  display: none;  }
#theme-frame-panel {  display: none;  }
#theme-contain {  float: left;  width: 100%;  display: inline;  margin-top: 60px;  }

#theme-lang {  display: none;  padding-right: 20px;  z-index: 99;  }
#theme-lang ul {  list-style: none;  margin: 0px;  padding: 0px;  text-align: right;  }
#theme-lang ul li {  display: inline;  }
#theme-lang ul li a, #theme-lang ul li a:visited {  padding: 3px 5px 3px 5px;  border-left: 1px solid #888888;  color: var(--tertiary-text-color);  }
#theme-lang ul li:first-child a {  border-left: 0px;  }

#theme-share {  text-align: right;  float: right;  padding: 10px;  color: var(--tertiary-text-color);  }
#theme-share a, #theme-share a:visited, #theme-share a:hover {  color: var(--tertiary-text-color);  text-decoration: none;  }

#theme-nav {  clear: both;  display: block;  overflow: hidden;  }
#theme-nav ul {  margin: 0px;  padding: 0px;  list-style: none;  }
#theme-nav ul li {  display: inline;  }
#theme-nav ul li a {  padding: 0px 10px 0px 10px;  background: url(/theme/_plain_css/imgs/arrow-v.png) left no-repeat;  }

#logo {  width: 160px;  padding: 5px;  }
.logo img {  width: 100%;  }

#redirectaddr {  padding: 9px;  text-align: center;  font-size: 15px;  background: var(--tertiary-color);  border-radius: 20px;  font-weight: bold;  }

.home-link {  margin-bottom: 15px;  }
.home-link a {  color: var(--primary-text-color);  font-size: 12px;  margin: 0 0 30px 0;  }
.home-link a:hover {  color: var(--secondary-color);  }


/*=================================== MODAL ===================================*/
.modal-backdrop {  display: none;  }

.modal {  background: #000000bb;  z-index: 1050;  }
.modal-content {  background: var(--secondary-color);  box-shadow: 0 2px 12px var(--tertiary-color);  border: 0px solid var(--tertiary-color) !important;  border-radius: 5px;  }

.modal-body {   }
.modal-header {  padding: 0 !important;  border: unset;  height: 0;  position: absolute;  top: 5px;  right: 5px;  z-index: 99;  }
.modal-header .close {  margin-top: 0px !important;  padding: 8px 13px;  background: var(--close-btn);  opacity: 1;  border-radius: 50%;  color: var(--tertiary-text-color);  text-shadow: none;  }
.modal-dialog {  width: 40%;  margin: 6% auto; }


/*=================================== MAIN MENU ===================================*/
#mySidenav, .mobilemenu {  display: none;  }

div#cmsmenu {  background: var(--header-bg-color);  display: flex;  width: 100%;  height: 60px;  align-items: center;  justify-content: flex-end;  margin-left: -19%;  }
.cmsmenui.active {  color: var(--header-text-hover-color);  border-radius: 5px;  padding: 5px;  margin: 10px;  }

ul.cmsmenu {  margin: 0px;  list-style: none;  padding: 0px;  background-color: transparent;  background-repeat: repeat;  border-color: transparent;  border-width: 0px;  border-style: solid;  }

ul.cmsmenu li {  display: block;  vertical-align: middle;  border-width: 0px;  color: var(--header-text-color);  cursor: default;  padding: 10px 20px;  }
ul.cmsmenu li a:hover {  color: var(--header-text-hover);  background-color: transparent;  font-size: 12px;  }
ul.cmsmenu li:hover>a {  background-color: unset;  font-size: 12px;  }
ul.cmsmenu:first-child > li:nth-child(n+2) {  border-left: 1px solid var(--demobutton-bg-color);  }

ul.cmsmenu a, ul.cmsmenu li.dis a:hover, ul.cmsmenu li.sep a:hover {  background-color: transparent;  border-color: transparent;  padding: 0;  text-transform: uppercase;  font-size: 12px;  }

ul.cmsmenu ul {  float: left;  z-index: 9;  top: 35px;  left: 0;  border-radius: 10px;  background: var(--primary-color) ;  min-width: 120px;  width: 120px;  }

ul.cmsmenu ul li {  padding: 10px;  }


/*=================================== LANGUAGE LOGIN REGISTER ===================================*/
.header-link {  display: flex;  flex-wrap: wrap;  flex-direction: row;  position: fixed;  align-items: center;  right: 25px;  top: 15px;  }

.language.dropdown {  position: relative;  display: inline-block;  padding: 0;  }
.language .dropbtn {  background: unset;  border: none;  padding: 0;  display: flex;  flex-wrap: wrap;  align-items: center;  }
.language button.dropbtn img {  width: 26px;  margin-right: 5px;  }

.language .dropdown-content {  display: none;  position: absolute;  background: var(--primary-color);  min-width: max-content;  border-radius: 10px;  padding: 5px;  left: 0;  z-index: 99;  }
.dropdown:hover .dropdown-content {  display: block;  padding-top: 5px;  padding-left: 3px;  }

.country-flag-container {  display: flex;  align-items: center;  justify-content: flex-start;  margin-bottom: 15px;  }
.country-info {  display: flex;  flex-direction: column;  margin: 0 5px;  float: left;  }
.country-name {  font-size: 10px;  margin: 0 0 3px 0;  }
.country-languages {  font-size: 11px;  }
.country-languages a {  color: var(--secondary-color);  }
.country-languages a:hover {  color: var(--warning-color);  }
.country-languages span {  color: var(--tertiary-color);  }

.btn-box {  display: flex;  text-transform: uppercase;  }
.btn-box .btn-login {  height: 30px;  background: var(--secondary-color);  border-radius: 5px;  margin-left: 10px;  display: flex;  align-items: center;  justify-content: center;  }
.btn-box .btn-login a {  color: var(--white-color);  }
.btn-box .btn-sign-up {  height: 30px;  background: var(--secondary-color);  border-radius: 5px;  margin-left: 10px;  display: flex;  align-items: center;  justify-content: center;  animation: 1.5s ease 0s infinite normal none move;  }
.btn-box .btn-sign-up a {  color: var(--white-color);  }



@keyframes move {
0% {  opacity: .8;  }
10% {  transform: translate3d(-0.01rem, 0, 0);  }
50% {  transform: scale(0.8);  box-shadow: #ffca0085 0 0 0 0.2rem;  }
80% {  transform: translate3d(-0.01rem, 0, 0);  }
100% {  transform: scale(1);  box-shadow: #ffca0175 0 0 0 0.5rem;  opacity: 1;  }

}


/*----------------------------------------------------------------------------- HOME PAGE -----------------------------------------------------------------------------*/
.m60 { margin: 60px 0;  }


/*=================================== HOME BANNER ===================================*/
.flexslider {  border: 0;  margin: 0;  }
.flex-control-nav {  bottom: 0;  }

.flexslider .slides img {  width: 100%;  height: auto;  }
.home-banner .flex-direction-nav .flex-disabled {  z-index: 5;  opacity: 1 !important;  }


.flexslider .flex-control-nav li {  margin: 0 13px;  }
.flexslider .flex-control-paging li a.flex-active {  background: var(--primary-color);  }
.flexslider .flex-control-paging li a {  width: 20px;  height: 10px;  position: absolute;  margin-top: -3%;  z-index: 9 !important;  background: #9f9e9e89;  border: 1px solid var(--tertiary-color);  }

.flex-direction-nav a:before {  font-size: 35px;  color: var(--tertiary-color);  text-shadow: 1px 1px 0 var(--tertiary-color);  }


/*=================================== HOME ANNOUNCE ===================================*/
.announcetext {  width: 100%;  padding: 15px 5px;  background: var(--scrollingmsg-bg-color);  color: var(--tertiary-text-color);  overflow-x: hidden;  position: relative;  }
.marqIcon {  display: inline-block;  width: 3%;  }
marquee#horizontal_scrollmsg {  vertical-align: middle;  display: inline-block;  width: 94%;  }
marquee#horizontal_scrollmsg ul {  list-style: none;  padding: 0;  width: 100vw;  }


/*=================================== HOME STEP ===================================*/
.homestep {  display: flex;  justify-content: center;  flex-direction: column;  align-content: center;  flex-wrap: wrap;  margin: 30px auto;  }
.homestep h3 {  width: 100%;  text-align: center;  text-transform: uppercase;  color: var(--tertiary-color);  }

.home-button {  display: flex;  flex-wrap: wrap;  list-style: none;  justify-content: center;  gap: 30px;  margin: 30px 0 0;  }
.home-button li button {  padding: 15px 30px;  border-radius: 10px;  border: none;  background: var(--button-bg-color);  color: var(--white-color);  font-weight: bold;  }
.home-button li button:hover { transform: scale(1.1) translateY(5px);  }
.home-button li a {  text-decoration: none;  color: var(--white-color);  font-weight: bold;  }


/*=================================== HOME MOST POPULAR GAMES ===================================*/
.homemostpopular.container {  max-width: 100%;  margin: 60px auto 0;  }
.homemostpopular .populartitle h3 {  text-align: center;  font-weight: 300;  margin-bottom: 30px;  color: var(--tertiary-color);  }

.populargamelist {  display: flex;  }
.populargamelist ul {  width: 100%;  display: flex;  flex-wrap: wrap;  list-style: none;  padding: 0;  justify-content: space-between;  margin: 0;  gap: 25px;  }
.populargamelist ul li {  width: 18%;  background: #ffffff;  position: relative;  height: 240px;  padding: 15px;  border-radius: 10px;  }
.populargamelist ul li:hover {  filter: drop-shadow(0px 6px 5px #ccb1a280);  transform: scale(1.1);  }
.populargamelist ul li p.game-title {  margin: 15px 0;  font-size: 16px;  font-weight: bold;  color: var(--tertiary-color);  }


.popularliimg {  text-align: center;  }
.popularliimg img {  width: 40%;  }
.popularlititle h5 {  text-align: center;  font-weight: bold;  }
.popularliinfo {  font-size: 10px;  }
.popularli button {  background: transparent;  border: none;  font-size: 12px;  padding: 0;  width: calc(100% - 30px);  position: absolute;  bottom: 2%;  }
.popularli button:hover {  transform: scale(1.1);  }
.popularli button a {  color: var(--bank-linearTwo-color);  }


/*=================================== HOME DOWNLOAD ===================================*/
.homedownload {  display: flex;  margin: 30px auto 0;  }
.homedownload-left, .homedownload-right {  width: 50%;  }

.homedownload-right {  display: flex;  flex-wrap: wrap;  }


/*=================================== HOME ABOUT ===================================*/
.homeabout {  margin: 90px auto 0;  display: flex;  flex-wrap: wrap;  }
.homeabout-left {  width: 50%;  background: url(/data/2182/uploads/home-about-bgimgv3.jpg) center;  background-size: cover;  padding: 30px;  color: var(--white-color);  border-radius: 10px;  }
.homeabout-left h5 {  color: var(--button-bg-color);  margin-bottom: 20px;  }
.homeabout-left p {  font-size: 13px;  }

.homeabout-right {  margin-left: 5%;  width: 45%;  padding: 15px 0 0;  }
.homeabout-right h5 {  margin-bottom: 5px;  color: var(--secondary-color);  }
.homeabout-right p {  font-size: 12px;  color: var(--tertiary-color);  }



/*=================================== HOME FAQs ===================================*/
.homefaqs {  margin: 90px auto 0;  }
.home-faqs {  width: 60%;  margin: auto;  }

.home-faqs .populartitle h5 {  margin-bottom: 30px;  text-align: center;  color: var(--tertiary-color);  }

.home-faqs .card {  border: none;  }
.home-faqs .card-header {  border-bottom: 1px solid var(--secondary-color);  background-color: transparent;  padding: 15px 0;  }

.home-faqs .panel-default>.panel-heading {  background: transparent;  border-bottom: 1px solid var(--secondary-color);  }
.home-faqs .panel-title {  margin-top: 0;  margin-bottom: 0;  font-size: 16px;  color: var(--primary-color);  }
.home-faqs .panel-default>.panel-heading a {  color: var(--tertiary-color);   }
.home-faqs .panel-body {  padding: 15px;  }

.show {  display: block;  }


/*=================================== HOME SEO ===================================*/
.homeseo {  margin: 90px auto 0;  }
.home-seo {  width: 80%;  margin: auto;  }

.home-seo h4 {  color: var(--tertiary-color);  font-weight: 600;  }
.home-seo h5 {  color: var(--fourth-color);  font-weight: 600;  margin: 20px 0 5px;  }
.home-seo p {  font-size: 12px;  margin-bottom: 10px;  }
.home-seo li {  font-size: 12px;  }


/*=================================== HOME LINKS ===================================*/
.homelink {  text-align: center;  margin: 30px auto;  }
.homelink p {  color: var(--primary-color);  font-size: 24px;  }
.homelink a {  color: var(--primary-color);  margin: 0 10px;  }


/*=================================== FOOTER ===================================*/
#theme-footer {  font-size: 0;  }
.footer {  display: flex;  flex-wrap: wrap;  background: var(--tertiary-color);  padding: 30px;  font-size: 16px;  }
.footerbg {  display: flex;  flex-wrap: wrap;  }
.footerbg-top {  display: flex;  flex-wrap: wrap;  }
.footerbg-top> div {  width: 16.6%;  padding: 0 15px;  }
.footerbg-top> div:first-child {  padding-left: 0;  }
.footerbg-top> div:last-child {  padding-right: 0;  }
.footerbg-top .footer-title {  font-size: 16px;  text-transform: uppercase;  color: var(--white-color);  }
.footerbg-top p {  color: var(--secondary-color);  font-size: 12px;  }
.footerbg-top li {  list-style: none;  color: var(--white-color);  font-size: 14px;  }
.footerbg-top a {  color: var(--white-color);  }

.footer-payments ul, .footer-partnership ul {  padding: 0;  list-style: none;  display: flex;  flex-wrap: wrap;  }
.footer-payments li img {  width: auto;  height: 50px;  margin: 0 5px;  }

.footer-partnership ul {  padding: 0;  list-style: none;  }
.footer-partnership li img {  width: auto;  height: 50px;  margin: 0 5px;   }

.footer-info li {  margin: 10px 0;  }

.footer-licenses ul {  padding: 0;  list-style: none;  display: flex;  flex-wrap: wrap;  }
.footer-licenses ul li #cert-btn {  background: transparent;  border: none;  padding: 0;  }
.footer-licenses ul li img {  width: auto;  height: 30px;  margin: 5px;  }
.footer-licenses .modal-dialog  {  width: 40%;  margin: 6% auto;  }
.footer-licenses .modal-body, .cert-inside  {  width: 100%;  }

.footerbg-bottom {  margin: 30px 0 0;  }
.footerbg-bottom p {  color: var(--secondary-color);  font-size: 12px;  }
.footerbg-bottom .footer-copyright {  color: var(--white-color);  }
.footerbg-bottom img {  width: auto;  height: 30px;  }


/*=================================== LOGIN ===================================*/
.login {  text-align: center;  margin: 0 auto;  background: var(--secondary-color);  }
.login .logo {  width: 50%;  margin: auto;  padding: 10px 0;  }
.login span {  text-align: center;  }
.login-btm {  text-align: center;  padding: 30px;  }
.login-btm strong {  color: var(--tertiary-color);  }
.login-btm a {  color: var(--primary-text-color);  }
.login-btm a:hover {  color: var(--white-color);  }



.login #customform {  width: 50%;  margin: auto;  padding: 20px 0;  display: flex;  flex-direction: column;  justify-content: space-evenly;  }
.login #customform dl {  margin: 0;  }
.login #customform dl, #loginform dl {  display: inline-block;  width: 100%;  text-align: center;  }

#customform #customform_UserName, #customform #customform_Password {  width: 100%;  font-size: 15px;  border: 0;  border-bottom: 1px solid white;  padding: 10px;  color: var(--black-color);  background: transparent;  outline: unset;  }

.login input#customform_submit {  background: var(--tertiary-color);;  color: var(--white-color);  padding: 5px 20px;  font-weight: bold;  margin-top: 15px;  border-radius: 5px;  border: none;  }


/*=================================== REGISTER ===================================*/
/*------------------------------------------------- REGISTER LEFT -------------------------------------------------*/
#theme-contain-registration {  background: #f2f5f5;  }

.register {  display: flex;  background: #f2f5f5;  border-radius: 5px;  width: 90%;  margin: 30px auto;  flex-wrap: wrap;  }
.reg-txt {  width: 100%;  text-align: center;  padding: 10px;  background: var(--primary-color);  color: var(--white-color);  font-size: 15px;  font-weight: bold;  margin-bottom: 30px;  border-radius: 5px;  }

.regis-content {  width: 100%;  padding: 0;  }
.regisleft {  width: 40%;  float: left;  }
.registelbtn {  width: 100%;  background: linear-gradient(to right, #26a5e4 0%, #8fd7fb 50%, #26a5e4 100%);  background-size: 200% 100%;  padding: 10px 30px;  border-radius: 5px;  margin-bottom: 25px;  text-align: center;  animation: shine 3s linear infinite, pulse 2s ease-in-out infinite;  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2), 0 2px 4px rgba(0, 0, 0, 0.1);  border: 1px solid #1e88e5;  transform: scale(1);  transition: transform 0.5s ease-in-out;  }

.registelbtn a {  color: var(--white-color);  font-weight: bold;  text-decoration: none;  transition: color 0.3s ease;  display: flex;  align-items: center;  justify-content: center;  }

.telegram-logo {  width: 1.2em;  height: 1.2em;  margin-right: 6px;  display: inline-block;  vertical-align: middle;  }

.regis-box {  width: 100%;  background: var(--tertiary-color);  padding: 25px;  float: left;  border-radius: 10px;  }
.register #registerform {  width: 100%;  overflow: auto;  }
.register #registerform dl {  margin-bottom: 5px;  }
.register #registerform dt {  width: 100%;  color: #927d37;  font-size: 10px;  display: none;  }
.register #registerform dd {  text-align: left;  }

.register #registerform #groupSubmit dd {  float: left;  width: 100%;  }

.register #registerform textarea, .register #registerform input[type="text"], .register #registerform input[type="text"], .register #registerform input[type="password"] {  width: 100%;  color: var(--black-color);  font-size: 13px;  padding: 10px;  background: white;  border: 1px solid #9a9a9a !important;  border-radius: 5px;  margin: 5px 0;  height: 40px;  }

.register #registerform .btnCheckUser, #registerform_btnSubmit {  color: var(--tertiary-text-color);  font-weight: bold;  background: var(--primary-color);  padding: 10px;  text-transform: uppercase;  border-radius: 5px;  font-size: 11px;  outline: 0;  border: 0;  }

.register #registerform dl#groupCurrency {  width: 100%;  }

.register #registerform #registerform_Currency {  background: var(--white-color);  width: 100%;  color: #757575;  border: 1px solid #9a9a9a !important;  padding: 10px;  border-radius: 5px;  outline: unset;  }

dl#groupVerifyCode {  display: flex;  flex-direction: row;  justify-content: space-between;  align-items: center;  }

.register input::placeholder {  transform: translateX(0px);  transition: 0.4s;  }
.register input:focus::placeholder {  transform: translateX(200px);  transition: 0.4s;  opacity: 0;  transition-timing-function: ease-in;  }

.reg p {  font-size: 10px;  color: var(--white-color);  margin-top: 20px;  }

.small, small {  color: var(--fourth-color);  }
.small.w3-text-green {  color: green !important;  }
.small.w3-text-red {  color: red !important;  }


/*------------------------------------------------- REGISTER RIGHT-------------------------------------------------*/
.regis-dtl {  width: 58%;  float: right;  background: transparent;  border-radius: 10px;  }

.regis-banner {  width: 100%;  }
.regis-banner img {  width: 100%;  border-radius: 10px;  margin: auto;  }

.regis-info h4 {  text-align: center;  color: var(--secondary-text-color);  font-size: 30px;  font-weight: bold;  margin-top: 15px;  }
.regis-info h5 {  text-align: center;  color: var(--secondary-text-color);  }



/*=================================== GAMES ===================================*/
.gameproduct {  /*margin: 60px auto;*/  }
.gametitle h3 {  margin: 0 0 15px;  }
.game-brand {  display: flex;  flex-wrap: wrap;  flex-direction: row;  align-items: center;  padding: 0;  gap: 15px;  }
.game-brand li {  list-style: none;  }
.game-brand li img {  width: 100px;  }

/*------------------------------------------------- GAME LIST -------------------------------------------------*/
.provider-list {  display: flex;  align-items: stretch;  flex-wrap: wrap;  margin: 0;  padding: 0;  }
.provider-list li {  list-style-type: none;  margin: 0.5em;  max-width: calc(20% - 1em);  border-radius: 5px;  }
.provider-list li .p-box {  border-radius: 5px;  border: none;  position: relative;  display: block;  overflow: hidden;  background: linear-gradient(340deg, #ccb1a2 3%, #ffffff 92%);  box-shadow: 0 1px 3px #0000001f, 0 1px 2px #0000003d;  }
.provider-list li .p-box a {  color: var(--white-color);  }

.provider-list li .p-box .p-logo {  display: block;  margin: 1em auto 0.5em;  width: 90%;  max-width: 150px;  filter: drop-shadow(0px 2px 3px grey);  }
.provider-list li .p-box .p-img {  display: block;  width: 100%;  }
.provider-list li .p-box .p-name {  position: absolute;  z-index: 2;  bottom: 0;  left: 0;  padding: 10px 15px;  font-size: 16px;  color: var(--black-color);  font-weight: bold;  filter: drop-shadow(0px 1px 1px white);  }

.provider-list li .p-box:before {  content: "";  position: absolute;  bottom: 0;  left: 0;  right: 0;  height: 70px;  margin: auto;  background: transparent;  pointer-events: none;  }
.provider-list li .p-box:after {  position: absolute;  display: table;  font-size: 1.1em;  font-weight: normal;  margin: auto;  pointer-events: none;  padding: 0.3em 2em 0;  color: var(--white-color);  }

/*------------------------------------------------- GAME NEW -------------------------------------------------*/
.provider-list li.tag-special {  max-width: calc(40% - 1em);  animation: tagspecial 3s ease-in-out infinite;  }
.provider-list li.tag-special .p-box {  border: 2px solid #f5ae01;  display: flex;  align-items: center;  height: 100%;  background-size: cover;  background-position: center right;  }
.provider-list li.tag-special .p-box .p-logo {  max-width: 200px;  width: 34%;  }
.provider-list li.tag-special .p-box .p-img {  width: 60%;  margin-top: auto;  }
.provider-list li .p-box:before {  background: linear-gradient(to bottom, transparent, #ccb1a2 );  }
.provider-list li.tag-special .p-box:after {  content: "NEW";  bottom: 0;  right: 1em;  background: #f5ae01;  clip-path: polygon(15% 0%, 85% 0%, 100% 100%, 0% 100%);  }

@keyframes tagspecial {
0%, 100% {  box-shadow: 0 0 10px #f5ae01;  }
50% {  box-shadow: 0 0 10px #c48b00;  }
}

/*------------------------------------------------- GAME HOT-------------------------------------------------*/
.provider-list li.tag-hot {    }
.provider-list li.tag-hot .p-box {  border: 1px solid #df0303;  background: radial-gradient(132% 117% at 50% -17%, #ffffff 0, #ccb1a2 100%);  }
.provider-list li.tag-hot .p-box:after {  content: "HOT";  bottom: 0;  right: 0;  padding-right: 1em;  background: #df0303;  clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%);  }

/*------------------------------------------------- GAME PROMO-------------------------------------------------*/
.provider-list li.tag-promo {    }
.provider-list li.tag-promo .p-box {  border: 1px solid #84b500;  background: radial-gradient(50% 50% at 50% 50%, #ffffff 0, #ccb1a2 100%);  }
.provider-list li.tag-promo .p-box:after {  content: "PROMO";  bottom: 0;  right: 0;  padding-right: 1em;  background: #84b500;  clip-path: polygon(100% 0, 100% 50%, 100% 100%, 0% 100%, 10% 50%, 0% 0%);  }


/*------------------------------------------------- GENERAL USE -------------------------------------------------*/
.title {  margin-bottom: 30px;  }
.seo h1, .news-title h1, .title h1, .faq-title {  color: var(--primary-color);  text-align: left;  padding: 10px 0;  font-weight: bold;  border-bottom: 1px solid #927a6e;  }
.seo p {  text-align: justify;  }
.play-btn {  position: relative;  float: left;  background: linear-gradient(180deg, #ccb1a2 0%, #6b564c 100%);  padding: 10px 30px;  font-size: 18px;  border-radius: 30px;  border: none;  filter: drop-shadow(0px 2px 3px #6b564c);  }

.play-btn a {   color: var(--white-color);  }

.page-panel .panel-default>.panel-heading {  background: var(--primary-color);  border-radius: 5px;  z-index: 2;  position: relative;  }
.panel-default>.panel-heading a {  color: var(--white-color);  }
.panel-default .collapse {  }
.panel-body2 {  background: var(--white-color);  padding: 5px 10px 10px;  line-height: 1.5rem;  border-radius: 0 0 5px 5px;  margin-top: -10px;  }
.panel-body2 a {  color: var(--warning-color);  }
.collapse p {  margin: 0;  }


/*=================================== VIP ===================================*/
#theme-contain-vip {  background: #403a3a;  }
.vip-banner-title {  position: absolute;  width: 100%;  top: 25%;  color: var(--white-color);  padding: 0 60px;  filter: drop-shadow(0px 2px 2px black);  }
.vip-banner-title h4, .vip-banner-title h2, .vip-banner-title p {  font-weight: bold;  margin: 0 0 5px 30px;  }

.vip-table-content {  margin: auto;  color: var(--warning-color);  position: relative;  padding: 30px;  border-radius: 10px;  }
.vip-table-content h4, .vip-table-content h5 {  color: var(--white-color);  }

#vip-table {  border-radius: 15px;  margin: 30px auto;  width: 100%;  }
#vip-table td, #vip-table th {  padding: 5px 10px;  }
#vip-table img {  width: auto;  height: 70px;  }
#vip-table img.star {  width: auto;  height: 15px;  }

.vip-level {  text-align: center;  color: var(--white-color);  }
.text-gold {  color: var(--white-color);  padding: 8px 10px !important;  border-top: 1px solid #ffffff;  border-bottom: 1px solid #ffffff;  }


.vip-tbcntnt {  border-radius: 10px;  gap: 4%;  position: relative;  display: flex;  }
.vip1 {  background: var(--primary-color);  border-radius: 10px;  color: var(--white-color);  padding: 15px;  max-width: 48% !important;  float: left;  height: 470px;  list-style: none;  }
.vip-heading1 h3 {  color: var(--white-color);  font-weight: bolder;  margin: 0 0 20px 0;  }
.vip-body1 {  color: var(--black-color);  }
.vip-body1 h5 {  list-style: none;  color: var(--white-color);  }

.vip2 {  background: var(--tertiary-color);  border-radius: 10px;  color: var(--white-color);  padding: 15px;  max-width: 48% !important;  float: right;  height: 470px;  list-style: none;  }
.vip-heading2 h3 {  font-weight: bolder;  margin: 0 0 20px 0;  }




/*=================================== CONTACT US ===================================*/
.contact {  text-align: center;  }
.contact-line {  display: flex;  gap: 15px;  }
.contact-malaysia, .contact-singapore, .contact-indonesia {  float: left;  margin-bottom: 30px;  border: 1px solid #a3775e;  border-radius: 5px;  }
.c-area {  border: 0px solid red;  padding: 10px;  }
.c-area img {  filter: drop-shadow(2px 4px 6px black);  width: 50%;  }
.c-inner {  width: 84%;  padding: 10px;  margin: 0 auto;  }
.c-inner p {  text-align: center;  font-size: 30px;  font-weight: bolder;  color: var(--tertiary-color);  }

table.center {  text-align: left;  margin: auto;  }
table.center a {  color: #0d59ff;  }
.qr {  width: 80%;  margin: auto;  }
.qr img {  width: 100%;  }


/*=================================== BANKING ===================================*/
.seo-line {  border-top: 0px solid #cbcbcb;  padding: 0;  }
.gateway {  border: 1px solid #e1e1e2;  padding: 10px 5px;  border-radius: 5px;  box-shadow: 0 0 5px #a3775ecc;  }
.paygate {  display: flex;  justify-content: space-between;  list-style: none;  padding: 0;  width: 100%;  margin: 0;  }
.paygate li img {  width: 80%;  }

.bank-table table {  background: linear-gradient(180deg, #3c3836 0%, #927a6e 100%);  border: 0px solid #102632;  width: 100%;  margin: auto;  font-size: 14px;  }
.bank-table table tr, .bank-table table th, .bank-table table td {  padding: 10px;  color: #fff;  text-align: center;  border: 1px solid white;  }
.bankrow {  background-color: var(--primary-color);  }


/*=================================== FAQs ===================================*/
.filtering {  margin: 0 0 30px 0;  }
.btn2 {  border: none;  outline: none;  border-radius: 5px;  padding: 10px 30px;  background-color: var(--secondary-color);  cursor: pointer;  margin: 5px 0;  color: var(--black-color);  }
.btn2.active {  background-color: var(--tertiary-color);  color: var(--white-color);  }

.helpc .help-center {  margin: 0 0 60px 0;  background: #f5f2ec;  padding: 30px;  border-radius: 5px;  }
.help-info {  width: 100%;  }
.help-info .panel.panel-default {  width: 100%;  height: auto;  max-height: fit-content;  margin-bottom: 15px;  border: 0;  border-radius: 5px;  background-color: var(--body-text-color);  }
.help-info .panel-default>.panel-heading {  background: var(--primary-color);  border-radius: 5px;  padding: 15px;  }
.help-info .panel-default>.panel-heading a {  color: var(--white-color);  }
.help-info .panel-default>.panel-heading a h4 {  margin: 0;  }
.help-info .panel-default>.panel-heading a h4:hover {  color: var(--warning-color);  }

.help-info .panel-body {  color: var(--white-color);  }
.help-info .panel-body h1 {  color: var(--white-color);  padding: 0;  margin: 0 0 15px;  border: none;  }
.help-info .panel-body a {  color: var(--warning-color);  }
.help-info .panel-body center {  display: none;  }


.filterDiv {  display: none;  }


/*=================================== PROMOTION CATEGORY ===================================*/
#promotion-filter {  margin: 30px 0;  overflow: hidden;  border-radius: 5px;  padding: 0;  }
#promotion-filter .promo-tablinks {  color: var(--tertiary-color);  padding: 0 15px;  margin: 0;  }
#promotion-filter .promo-tablinks input[type=checkbox], input[type=radio] {  margin: 0 5px 0 0;  }

#promotion-filter .promo-tablinks:hover { color: var(--primary-color); }
#promotion-filter .promo-tablinks.active { color: #000f80; border-bottom: 3px solid #000f80; }


/*=================================== PROMOTION DETAIL===================================*/
.promo-wrapper {  width: 100%;  padding: 0;  }

#promobox ol#faq_modal {  display: flex;  flex-direction: column;  flex-wrap: nowrap;  margin: 0;  padding: 0;  gap: 25px;  justify-content: flex-start;  }
#promobox ol#faq_modal li.question {  width: 100%;  list-style: none;  padding: 0px;  display: inline-block;  }
#promobox ol#faq_modal .promo img {  border-radius: 10px;  width: 100%;  }
#promobox ol#faq_modal::after {  content: "";  flex: auto;  }

.promo-wrapper .promo div {  padding: 0;  }
.promo-wrapper .promo .info {  padding: 0 15px;  }
.promo-wrapper .promo .info h3 {  color: var(--secondary-text-color);  margin: 0px;  }
.promo-wrapper .promo .info h5 {  color: #7d5205;  margin-bottom: 10px;  }

.promo .promotion-btn {  margin-top: 10px;  }
.promo .tnc-btn {  color: var(--white-color);  padding: 5px 10px;  background: linear-gradient(to top, #ccb1a2, #8c6f5e, #ccb1a2);  text-transform: uppercase;  border-radius: 5px;  cursor: pointer;  margin-right: 10px;  }
.promo .join-btn {  color: var(--white-color);  padding: 5px 10px;  background: linear-gradient(to top, #6b564c, #dcb37b, #6b564c);  text-transform: uppercase;  border-radius: 5px;  cursor: pointer;  }

.promo-count {  padding: 30px 0 0 30px;  display: flex;  flex-wrap: wrap;  justify-content: flex-start;  }
.promo-count span {  font-size: 12px;  color: var(--secondary-text-color);  width: 100%;  }

.time-container {  display: flex;  margin-top: 5px;  }
.day-box {  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  }
.day-number {  border-radius: 5px;  }
.day-text, .time-text {  margin: 0;  color: #535d64;  font-size: 12px;  }
.time-box-container {  display: flex;  margin: 0 10px;  }
.time-box {  display: flex;  flex-direction: column;  align-items: center;  justify-content: center;  }
.time-colon {  display: flex;  align-items: center;  justify-content: center;  height: 40px;  background: var(--secondary-color);  padding: 0 5px;  }
.time-hour {  border-radius: 5px 0 0 5px;  }
.time-sec {  border-radius: 0 5px 5px 0;  }

.day-number, .time-hour, .time-min, .time-sec {  display: flex;  align-items: center;  justify-content: center;  height: 40px;  min-width: 40px;  background: var(--secondary-color);  color: #4d4d4d;  }


/*=================================== PROMOTION FANCY BOX===================================*/
.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp {  border: 0;  outline: none;  vertical-align: top;  border-radius: 15px;  }

div#faq_fbwrap {  position: fixed !important;  transform: translateY(0%);  width: 70% !important;  margin: auto !important;  left: 0 !important;  right: 0 !important;  }

.fancybox-opened .fancybox-skin {  margin: auto !important;  width: auto;  height: auto;  box-shadow: none;  }
.fancybox-skin {  padding: 15px 0 15px 15px;  text-shadow: none;  position: relative;  }
.fancybox-outer, .fancybox-inner {  position: relative;  }
.fancybox-close {  top: 0px;  right: 0px;  }

.fancybox-inner {  width: 100% !important;  background-color: var(--tertiary-text-color);  overflow: auto;  height: 525px;  color: var(--black-color) !important;  padding: 0 10px;  }
.fancybox-inner p {  margin-bottom: 0;  font-size: 14px;  }
.fancybox-inner h4 {  display: none;  }

.fancybox-inner .promo-banner img {  width: 100%;  margin: 0 0 15px;  }
.fancybox-inner .promo {  display: flex;  flex-direction: row;  padding: 0px;  border-bottom: 0px solid #313131;  }
.fancybox-inner .promo .promo-row img {  position: relative;  left: 40%;  }
.fancybox-inner .promo .info, .fancybox-inner .promo .promo-count {  display: none;  }
.fancybox-inner .promo-img, .fancybox-inner .promo-txt {  border-radius: 0;  width: 100%;  }

.fancybox-inner strong {  font-size: 15px;  color: #efbd63;  }
.fancybox-inner table {  width: 100%;  }
.fancybox-inner table.tbl-list {  margin: 15px 0px;  }

.tbl-list .title {  font-weight: bold;  font-size: large;  }
.tbView .td-bg-color {  background: var(--secondary-color);  }
.tbView .td-bg-color th {  border: 1px solid #998880;  padding: 5px;  }
.tbView .td-bg-color td {  padding: 5px;  }


.tbl-list a {  color: #995f04;  }

.fancybox-inner #tbllisting tr td {  padding: 5px;  border: 1px solid #998880;  }
.fancybox-inner .promo-list {  margin: 15px 0 0 0;  }
.fancybox-inner .promo-list ul {  padding: 15px;  line-height: 2.5rem;  list-style: number;  }
.fancybox-inner .promo-list a {  color: #9f6702;  }



/*=================================== DOWNLOAD APP===================================*/
.downloadapp {  display: flex;  align-items: flex-end;  }

.left-text {  position: relative;  width: 100%;  text-align: center;  }
.left-text h2 {  margin: 0 0 10px 0;  font-weight: bolder;  }
.left-text h3 {  margin: 0 0 10px 0;  }

.left-image img {  width: 100%;  }

.download-qr {  margin: 30px 0 30px 0;  }
.download-nav {  display: flex;  flex-direction: row;  flex-wrap: nowrap;  list-style: none;  padding: 0;  width: 100%;  }

.icon-hover-box {  width: 100%;  }
.icon-hover-box button {  width: 100%;  padding: 10px 0;  border-radius: 10px;  }

.right-step {  list-style: none;  }

.download-icon {  background: var(--secondary-color);  color: var(--tertiary-text-color);  border: 0;  }
.download-icon.active {  background: var(--primary-color);  color: var(--tertiary-text-color);  border: 0;  }
.download-divider {  background-color: transparent;  width: 10px;  height: auto;  }
.download-nav-link {  background: var(--secondary-color);  padding: 30px 0;  border-radius: 10px 10px 0 0;  }

.games-download {  position: relative;  transform: translateY(0%);  width: 100%;  text-align: left;  display: none;  }
.games-download.active {  display: flex;  }
.games-download img {  width: 50%;  margin: auto;  }

.right-text {  background: var(--secondary-color);  padding: 30px;  border-radius: 0 0 10px 10px;  color: var(--tertiary-text-color);  border-top: 1px solid var(--primary-color);  }
.right-text h4 {  margin-top: 0;  }

#theme-contain-downloadapp a {  color: #ffa300;  }
#theme-contain-downloadapp a:hover {  color: #ff4343;  }

.download-bottom-title {  text-align: center;  margin-top: 60px;  }
.download-bottom-title p {  font-size: medium;  }

.download-bottom-term {  padding: 20px;  background: linear-gradient(45deg, var(--secondary-color), #4a4e57);  border-radius: 10px;  width: 60%;  margin: 0 auto 30px auto;  color: var(--tertiary-text-color);  }
.download-bottom-term h4 {  text-align: center;  }
.download-bottom-term li {  margin: 3px 0;  }
.download-bottom-term table {  background-color: var(--primary-color);  width: 100%;  color: var(--black-color);  }
.download-bottom-term td, .download-bottom-term table th {  border: 1px solid var(--tertiary-color);  padding: 5px 0px 5px 5px;  }



/*=================================== PRODUCT ===================================*/
.intro {  margin: 25px 0;  text-align: justify;  display: flex;  justify-content: space-between;  flex-direction: row;  flex-wrap: wrap;  }
.intro button#customform_submit {  width: 48.5%;  padding: 10px;  background: linear-gradient(0deg, #6b564c, #d6a779);  color: var(--white-color);  border: 0;  border-radius: 20px;  font-size: 16px;  }
.intro .modal-dialog {  width: 60%;  margin: 1% auto;  }
.intro .modal-content {  background: var(--white-color);  }
.modal-header {  border-bottom: unset;  }

p.r {  margin: 15px 0 10px;  }
p.r span {  color: red;  font-weight: 600;  }
p.t {  font-size: 20px;  color: var(--tertiary-color);  font-weight: 600;  text-transform: uppercase;  }

.intro .modal-header .close {  }
.intro .modal-body {  padding: 30px;  }
.intro h4 {  color: #131417;  }
.intro p {  color: #4e4e4e;  }
.intro .b {  color: var(--black-color);  margin-bottom: 10px;  }
.intro .b span {  color: #d7bb4b;  font-weight: 600;  font-size: 15px;  }

.intro ol.o {  list-style-type: upper-alpha;  margin-top: 10px;  }
.intro ol.o li {  margin: 0 0 30px;  color: #131417;  }
.intro ol.o li img {  width: 100%;  border-radius: 10px;  box-shadow: 0 2px 2px 0 rgb(65 70 92 / 30%);  }

.back-btn {
    padding: 11px 17px;  text-align: center;  background: linear-gradient(to bottom, #0a69d7 0%, #004ea9 100%);  background-size: 100%;  width: 126px;  height: 38px;  border: 0px;  color: var(--tertiary-text-color);  border-radius: 10px;  box-shadow: 0px 2px 4px 1px #5379b3;  }


/*=================================== PRODUCT SEARCH BAR===================================*/
div#search-bar {  padding: 15px;  border-radius: 5px;  background: white;  filter: drop-shadow(0px 2px 3px #8c6f5e80);  max-width: 1140px;  margin: 30px auto 0;  }

legend {  display: block;  width: 100%;  padding: 0;  margin-bottom: 24px;  font-size: 24px;  line-height: inherit;  color: var(--tertiary-color);  border: 0;  border-bottom: 1px solid #e5e5e5;  }

#keyword {  display: none;  width: 40%;  }
#keyword input.alphanumeric {  color: black;  border-radius: 4px;  padding: 0 3px;  width: 79%;  height: 38px;  font-size: 15px;  border: 1px solid #1e3365;  display: inline-block;  }

div#price-range {  display: inline-block;  width: 50%;  }
div#price-range input#stock {  margin-left: 12px;  }
div#price-range input#price-min {  border-radius: 5px;  display: inline-block;  width: 23%;  padding: 0px 4px;  height: 30px;  border: 1px solid var(--primary-color);  }
div#price-range input#price-max {  border-radius: 5px;  display: inline-block;  width: 23%;  padding: 0 4px;  height: 30px;  border: 1px solid var(--primary-color);  }

#search-form input#submit-btn {  background: linear-gradient(to bottom, #ccb1a2, #8c6f5e);  color: var(--white-color);  padding: 5px 0;  border: 0px #075fc6 solid;  border-radius: 5px;  font-size: 14px;  font-weight: 600;  width: 10%;  position: absolute;  top: 51.5%;  right: 0; margin: 0 15px 0 0;  }

a#clear-btn {  display: none;  color: red;  border-radius: 5px;  padding: 5px 10px;  border: unset;  font-size: 12px;  background: #4c4c4c45;  }

div#sort {  float: right;  position: absolute;  top: 51.5%;  right: 30%;  }
div#sort label {  margin-bottom: 0;  }
select#sortlist {  border-radius: 5px;  height: 30px;  border: 1px solid var(--primary-color);  }


/*=================================== PRODUCT IMAGE===================================*/
#cms5-prod-list {  max-width: 1170px;  margin: 0 auto;  text-align: center;  gap: 1%;  display: flex;  flex-wrap: wrap;  padding: 0 15px;  }

#cms5-prod-list ul {  background: var(--white-color);  border-radius: 5px;  padding: 15px 10px;  display: inline-block;  transition: 0.3s;  height: 320px;  border: 1px solid #ccb1a250;  width: calc(20% - 0.8%);  vertical-align: top;  position: relative;  margin-bottom: 15px;  }
#cms5-prod-list ul:hover {  box-shadow: 2px 4px 10px #d4d4d4;  }

#cms5-prod-list .caption, #cms5-prod-list #desc, #cms5-prod-list #details, #cms5-prod-list #enquiry, #cms5-prod-list #code {  display: none;  }

#cms5-prod-list ul li {  list-style: none;  }
#cms5-prod-list ul #photo img {  max-width: 150px;  height: -webkit-fill-available;  }
#cms5-prod-list ul #title a, #cms5-prod-list ul #title a:visited {  color: #444;  font-size: 14px;  }
#cms5-prod-list ul #title a:hover {  color: #335587;  }
#cms5-prod-list ul #price {  color: var(--fourth-color);  font-weight: 600;  font-size: 15px;  }
#cms5-prod-list #addcart a {  margin: auto;  }

#cms5-prod-list ul #addcart a {  background: linear-gradient(to bottom, #d6a779, #8c6f5e);  position: absolute;  left: 0;  right: 0;  bottom: 15px;  padding: 10px 0;  text-align: center;  width: 60%;  height: 40px;  color: var(--white-color);  border: 0px;  border-radius: 5px;  box-shadow: 0px 2px 4px 1px  #8c6f5e80;  }

#cms5-prod-list ul #addcart a:hover {  background: var(--tertiary-color);  box-shadow: 0px 0px 0px 0px #8c6f5e80;  border: none;  text-decoration: none;  }

#cms5-faq-list ol {  list-style: none;  }
#cms5-faq-list ol#faq {  display: inline-flex;  width: 100%;  flex-direction: column;  padding: 0;  }
#cms5-faq-list ol#faq li#faq {  border-bottom: 0px dashed #444;  }
#cms5-faq-list ol#faq li#faq img {  width: 100%;  }
#cms5-faq-list ol#faq li#faq .promotion-btn {  display: flex;  }


/*=================================== PROUCT DETAIL PAGE ===================================*/
#cms5-prodcatlist {  display: block;  max-width: 1170px;  margin: 0 auto;  padding: 0 15px;  }

div#cms5-prodcatlist ul {  list-style: none;  padding: 0;  text-align: center;  display: flex;  justify-content: space-between;  }
div#cms5-prodcatlist ul li {  display: inline-block;  background: var(--primary-color);  padding: 10px 25px;  border-radius: 5px;  cursor: pointer;  }
div#cms5-prodcatlist ul li a {  text-transform: capitalize;  color: var(--tertiary-text-color);  }

div#back-btn {  position: relative;  top: 30px;  left: 0;  }
div#back-btn a {  border: none;  padding: 8px 15px;  background: var(--tertiary-color);  margin-top: 33px;  color: var(--white-color);  border-radius: 5px;  }
div#back-btn a:hover {  background: var(--fourth-color);  color: var(--black-color);  }

#cms5-prod-view {  padding: 20px;  }
#cms5-prod-view>table>tbody>tr {  direction: rtl;  }
#cms5-prod-view>table>tbody>tr>td {  width: 45%;  direction: ltr;  display: inline-block;  }

#cms5-prod-view table#particular {  margin: 50px auto;  }
#cms5-prod-view table#particular tr#title {  font-size: 30px;  font-weight: 600;  color: var(--tertiary-color);  }
#cms5-prod-view table#particular tr#code {  font-size: 16px;  color: var(--fourth-color);  }
#cms5-prod-view table#particular tr#price {  font-size: 20px;  color: var(--tertiary-color);  }

#cms5-prod-view table#particular tr td#addcart a {
  padding: 10px;  text-align: center;  background: linear-gradient(to bottom, #d6a779, #8c6f5e);  width: 126px;  height: 45px;  color: var(--white-color);  border-radius: 5px;  box-shadow: 0px 2px 4px 1px #8c6f5e80;  }

#cms5-prod-view table#particular tr td#addcart a:hover {
    background: var(--tertiary-color);  box-shadow: 0px 0px 0px 0px #5379b3;  border: none;  }

#cms5-prod-view #particular #caption {  display: none;  }
#cms5-prod-view #particular #sharelink {  padding: 0;  }
#cms5-prod-view #desc {  border-top: 0px solid #d4d4d4;  padding-top: 10px;  }
#cms5-prod-view #desc td#content {  padding-top: 20px;  }

div#cms5-pagenum ul {  padding: 0;  margin: 0;  text-align: center;  }
div#cms5-pagenum ul li {  display: inline-block;  width: 3%;  vertical-align: top;  color: var(--tertiary-color);  margin: 30px 5px;  font-weight: bold;  }
div#cms5-pagenum a, a:hover, a:active, a:focus {  color: var(--secondary-color);  text-decoration: none;  }

.gcontent {  color: var(--tertiary-color) !important;  width: 250px;  margin: 0 auto !important;  }
#galleria {  height: 260px;  }
.galleria-container {  width: 250px;  height: 260px;  position: relative;  overflow: hidden;  background: transparent;  }
.galleria-stage {  position: absolute;  top: 0;  bottom: 0;  right: 0;  left: 0;  overflow: hidden;  }
.galleria-lightbox-title {  display: none;  }



/*=================================== PRODUCT ADD CART ===================================*/
#prod-cart {  max-width: 1170px;  width: 100%;  margin: 0px auto;  padding: 0 15px;  }

#prod-cart .tbllist {  padding: 0px;  }
#prod-cart .tbllist form table {  border: 1px solid var(--secondary-color);  font-size: 12px;  }
#prod-cart .tbllist form table tr {   }
#prod-cart .tbllist form table tr:first-child {  background: var(--tertiary-color);  }
#prod-cart .tbllist form table tr th {  padding: 5px;  color: var(--white-color);  border: 1px solid var(--secondary-color);  }
#prod-cart .tbllist form table tr td {  border: 1px solid var(--secondary-color);  text-align: left;  padding: 10px;  background: var(--white-color);  color: var(--black-color);  }
#prod-cart .tbllist form table tr td img {  width: auto;  }
#prod-cart .tbllist form table tr td a {  color: var(--black-color);  }

#prod-cart .tbllist form table input[value="EMPTY"] {  background: var(--fourth-color);  color: var(--black-color);  border: none;  border-radius: 5px;  font-size: 12px;  padding: 5px 10px;  }
#prod-cart .tbllist form table tr td #icon-delete {  list-style: none;  }
#prod-cart .tbllist form table tr td #icon-delete a {  color: #f00;  }

#prod-cart .tbllist table tfoot td {  color: var(--primary-color);  }
#prod-cart .tbllist form table input[value="UPDATE ☑"] {  padding: 5px 10px;  background: var(--fourth-color);  color: var(--black-color);  border: none;  border-radius: 5px;  }

#prod-cart div#continue-shopping {  padding: 5px;  background: linear-gradient(to left, #8c6f5e, #d6a779);  border-radius: 5px;  border: none;  color: var(--white-color);  box-shadow: inset 0 0 5px var(--tertiary-color);  width: 15%;  text-align: center;  margin-top: 15px;  }
#prod-cart div#continue-shopping:hover {  background: var(--tertiary-color); }
#prod-cart div#continue-shopping a {  color: white;  }

#prod-cart .alert-warning {  background-color: transparent !important;  margin-top: 15px;  color: red;  }


#prod-cart input#form_recipientName, input#form_Addr1, input#form_Addr3 {  border: 1px solid #f1f1f1;  border-radius: 7px;  padding: 8px 6px;  width: 92%;  }
#prod-cart input#form_State {  border: 1px solid #f1f1f1;  border-radius: 7px;  padding: 8px 6px;  width: 37%;  }
#prod-cart input#form_PostCode {  border: 1px solid #f1f1f1;  border-radius: 7px;  padding: 8px 6px;  width: 20%;  }
#prod-cart select#form_Country {  border: 1px solid #f1f1f1;  border-radius: 7px;  padding: 8px 6px;  width: 19%;  }
#prod-cart input#form_contact {  border: 1px solid #f1f1f1;  border-radius: 7px;  padding: 8px 6px;  width: 26%;  }



/*=================================== PRODUCT ADD CART LOGIN ===================================*/
#theme-contain-prod #remoteloginform, #theme-contain-prod #customform {  width: 30%;  margin: 30px auto;  text-align: center;  background: var(--white-color);  border-radius: 17px;  padding: 30px;  border: 1px solid var(--tertiary-color);  }

#theme-contain-prod #customform .caption {  display: none !important;  }

#theme-contain-prod #remoteloginform input, #theme-contain-prod #customform input {  width: 100%;  border: 0;  border-bottom: 2px solid var(--primary-color);  border-radius: 0;  background: transparent;  color: var(--black-color);  max-width: unset;  }

#prod-cart #remoteloginform dl, #prod-cart #customform dl {  display: block;  }

#prod-cart>p>a {  color: var(--black-color)8ff;  }

#theme-contain-prod #customform dl:nth-of-type(3) {  display: flex;  align-items: flex-end;  }
#theme-contain-prod #customform dl:nth-of-type(3) dd {  display: flex;  vertical-align: bottom;  width: 50%;  }
#theme-contain-prod #customform dl:nth-of-type(3) dd img {  width: 90%;  }

#theme-contain-prod input#customform_submit {  position: unset;  }

#theme-contain-prod #remoteloginform input#remoteloginformsubmit, #theme-contain-prod #customform input#customform_submit {  
color: var(--white-color);  background: linear-gradient(to top, #8c6f5e, #d6a779);  border-radius: 5px;  border: 0;  padding: 5px;  width: 50%;  }

#theme-contain-prod #remoteloginform input#remoteloginformsubmit, #theme-contain-prod #customform input#customform_submit:hover {
 color: var(--black-color);  background: var(--secondary-color);  border-radius: 5px;  border: 0; }



/*============================== OTHER OF PRODUCT ==============================*/
#theme-nav {  display: none;  text-align: center;  background: white;  margin-top: 15px;  }
#theme-nav ul {  margin: 0;  padding: 0;  }
#theme-nav ul li {  display: inline-flex;  flex-direction: column;  margin: 0px 6px;  }
#theme-nav ul li a {  color: var(--tertiary-text-color);  background: #0a69d7;  padding: 10px 50px;  border-radius: 4px;  cursor: pointer;  }
#theme-nav ul li:first-child a {  position: relative;  color: #0a69d7;  }
#theme-nav ul li:first-child a:after {  content: "All Product";  color: var(--tertiary-text-color);  font-size: 12px;  position: absolute;  left: 0;  right: 0;  }

fieldset {  }
caption {  text-align: center;  font-size: 20px;  color: var(--tertiary-text-color);  font-weight: 600;  background: #867560;  }

span#name {  color: red;  }
span.effect-photogrp {  position: relative;  }

img#piclayer {  position: absolute;  top: -70px;  left: 0px;  }
.ctrllist.iconx32 ul {  margin: 0;  }

input#submit-btn {  border-radius: 5px;  padding: 6px;  color: #03927c;  font-weight: 600;  width: 10%;  }

#offer-strike {  font-size: 12px;  font-style: italic;  font-weight: normal;  text-decoration: line-through;  color: #838383;  }
#enquiry, #sharelink {  display: none;  }

#submember-login table {  width: fit-content;  background: #efefef;  }
#submember-login table tr:last-child td:last-child>p:nth-child(1)>a {  background: #d4d4d4;  padding: 5px 20px;  display: block;  text-align: center;  }
#submember-login table tr:last-child td:last-child>p:nth-child(3)>a {  text-decoration: underline;  color: var(--black-color)8ff;  }
#submember-login table tr td {  padding: 10px 20px;  }
#submember-login input[type="submit"] {  background: #ffc903;  padding: 5px 20px;  display: block;  width: 100%;  text-align: center;  }
#search-form input#submit-btn:hover {  color: #ffeb92;  border-color: #ff000000;  }

#content p {  margin: 3px 0;  line-height: 30px;  display: list-item;  }
#qty input[type="text"] {  text-align: center;  }

#btn-submit button {  background: -webkit-linear-gradient(right, #805836 0%, #d1a36d 100%);  padding: 13px;  width: 14%;  color: white;  margin-top: 13px;  font-size: 16px;  border: 5px #e1d0a8 solid;  border-radius: 10px;  box-shadow: inset 0 0 5px var(--black-color);  }
#btn-submit button:hover {  background: #9a9a9a;  color: var(--white-color);  }

table#apimeminfo {  background: #dcb686;  padding: 12px 1px;  border-radius: 7px;  border-spacing: 2em;  margin: 1rem auto;  }
table#apimeminfo b {  padding: 2px 5px;  border-radius: 6px;  color: #4c4c4c;  letter-spacing: 1px;  font-size: 13px;  }
table#apimeminfo a {  background: -webkit-linear-gradient(right, #480505 0%, #d60013 100%);  color: white;  padding: 7px 25px;  border-radius: 11px;  border: 3px #e1d0a8 solid;  }
table#apimeminfo a:hover {  background: #736d6d;  }
table#apimeminfo tr td {  padding: 1rem 1.2rem;  border-radius: 6px;  border: 6px solid white;  }

a#clear-btn:hover {  color: #d88383;  background: -webkit-linear-gradient(right, #4c4c4c 0%, #4c4c4c 100%);  }




/*=======================================================================================================*/
/*-----------------------------------------------------------------------------   MOBILE VIEW -----------------------------------------------------------------------------*/
/*=======================================================================================================*/
@media all and (max-width: 932px),
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px),
only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px),
only screen and (min-resolution: 192dpi) and (max-width: 1024px),
only screen and (min-resolution: 2dppx) and (max-width: 1024px) {

/*------------------ header ------------------*/
#theme-header-logo img {  height: 30px;  margin: 15px 0 15px 5px;  }
div#cmsmenu {  margin-left: 0;  }
ul.cmsmenu {  display: none;  }
.language.dropdown {  display: none;  }
#mySidenav, .mobilemenu {  display: block;  }

/*------------------ mobile sidemenu ------------------*/
.sidenav {  height: 100%;  width: 0;  position: fixed;  z-index: 1;  top: 0;  right: 0;  overflow-x: hidden;  transition: 0.5s;  padding-top: 0;  background: #00000090;  }
.sideclose {  width: 20%;  height: 100%;  position: relative;  float: left;  }
.sidenav .closebtn {  position: relative;  top: 0;  left: 0;  font-size: 50px;  color: var(--white-color);  filter: drop-shadow(0px 0px 3px #000);  height: 100%;  display: block;  text-align: center;  }
.sidemenu {  width: 80%;  height: fit-content;  position: relative;  float: left;  background: var(--primary-color);  padding: 15px;  }
.mobile-logo {  width: 80%;  display: flex;  margin: 0 auto;  }

.submenu1 {      display: flex;  flex-wrap: wrap;  gap: 15px;  margin: 20px 0;  }
.submenu1 div {  padding: 10px;  width: calc(33.33% - 10px);  font-size: 11px;  border: 1px solid var(--secondary-color);  border-radius: 5px;  }
.submenu1 div a {  display: flex;  flex-wrap: wrap;  flex-direction: column;  align-items: center;  color: var(--white-color); }
.submenu1 div img {  width: 35px;  margin-bottom: 10px;  }

.divider {  border-bottom: 1px solid var(--tertiary-color);  }

.submenu2 div {  padding: 10px 0;  }
.submenu2 div a {  color: var(--white-color); }

.mobile-language {  margin: 0;  text-align: center;  display: flex;  flex-direction: column;  flex-wrap: wrap;  }
.mobile-language .country-info {  margin: 15px 0 0;  display: flex;  flex-direction: row;  line-height: 1;  }
.mobile-language .country-name {  width: 35%;  text-align: left;  }
.mobile-language .country-languages {  font-size: 14px;  font-size: 14px;  }
.mobile-language .country-languages a {  margin: 0 5px;  }
.mobile-language img {  width: auto;  height: 20px;  }

.mobilemenu {  font-size: 24px;  cursor: pointer;  margin-left: 15px;  }

/*------------------ product search bar ------------------*/
div#search-bar {  display: flex;  flex-wrap: wrap;  }
fieldset {  width: 100%;  }
#search-form {  display: flex;  flex-direction: column;  }
div#price-range {  width: 100%;  margin-bottom: 0px;  }
div#sort {  top: 0%;  left: 0%;  position: relative;  }

/*------------------ login modal------------------*/
.modal-dialog {  width: 60%;  }

}


/*=====================================================================================================*/
/*-------------------------------------------------------------------  MOBILE VIEW PORTRAIR -------------------------------------------------------------------*/
/*=====================================================================================================*/
@media only screen and (min-device-width: 250px) and (max-device-width: 660px) and (orientation: portrait) {

.header-link {  right: 15px;  }
.glyphicon-chevron-down:before {  font-size: 12px;  }
.btn-box .btn-login a, .btn-box .btn-sign-up a {  font-size: 12px;  }

.modal-dialog {  width: 90%;  }
.regisleft {  width: 100%;   }
.regis-dtl {  display: none;  }

.home-button {  gap: 15px;  margin-top: 5px;  }
.home-button li button {  padding: 5px 15px;  }
.homemostpopular.container, .homeabout, .homefaqs, .homeseo {  margin: 60px auto 0;  }

.populargamelist ul {  gap: 15px;  }
.populargamelist ul li {  width: 47%;  }

.homeabout-left, .homeabout-right {  width: 100%;  }
.homeabout-right {  margin: 0;  }

.home-faqs {  width: 100%;  }
.home-seo {  width: 100%;  }
.homelink p {  font-size: 14px;  }

.footerbg-top {  flex-direction: column;  }
.footerbg-top> div {  width: 100%;  padding: 15px 0;  }

.provider-list li {  max-width: calc(50% - 1em);  }
.provider-list li.tag-special {  max-width: calc(100% - 1em);  }

.vip-banner-title {  display: none;  }
#vip-table {  font-size: 8px;  }
#vip-table img {  width: 35px;  height: auto;  }
#vip-table img.star {  height: 10px;  }
.vip-tbcntnt {  flex-direction: column;  }
.vip1, .vip2 {  max-width: 100% !important;  height: fit-content;  }
.vip1 {  margin-bottom: 30px;  }

div#cms5-prodcatlist ul {  flex-wrap: wrap;  gap: 20px;  }
div#cms5-prodcatlist ul li {  font-size: 12px;  }
#search-bar {  margin: 30px 15px 0;  }
#search-form input#submit-btn {  width: 100%;  bottom: 0px;  position: relative;  margin: 0 0 30px;  }
div#price-range {  width: 100%;  }
#cms5-prod-list ul {  width: calc(50% - 0.8%);  }

#cms5-prod-view > table > tbody > tr > td {  width: 100%;  }
#cms5-prod-view .galleria-container {  width: 100% !important;  }
.galleria-stage {  top: 20px;  }
#prod-cart .tbllist form {  overflow-x: scroll;  }
#prod-cart div#continue-shopping {  width: 50%  }
#theme-contain-prod #remoteloginform, #theme-contain-prod #customform {  width: 100%;  }

.donatetab table {  font-size: x-small !important;  border: 0px solid #0073ba;  }
.donatetab table tr, .donatetab table td {  padding: 5px !important;  }

.contact-line {  flex-wrap: wrap;  flex-direction: column;  }

.tabhigh button {  padding: 5px !important;  }

.btn2 {  width: 32%;  padding: 10px;  }

}


/*=====================================================================================================*/
/*---------------------------------------------------------------- MOBILE VIEW LANDSCAPE ----------------------------------------------------------------*/
/*=====================================================================================================*/
@media only screen and (min-device-width: 375px) and (max-device-width: 932px) and (orientation: landscape) {

.populargamelist ul {  justify-content: flex-start;  }
.populargamelist ul li {  width: 31%;  }

.provider-list li .p-box .p-name {  font-size: 10px;  }

div#cms5-prodcatlist ul {  flex-wrap: wrap;  gap: 15px;  }
div#cms5-prodcatlist ul li {  width: calc(33.33% - 15px) !important;  }
#cms5-prod-list ul #addcart a {  width: 80%;  }
#cms5-prod-view table {   margin-top: 40px;  }
#prod-cart div#continue-shopping {  width: 25%;  }



}



/*=====================================================================================================*/
/*---------------------------------------------------------------------   IPAD PORTRAIT ---------------------------------------------------------------------*/
/*=====================================================================================================*/
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {

.submenu1 div {  padding: 20px;  }
.submenu1 div img {  margin-bottom: 15px;  }
.divider {  margin: 10px 0;  }

.populargamelist ul {  justify-content: flex-start;  }
.populargamelist ul li {  width: 31%;  }
 
.vip1, .vip2 {  height: fit-content;  }

div#cms5-prodcatlist ul {  flex-wrap: wrap;  gap: 15px;  }
div#cms5-prodcatlist ul li {  width: calc(33.33% - 15px) !important;  }


}



/*=====================================================================================================*/
/*---------------------------------------------------------------------    IPAD LANDSCAPE --------------------------------------------------------------------*/
/*=====================================================================================================*/
@media only screen and (min-device-width: 1024px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {

div#cms5-prodcatlist ul {  flex-wrap: wrap;  justify-content: center;  gap: 15px;  }
div#cms5-prodcatlist ul li {  width: calc(25% - 15px) !important;  }



}


/*=====================================================================================================*/
/*------------------------------------------------------------------------- BIG SCREEN -------------------------------------------------------------------------*/
/*=====================================================================================================*/
@media screen and (max-width: 2305px) and (min-width: 1920px) {
div#cmsmenu {  margin-left: -14%;  }


}