body,html {
	margin: 0!important;
	padding: 0!important;
	width: 100%!important;
	font-family: montserrat;
} 

body {
	/*line-height: 1.1;*/
	color: #fff;
	font-family: montserrat;
	background-color: #0e131c;
}

body.modal-open {
    overflow: hidden;
}

h1,h2,h3,h4,h5,h6 {
	color: #fff;
	font-weight: 600;
	font-family: montserrat;
}

@media (max-width: 768px) {
	h4 {
		font-size: 1rem;
	}
}

.dot-pending {
  height: 10px;
  width: 10px;
  background-color: #ff8000;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
}

.dot-complete {
  height: 10px;
  width: 10px;
  background-color: #00ff00;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
}

.dot-cancel {
  height: 10px;
  width: 10px;
  background-color: #ff0000;
  border-radius: 50%;
  display: inline-block;
  margin-right: 5px;
}

#chat-widget-container {
	z-index: 1040!important;
}

 /* Header
-----------------------------------------------------------------*/

.full-header .primary-menu .menu-container {
	padding-right: 0.5rem;
	margin-right: 0.5rem;
	border-right: 1px solid #EEE;
}
	
#header-wrap {
	position: fixed;
	background-color: #0f131c;
	width: 100%;
	z-index: 298;
	height: 60px;
}

#logo {
	margin: auto;
    padding-left: 0!important;
    transform: translate(15px, 0px);
}

#logo img {
	display: block;
    height: 30px;
    width: auto;
    margin: 0 auto;
    float: left;
}

.logo-img {
	width: 80px!important;
    height: 32px!important;
    margin-top: 5px;
}

.language {
    float: right;
    padding: 20px 15px 0 0;
    cursor: pointer;
}

.language span{
	color: #0164ca;
}

#header-signup {
	background: rgb(214,114,16);
	background: linear-gradient(90deg, rgba(214,114,16,1) 0%, rgba(242,183,43,1) 100%);
	padding: 0;
	max-width: 150px;
	height: 100%
}

#header-signup button{
	background: rgb(214,114,16);
	background: linear-gradient(90deg, rgba(214,114,16,1) 0%, rgba(242,183,43,1) 100%);
	width: 100%;
    height: 100%;
    border-width: 0;
    color: #fff;
}

#header-signin {
	background-color: #1e2b3e;
	padding: 0;
	max-width: 150px;
	height: 100%
}

#header-signin button{
	background-color: #1e2b3e;
	width: 100%;
    height: 100%;
    border-width: 0;
    color: #fff;
}

 /* Footer
-----------------------------------------------------------------*/

#footer-powerby {
	background-color: #1e2b3e;
	position: fixed;
	z-index: 297;
	bottom: 0;
	width: 100%;
	height:20px;
	text-align: center;
    color: #0164ca;
    font-size: 0.8rem;
}

footer {
    bottom: 0;
    width: 100%;
    position: absolute;
}


 /* Content
-----------------------------------------------------------------*/

.post-container {
    overflow: auto;
    border-radius: 20px;
    margin: 10px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .2), 0 1px 2px 0 rgba(0, 0, 0, .12);
}

.post-title {
    font-weight: bold;
    font-size: 150%;
}

.post-content {
	margin: 0;
	color: #999;
	width: 100%;
	text-align: center
}

.post-content p {
	margin: 0.5em;
}

#content {
    position: relative;
    /* background-color: #0f131c; */
    padding-top: 60px;
    min-height: 100vh;
}

#content p {
    line-height: 1.0;
    font-family: montserrat;
    /*font-weight: lighter;*/
}

.step-box-container {
	margin:15px auto;
}

.step-box {
	width:30%;
	height:100%;
	border:2px solid #fff;
	border-radius: 10px;
	padding:10px;
	margin:auto;
	text-align: center;
}

.image-box-container {
	margin:auto;
	margin-top:5px;
}

.image-box {
	width: calc(100%/6);
	padding:8px;
	cursor: pointer;
	border-radius: 10px;
}

@media (max-width: 1200px) {
	.image-box {
		width: calc(100%/3);
		padding:8px;
		cursor: pointer;
		border-radius: 10px;
	}
}

@media (max-width: 760px) {
	.image-box {
		width: calc(100%/2);
		padding:8px;
		cursor: pointer;
		border-radius: 10px;
	}
}

.image-box img{
	width:100%;
	height:auto;
}

.image-box-info{
	padding:3px;
	background-color: #071824;
}

.image-box-info p{
	margin:3px;
	color: #999;
}

#live-chat {
	height: 50px;
    background: #141a28;
    margin:auto;
    margin-top:10px;
    padding:10px;
}

#live-chat img{
	width:auto;
	height:100%;
}

.live-chat-box{
	width: max-content;
	height:100%;
	margin:auto;
}

#powered-by {
    margin:1px auto;
    margin-top:15px;
    text-align: center;
    color: #0164ca;
    font-size: 1.0rem;
}

#powered-by .image-box{
	width:60px;
	padding:5px;
}

.scrolling-message-container{
	height: 30px;
	background: #141a28;
	margin:auto;
}

