/*** GLOBAL
*/

body, html{
	color:#eee;
	background-color:#222;
		margin:0;	padding:0
}

div#mega_container {margin-bottom: 80px;margin-top:70px;}

.wrapper{}


/*** TOPBAR
*/
.hideme{	display:none!important;}

#topbar{
	position: fixed;
	height: 70px;
	margin: 0;
	top: 0;
	padding: 0;
	width: 100vw;
	background-color: #000;
	z-index: 100;
	display:
	flex;
	align-items: center;
	flex-wrap: wrap;
}

#topbar .menubutton
{
	padding: 10px;
	/* width: 33px; */
	/* height: 50px; */
	display: block;
	color: #fff;
	text-decoration: none;
}

#topbar .menubutton::before
{
	content:'\f0c9';
	/* position:absolute; */
	font-family:'Font Awesome 5 Free';
	font-size:40px;
	font-weight:600;
}

#topbar .topbar-action
{
	padding: 0 10px 0 0px;
	font-size: 12px;
	/* float: right; */
	/* position: absolute; */
	/* right: 1vw; */
	margin-left: auto;
}

#topbar .loginbutton,
#topbar .registernow
{
	margin: 5px 3px;
  display: inline-block;
  border-radius: 4px;
  padding: 10px 10px;
  font-size: 11px;
  text-transform: uppercase;
  text-decoration: none;
  float: left;color:#000
}
#topbar .registernow{color:#fff;background-color:#d00000;
	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
	background-image: -moz-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
	background-image: -o-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
	background-image: linear-gradient(to bottom,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));}

#topbar .loginbutton .fa,
#topbar .registernow .fa{	margin-right:5px;}

#topbar .balanceinfo,
#topbar .userinfo
{
	display:block;
	font-size:0.8em;
	/* margin-top: 13px; */
	text-transform: uppercase;
	font-weight:600;
	line-height:2px;
}

#topbar .sitelogo
{
	margin-right: auto;
}

#topbar .sitelogo a
{
	/* width: 175px; */
	/* height: 50px; */
	vertical-align: initial;
	display: block;
}
#topbar .sitelogo .img-responsive.logo {
    width: 130px;
    /* height: 31px; */
}

/* SIDEMENU*/
#sidemenu
{
	width: 90vw;
	max-width:450px;
	background-color: #333;
	position: fixed;/*it was absolute*/
	border: 1px solid #555;
	top: 2vh;
	z-index: 1000;
	border-radius: 0 20px 20px 0;
	box-shadow: 0 0 30px #000;
	padding: 5px 0;
	left: -100%;
	transition: all 0.3s ease-in;
}

#sidemenu.menuopen{
  left: 0;transition: all 0.3s ease-out;
}

#sidemenu a.closemenu{

}
#sidemenu .userclosebar {
    width: 100%;
    position: relative;
    border-bottom: 2px solid var(--skin-color-1);
}
#sidemenu .userclosebar span {
    padding: 12px 0px;
    display: inline-block;
    text-transform: uppercase;
    font-weight: 600;
    margin-left: 10px;
}
#sidemenu a.closemenu::before{
	content: '\f410';
	font-family: 'Font Awesome 5 Free';
	font-size: 32px;
	position: absolute;
	right: 12px;
	color:#fff;
}

#sidemenu form{margin:0;padding-bottom: 1em;}

#sidemenu .userlist ul
{
	padding:0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
}
#sidemenu .userlist li {
    min-height: 2.2rem;
    overflow: hidden;
    flex-basis: calc(50% - 25px);
    text-overflow: ellipsis;
}
#sidemenu li
{
  display: block;
  padding: 7px;
  background: #000;
  color: #eee;
  margin: 5px;
  border-radius: 5px;
  font-size: 12px;
  text-transform:uppercase;
  /* position:relative; */
}

#sidemenu .userstatus
{
	background-color:#555;
	padding: 0;
	/* display: flex; */
	border-top: 2px solid var(--skin-color-1);
	border-bottom: 2px solid var(--skin-color-1);
}

#sidemenu .userstatus p
{
	/* display:inline-block; */
	text-transform:uppercase;
	margin: 5px 5px;
	font-size:14px;
	color: #bbb;
}

#sidemenu .userstatus .logout{
  background: #c10000;
  padding: 10px 20px;
  border-radius: 10px;
  text-transform: uppercase;
  margin: 0;
}

#sidemenu .username,#sidemenu .userbalance{text-transform:uppercase;}
#sidemenu #bonuscode {
    text-decoration: none;
    color: #fff;
}