.game-title {
	background: #00000024;
    text-align: left;
    border-left: 3px solid #0164ca;
    padding: 8px;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.game-title>img {
	height: 45px;
}

#referrer-panel{
	width:100%;
	padding-left:5px;
	padding-right:5px;
}

#referrer-panel img{
	width:100%;
	border-radius:20px;
	border:2px solid #fff;
}

 /* navigator
-----------------------------------------------------------------*/
#game-category {
	background: #1e2b3e;
	z-index: -1;
}

#game-category li{
	justify-content: center;
	width: 20%;
}

#game-category p{
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.nav-tabs {
    border-bottom: 1px solid #0164ca;
}

.navi-bar-container .naviContent li {
    width: 100%;
    padding: .3rem;
}

.naviItem {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
    display: inline-block;
    width: 100%;
}

.nav>li>a:hover, .nav>li>a:active, .nav>li>a:focus, .naviItem.active {
	background-size: cover;
    height: 65px;
    padding: 5px 10px;
    border-bottom: 5px solid #0164ca;
    background-color: #0f131c;
    display: inline-block;
    width: 100%;
}

 .naviItem>img{
	display: block;
	margin-left: auto;
	margin-right: auto;
	width: auto;
	height: 25px;
	color: #fff;
}

 /* Swiper Slider
-----------------------------------------------------------------*/

.swiper-container {
	width: 100%;
	height: auto;
}

.swiper-slide {
	text-align: center;
	font-size: 18px;
	background: #fff;
	
	/* Center slide text vertically */
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}

.swiper-slide img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

 /* Category
-----------------------------------------------------------------*/

.category-tabs{
	width: 23%!important;
    display: inline-block;
}

.oc-item img {
    width: 30px!important;
    margin: auto;
    margin-top: 5px;
}

.slots-tab {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
}

.slots-tab p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.slots-tab-active p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.slots-tab-active {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
    border-bottom: 3px solid #0164ca;
    background-color: #0f131c;
}

.casino-tab {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
}

.casino-tab p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.casino-tab-active p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.casino-tab-active {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
    border-bottom: 3px solid #0164ca;
    background-color: #0f131c;
}

.arcade-tab {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
}

.arcade-tab p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.arcade-tab-active p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.arcade-tab-active {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
    border-bottom: 3px solid #0164ca;
    background-color: #0f131c;
}

.fishing-tab {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
}

.fishing-tab p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.fishing-tab-active p {
    margin-bottom: 0;
    color: #fff;
    margin-top: 5px;
    text-align: center;
}

.fishing-tab-active {
    background-size: cover;
    height: 65px;
    padding: 5px 10px;
    border-bottom: 3px solid #0164ca;
    background-color: #0f131c;
}

 /* Modal
-----------------------------------------------------------------*/

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: hidden;
}

.modal-ads {
    overflow-y: auto !important;
}

.modal-content {
  background: linear-gradient(0deg, rgb(32 57 87) 0%, rgba(29,39,56,1) 100%);
  border: 1px solid rgba(0,0,0,.2);
  border-radius: 10px;
  padding: 15px 10px;
  width: 100%; /* Could be more or less, depending on screen size */
}

.modal-header {
    border-bottom: solid 1px #444;
    padding: 0.5rem 0.5rem 0.75rem !important;
}

.modal-title {
    margin-bottom: 0;
    line-height: 1.5;
}

.modal-body a {
    color: #fff;
    font-size: 0.85rem;
    text-decoration: none;
}

.modal h4 {
    color: #fff;
    font-size: 1.1rem;
    font-weight: 400;
    text-transform: uppercase;
}

.close {
    color: #fff;
    opacity: 1;
    font-size: 2rem;
    font-weight: 100;
    padding-top: 11px!important;
}

.modal-header .close {
    margin: -1rem -1rem -1rem auto;
}

.modal-body li{
	margin: 0 0 15px 0;
}

.modal-body img{
	margin: auto;
	margin-bottom:25px;
	width:80%;
	height:auto;
	display: block;
}

.modal-footer {
    justify-content: center;
    border-top: 1px solid #444;
}
    
.btn-modal {
    background: rgb(0,102,202);
    background: linear-gradient(90deg, rgba(0,102,202,1) 0%, rgba(33,135,235,1) 100%);
    color: #fff;
    text-align: center;
    width: 100%;
    border-radius: 5px;
    border: none;
    padding: 12px 0;
    font-size: 0.85rem;
    background-position: center;
}

.form-input-label p {
    color: #fff;
    font-size: .85rem;
    margin-bottom: 5px;
}

.input_container {
    position: relative;
}

.form-input-style {
    padding: 10px 20px 10px 15px;
    background-color: #16202f;
    border-radius: 5px;
    box-shadow: inset 0 2px 5px rgb(0 0 0 / 56%);
    color: #fff;
    font-size: .85rem;
    height: 43px;
    /*line-height: 2;*/
    border: none;
    width:100%;
}