#sidemenu .userlogin label,
#sidemenu .languagemenu p,
#sidemenu .userlogin .helpbutton
{
	font-size: 20px;
	text-transform: uppercase;
	margin:0;
	display:block;
}



#sidemenu .userlogin label,
#sidemenu .languagemenu p,
#sidemenu .username,#sidemenu .userbalance,
#topbar #credito,
#topbar .username

{
	color: #fff;
}
#sidemenu .languagemenu p{margin-bottom:10px;display: inline-block;vertical-align: middle;}
#sidemenu .loginbutton {
	color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  margin: 0 0 10px 0;
  border-radius: 10px;
  padding: 10px 20px;
  font-size: 1rem;
  display: block;
  text-align: center;
  font-weight: 600;
}

#sidemenu .userlogin .helpbutton{
	text-decoration: none;
  text-transform: uppercase;
  font-size: 15px;
  text-align: center;
}

#sidemenu .userlogin i.fa {margin-right: 10px;		}
#sidemenu .userlogin .helpbutton{color:#ddd;}
#sidemenu .userlogin .helpbutton:hover{color:#fff;}

#sidemenu .userlogin {    background-color: #555;
    padding: 20px 10px 0;}
#sidemenu .userlogin input[type="text"],
#sidemenu .userlogin input[type="password"] {
	background: #ddd;
	font-size: 1.5rem;
	padding: 5px;
	border-radius: 5px;
	border: none;
	width: 100%;
	margin: 0px 0px 20px 0px;
}

#sidemenu .usersignup {
    background: #555;
    padding: 10px;
    margin: 10px -10px 0;
}
#sidemenu .usersignup p {
    text-transform: uppercase;
    font-size: 1.5em;
    text-align: center;
	  margin: 0;
}


#sidemenu .logout-btn,
#sidemenu .registernow,
#sidemenu .deposit-btn {
	text-decoration:none;
	text-transform:uppercase;
	padding: 5px 10px;
	font-size: 0.9em;
	margin: 10px 5px;
	display: inline-block;
	text-shadow: none;
	border: none!important;
	position:relative;
	width: calc(50% - 32px);
}



#sidemenu .registernow {
		margin: 0 auto;
		padding: 10px 20px;
		padding: 5px 20px;
		display: block;
		color: #fff;
		text-align: center;
		border-radius: 10px;
		background-color:var(--red);
		background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
		background-image: -moz-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
		background-image: -o-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
		background-image: linear-gradient(to bottom,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
}

#sidemenu .languagemenu {padding: 10px 10px;}
#sidemenu .languagemenu ul{margin: 0 -7px;padding:0;display: flex;flex-wrap: wrap;}

#sidemenu .languagemenu li
{
	display: block;
	background: none;
	padding: 0;
	flex: 0;
}

#langSel li[data-id] a::before{
	content: "";
	width: 30px;
	height: 20px;
	background: url(../images/flags-sprite.png);
	display: block;
	}

#langSel .lang-selected {display:inline-block}
#langSel .lang-selected li[data-id]{border: 4px solid var(--skin-color-1);}

#langSel li[data-id=IT] a::before {background-position:0px -72px;}
#langSel li[data-id=EN] a::before {background-position:0px 0px;}
#langSel li[data-id=PL] a::before {background-position:0px -96px;}
#langSel li[data-id=FR] a::before {background-position: 0px 20px;}
#langSel li[data-id=PT] a::before {background-position: 0px 45px;}
#langSel li[data-id=BR] a::before {background-position: 0px -24px;}
#langSel li[data-id=DE] a::before {background-position:0px -119px;}
#langSel li[data-id=ES] a::before {background-position:0px -143px;}
#langSel li[data-id=ZH] a::before {background-position:0px -167px;}
#langSel li[data-id=AR] a::before {background-position:0px -190px;}
#langSel li[data-id=UK] a::before {background-position:0px -213px;}
#langSel li[data-id=FA] a::before {background-position:0px -237px;}
#langSel li[data-id=AZ] a::before {background-position:0px -260px;}
#langSel li[data-id=RU] a::before {background-position:0px -283px;}
#langSel li[data-id=AL] a::before {background-position:0px -307px;}

/*** BOTTOM MENU
*/
#bottom-menu
{
	margin:0;
	padding:5px 0 0;
	width:100%;
	display:flex;
	position:fixed;
	z-index: 100;
	bottom:0;
	background:#111;
	overflow: auto;
}
#bottom-menu::-webkit-scrollbar {
  height: 0em;
}