.btn-enter-game {
    background: rgb(201,103,11);
    background: linear-gradient(90deg, rgba(201,103,11,1) 0%, rgba(238,152,21,1) 100%);
    color: #fff;
    text-align: center;
    width: 100%;
    border-radius: 5px;
    border: none;
    padding: 12px 0;
    font-size: 0.85rem;
    background-position: center;
}

.btn-input-float {
    position: absolute;
    right: 6px;
    top: 6px;
    bottom: 6px;z-index:9;
}

.btn-input-float button{
    background: rgb(0,102,202);
    background: linear-gradient(90deg, rgba(0,102,202,1) 0%, rgba(33,135,235,1) 100%);
    border-radius: 5px;
    border: none;
    color: #fff;
    padding: .25rem .5rem;
}

*:focus {
    outline: 0 !important;
}

.btn:focus {
  outline: none;
  box-shadow: none;
  color: #fff;
}

.history-list ul{
	list-style-type:none;
	padding-left: 0px;
}

 /* Alertify
-----------------------------------------------------------------*/

 /*.alertify .ajs-modal {
    margin-top: 5%;
    height: fit-content;
}*/

.alertify .ajs-header {
    background-color: #203754;
    padding: 20px 0px;
}

.alertify .ajs-dialog {
    background-color: #203754;
    top: 50%;
    transform: translate(0%, -50%);
    margin: auto;
    max-width: 450px;
}

.alertify .ajs-body .ajs-content {
    text-align: center;
}

.alertify .ajs-footer {
    background-color: #203754;
    padding: 20px 0px;
}

.alertify .ajs-footer button{
    color: #fff;
    border: none;
    border-radius: 5px;
    width: 60%;
    font-size: 0.85rem;
}

.alertify .ajs-footer .ajs-buttons.ajs-primary {
    text-align: center;
}

.alertify.ajs-closable .ajs-commands button.ajs-close {
    display: none;
}

.alertify-logs{
     z-index:999999 !important;
}

.alertify .ajs-dimmer {
    background-color: #000000;
}

 /* Chat Float Button
-----------------------------------------------------------------*/

.float{
	position:fixed;
	width:80px;
	height:80px;
	bottom:40px;
	right:20px;
	background-color:#25D366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
	box-shadow: 2px 2px 3px #999;
	cursor: pointer;
}

.whatsapp-float{
	margin-top:17px;
}

 /* Loading
-----------------------------------------------------------------*/

#loader{
	margin: 0px;
	display: block;
	padding: 0px;
	position: fixed;
	right: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-color: rgb(0, 0, 0, 0.5);
	z-index: 999999;
	justify-content: center;
  	align-items: center;
}

.loaderSpinner {
	border: 8px solid #f3f3f3;
	border-top: 8px solid #3498db;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	animation: spin 1s linear infinite;
	position: fixed;
	z-index: 9999999;
	top: 50%;
	right: 50%;
	margin-right: -30px;
	margin-top: -30px;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

 /* QR Code
-----------------------------------------------------------------*/

.qrcode-generated {
   background-color: white;
   border: 8px solid white;
   width:200px;
   height:200px;
   margin: auto;
   margin-bottom:25px;
}

.qrcode-generated img{
   width:100%;
   height:100%;
   padding:10px;
   margin:0;
}

/* Promotion
-----------------------------------------------------------------*/
.promotion-title {
	background: #1e2b3e;
    text-align: center;
    border-bottom: 1px solid #0164ca;
    padding: 8px;
}

.promotion-box-container {
	margin:auto;
	margin-top:5px;
}

.promotion-box {
	position: relative;
	width:16.6667%;
	min-width: 120px;
	max-width: 150px;
	padding:10px;
	text-align: center;
	cursor: pointer;
}

.promotion-box img {
	width:100%;
	height:auto;
}

.promotion-label {
    position: absolute;
    display: block;
    width: 70%;
    margin: auto;
    line-height: 1;
    top: 15px;
    left: 50%;
    transform: translate(-50%, 0%);
}

.promotion-label1 {
    background-color: #0000002e;
    border-radius: 5px;
    padding: 3px;
    width: 100%;
    min-height: 40px;
    margin: auto;
}

.promotion-label2 {
	font-weight: 800;
    font-size: 1.4em;
    background-color: #0000002e;
    border-radius: 5px;
    padding: 3px;
    width: 100%;
    margin: auto;
    margin-top: 3px;
    text-shadow: 3px 3px 0 #232323, -1px -1px 0 #232323, 1px -1px 0 #232323, -1px 1px 0 #232323, 1px 1px 0 #232323;
}

.bottom-ads-banner {
    position: fixed;
    z-index: 250;
    bottom: 0px;
}

.bottom-ads-banner img {
    max-width: 500px;
    width: 80%;
}

/* Scrollbar
-----------------------------------------------------------------*/
/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* Customer Support
-----------------------------------------------------------------*/
.cusSup {
    display: flex;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    margin-left: auto;
    position: fixed;
    bottom: 10px;
    right: 10px;
}

.scrollable-modal {
    max-height: 300px; /* Adjust the height as needed */
    overflow-y: auto;
}