#bottom-menu a{
	display:block;
	flex: 1 0 auto;
	min-width: 20%;
	max-width: 23%;
	margin: 1%;
	text-decoration:none;
	display: inline-block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
}

#bottom-menu .menubutton
{
	padding: 5px;
  padding-top: 38px;

  font-size: 10px;
  font-weight: 600;
  position: relative;
}

#bottom-menu .menubutton::before
{
	font-family:'Font Awesome 5 Free';
	font-size:30px;
	position:absolute;
	top:5px;
	left:50%;
	transform:translateX(-50%)
}

#bottom-menu .menubutton.home-ico::before
{
	content:'\f015'
}

#bottom-menu .menubutton.sport-ico::before
{
	content:'\f0c9'
}

#bottom-menu .menubutton.livesport-ico::before
{
	content:'\f2f2'
}

#bottom-menu .menubutton.casino-ico::before
{
	content:'\f522'
}

#bottom-menu .menubutton.livecasino-ico::before
{
	content:'\f51e'
}
#bottom-menu .menubutton.bingo-ico::before
{
	content: '';
	background-image: url(/mobile/images/bingo.png);
	
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}
#bottom-menu .menubutton.horse-ico::before
{
	content: '';
	background: url(/mobile/images/horse-menu.png) no-repeat;	
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}
#bottom-menu .menubutton.poker-ico::before
{
	content: '';
	background-image: url(/mobile/images/poker-menu.svg);
	background-repeat: no-repeat;
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}
#bottom-menu .menubutton.chicken-ico::before
{
	content: '';
	background-image: url(/mobile/images/chicken-menu.svg);
	background-repeat: no-repeat;
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}
#bottom-menu .menubutton.aviator-ico::before
{
	content: '';
	background: url(/mobile/images/aviator-menu.svg) no-repeat;	
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}
#bottom-menu .menubutton.virtual-ico::before
{
	content:'\f26c'
}


#bottom-menu .menubutton.coupon-ico::before
{
	content:'\f07a'
}

#bottom-menu .menubutton.login-ico::before
{
	content:'\f2f6'
}

#bottom-menu .menubutton.logout-ico::before
{
	content:'\f2f5'
}

#bottom-menu .menubutton.promo-ico::before
{
	content:'\f651'
}
#bottom-menu .menubutton.gorilla-ico::before
{
	content: '';
	background: url(/mobile/images/gorilla-menu.svg) no-repeat;	
	display: block;
	width: 1.1em;
	height: 1.1em;
	margin: 0 auto;
	filter: invert(1);
}


#bottom-menu .menubutton a
{
	display:block;
	width:100%
}

/*** FOOTER
*/
.cpnitm{
	/*width: 24px;
	height: 24px;
	background-color: green;*/
	position: absolute;
	display: block;
	top: 5px;
	right: 22px;
	padding: 0px;
	left: unset;
	border-radius: 50%;
	transform: none;
	font-size: 0.8rem;
	color: #fff;
	font-family: arial,sans-serif;
	line-height: 1.6rem;
}
#sidemenu a.deskversion {
    background-color: #444;
    border-radius: 5px;
    padding: 7px 10px;
    display: block;
    margin: 0 10px 10px;
    font-size: 16px;
    text-align: center;
    color: #999;
    text-decoration: none;
    text-transform: uppercase;
}

	/** MOVE TO COLORS*/
#gcat-container .gcat-head button,
#sidemenu .deposit-btn,
.gradient
	{
    background: var(--skin-color-1);
    background: -moz-linear-gradient(top, var(--skin-color-1) 0%, var(--skin-color-1-dark) 100%);
    background: -webkit-linear-gradient(top, var(--skin-color-1) 0%,var(--skin-color-1-dark) 100%);
    background: linear-gradient(to bottom, #21a700 0%,hsla(108, 100%, 20%, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='var(--skin-color-1)', endColorstr='var(--skin-color-1-dark)',GradientType=0 );
    border: #21a700;
    color: #fff;
 }

#topbar .menubutton::before{  color:#fff;}
#topbar .balanceamount{color:var(--skin-color-1)}
#bottom-menu .menubutton{color:#222;}

#suggested .suggestbutton{
      background-color: #555;
}


#bottom-menu a,
#sidemenu .loginbutton,
#topbar .loginbutton{
  background-color: var(--skin-color-1);
  background-image: -moz-linear-gradient(top, var(--skin-color-1) 0%, var(--skin-color-1-dark) 100%);
  background-image: -webkit-linear-gradient(top, var(--skin-color-1) 0%,var(--skin-color-1-dark) 100%);
  background-image: linear-gradient(to bottom, var(--skin-color-1) 0%,var(--skin-color-1-dark) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='var(--skin-color-1)', endColorstr='var(--skin-color-1-dark)',GradientType=0 );
}

#sidemenu .logout-btn{
	color:white;
  border:1px solid rgb(255, 0, 0);
  background-color:var(--red);
  	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
  	background-image: -moz-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
  	background-image: -o-linear-gradient(top,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));
  	background-image: linear-gradient(to bottom,rgba(255,255,255,0.3),rgba(255,255,255,0) 50%,rgba(0,0,0,0.12) 51%,rgba(0,0,0,0.04));

}
#topbar .refreshbalance {
    /*margin: auto 0;
    padding: 0 0 0.6rem 0;*/
    font-size: 1.5em;
    color: #fff;
    position: absolute;
    right: 10px;
    top: 24px;
}
#sidemenu .userlist li{position:relative}
.comingsoontag::before {
	content: 'COMING SOON';
	position: absolute;
	background-color: #bf0202;
	color: #fff;
	padding: 3px 5px;
	transform: translate(-50%,-50%) rotate(-10deg);
	top: 50%;
	left: 50%;
	line-height: 15px;
	white-space: nowrap;
	border: 2px solid #fff;
	font-size: 12px;
}

/**FOOTER**/
._foot_box {background-color: #111;padding-bottom: 70px;}
.company_raw1, .company_raw1 {padding: 20px;font-size: 20px;}
.company_raw1 h6{margin:0}
.company_raw1 p {
    font-size: 0.6rem;
    color: #666;
    text-align: justify;
}
.company_raw2 {    display: flex;}
.company_raw2 img {    width: 40px;}
.company_raw2>* {    flex: 1 auto;    text-align: center;}
.company_raw2 div div {    margin: 0 auto;}


@media (max-width:320px){

	#topbar .sitelogo a {}
	#sidemenu {top:0;}
	#sidemenu .userlist ul {}
	#sidemenu .userlogin label, #sidemenu .languagemenu p, #sidemenu .userlogin .helpbutton {font-size: 14px;}
	#sidemenu .languagemenu p{margin-bottom: 10px;}
	#suggested .suggtext {font-size:22px!important;}
	#sidemenu .usersignup p {font-size:1em;}
	#sidemenu .userlogin input[type="text"], #sidemenu .userlogin input[type="password"]{}

	}/*end iphone5*/


#sidemenu .userstatus>div {
    /* flex: none; */
    padding: 0 5px;
    box-sizing: content-box;
}
#sidemenu .userwallet {
    border-left: 1px solid #676464;
}
#sidemenu .userinfo {
    border-right: 1px solid #4c4c4c;
}

#sidemenu .userstatus p.bonus-status {
    color: #caff00;
}
#sidemenu .userstatus p.bonus-status i {
    margin-right: 5px;
}

.Jbtn
{
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: 5px 10px;
    font-size: 16px;
    line-height: 1.5;
    border-radius: 4px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    background-color:var(--skin-color-1);
    color:var(--skin-color-1-txt);
}


@media (max-width:320px){
div#topbar {}
#topbar .menubutton::before	{font-size: 30px;}
#topbar .sitelogo .img-responsive.logo{
	width: 101px;
	height: auto;
}
#topbar .loginbutton, #topbar .registernow{
	margin: 0 2px;
	padding: 10px 10px;
}
}



#MobPrintCpn iframe {
    margin: 0 auto;
    padding: 0;
    display: block;
    border: none;
    overflow: hidden;
    width: 100%;
    top: 0;
    bottom: 0;
    height: calc(100% + 80px);
    left: 0;
    z-index: 100;
    position: absolute;
    background: #fff;
}
div#MobPrintCpn {
    display:none;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    text-align: right;
    right: 0;
    background: #fff;
    z-index: 100;
    margin-top: 70px;
    margin-bottom: 80px;
}



#MobPrintCpn .closeme {
	background-color: #222;
	z-index: 101;
	height: 50px;
	width: 50px;
	padding: 10px;
	box-sizing: border-box;
	display: block;
	position: absolute;
	right: 0;
	top: 0;
}
#MobPrintCpn .closeme:before {
    content:'\f00d';
    position: absolute;
    top: 0;
    left: 0.2em;
    font-family: 'Font Awesome 5 Free';
    color: #fff;
    font-sizE: 46px;
    font-weight: 600;
    }

#topbar .sub-topbar {
    flex-basis: 100%;
}

#sidemenu li.extwallets {
    display: none;
}