body {

  height: 100vh;
}

.loginscreen {
  position: fixed;
  top: -500px;
  bottom: 0;
  left: 0;
  right: 0;
  transition: opacity 200ms;
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
    -o-transition:all 0.5s ease;
    transition:all 0.5s ease;
  background-color: rgba(0, 0, 0, 0.6);
  visibility: hidden;
  opacity: 0;
  z-index:100;

}

/*loading*/
	.methodresponseloadingload{
		position:absolute;
		background-color:rgba(0,0,0,0.6);
		height:100.2%;
		width:100%;
		display:none;
    border-radius: 3px;
	}

	.methodresponseloadingload img{
		position:absolute;
		top:50%;
		left:50%;
		margin-left:-15px;
	}
	/*loading*/

/*qrscreen*/
.qrscreen {
  position: fixed;
  top: -500px;
  bottom: 0;
  left: 0;
  right: 0;
  transition: opacity 200ms;
	-webkit-transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
    -o-transition:all 0.5s ease;
    transition:all 0.5s ease;
  background: rgba(0, 0, 0, 0.8);
  visibility: hidden;
  opacity: 0;
  z-index:100;
  overflow:auto;

}

.qrscreenact {
  top: 0px;
  visibility: visible;
  opacity: 1;
}

.qrpopup {
  margin: 200px auto;
  background-color:rgba(0, 0, 0, 1);
  background-size:cover;
  width: 690px;
  position: relative;
  color:white;
  font-size:13px;
}

.qrpopup .break {
  flex-basis: 100%;
  bordeR:1px solid red;
  height: 0;
}

.qrpopup .close {
  background-color:var(--main);
  position: absolute;
  top: -12px;
  text-align:center;
  right: -12px;
  transition: all 200ms;
  font-size: 20px;
  width:30px;
  height:30px;
  border-radius:30px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}

.qrside{
	height:390px;
	width:290px;
	background-image:url(../images/backg1.jpg);
	float:left;
	background-size:290px;
	border:8px solid var(--main);
}

.qrside .qrtitle{
	margin:15px;
	font-size:26px;
	color:GOLD;
	font-weight:bold;
	text-align:center;

}

.qrside .qrtitle img{
	height:150px;
}

.stepside{
	background-color:#1f1f27;
	width:390px;
	padding:30px;
	display:flex;
	font-size:14px;
	float:right;
}
.stepcircle{
	width:30px;
	height:210px;
	padding-top:27px;
}
.sscircle {
	position: relative;
	border: 2px solid #999;
	border-radius: 100%;
	width: 25px;
	line-height: 20px;
	text-align: center;
	margin-top: 46px;
	margin-left:2px;
	background-color: #1b1c21;
	z-index: 2;
	color:var(--main);
}
.sscircle:first-child {margin-top: 0;}
.sscircle:before {
	position: absolute;
	border: 1px solid #999;
	width: 0;
	height: 44px;
	display: block;
	content: '';
	left: 50%;
	z-index: 1;
	top: -48px;
	margin-left: -1px;
}
.sscircle:first-child:before {display: none;}

.stepdesc{
	font-size:1px;
	height:210px;
}
.stepline{
	padding:29px 10px;
	font-size:14px;
	height:70px;
}

.qrbottom{
	position:absolute;
	background-color:black;
	height:80px;
	width:290px;
	bottom:0px;
	text-align:center;
}

.qrbottom2{
	position:absolute;
	height:120px;
	background-color:#1f1f27;
	width:390px;
	bottom:0px;
	left:300px;
	text-align:center;
}

.qrbottom2 input{
	width:80%;
	border:1px solid #222121;
	background-color:#0c0d12;
	color:#d9dadf;
	padding:15px;
	border-radius:3px;
}

.qrbottom img{
	padding-top:10px;
	height:60px;
}

.qrbottomsocial{
	width:80%;
	margin-left:10%;
	text-align:center;
	padding:15px;
}
.qrbottomsocial img{
	height:35px;
	padding: 0px 15px;
}
/*qrscreen--end--*/


/*customerpop*/

/*customerpop---end---*/


.loginscreenact {
  top: 0px;
  visibility: visible;
  opacity: 1;
}

.loginscreenlogo{
	text-align:center;
	padding-top:20px;
	padding-bottom:10px;
}

.loginscreenlogo img{
	height:40px;
}

.popup {
  margin: 200px auto;
  padding: 0px;
  background-color:var(--popbg);
  border:2px solid var(--main);
  width: 300px;
  position: relative;
  transition: all 3s ease-in-out;
  border-radius: 5px;
}

.popup h2 {
  text-align:center;
  margin-top: 20px;
  color: #8F99A3;
  font-size:19px;
  font-family: sans-serif;
}
.popup .close {
  background-color:var(--main);
  position: absolute;
  top: -12.5px;
  text-align:center;
  right:-12.5px;
  transition: all 200ms;
  font-size: 20px;
  width:25px;
  height:25px;
  border-radius:30px;
  font-weight: bold;
  text-decoration: none;
  color: white;
}

.close .times{
	margin-top:-3px;
}
.popup .close:hover {
  color: #fff;
}
.popup .content {
  margin-top:0px;
  width:100%;
}
.popup .content table{
	line-height:15px;
	text-align:center;
}
.popup .content table tr td img{
	height:18px; vertical-align:text-top;
	margin-right:-20px;
}
.popup .content input{
	width:80%;
	padding:10px 30px;
	background-color:transparent;
	border:none;
	border-bottom:2px solid var(--linecolor);
	outline:none;
	border-radius:0px;
	font-size:13px;
	color:var(--popinput);
}

.popup .content input:focus{
	border-bottom:2px solid var(--main);
}

.popup .content label{
	color:var(--popinput);
	font-size:14px;
	font-weight:bold;
	margin-left:-48%;
}


.loginbtn{
	height:45px;
	width:80%;
	background-color:transparent;
	font-weight:bold;
	cursor:pointer;
	font-size:14px;
	font-family: 'Roboto', sans-serif;
	border-radius:3px;
	border:0px;
}

.joinnow{
	height:45px;
	width:80%;
	background-image:var(--m_topbtn);
	color:black;
	font-weight:bold;
	text-shadow:none;
	cursor:pointer;
	font-size:14px;
	font-family: 'Roboto', sans-serif;
	border-radius:3px;
	border:0px;
}



.content tr td{
	color:var(--bfont);
	font-size:14px;
}

.content tr td a{
	color:var(--main);
}

.language{
	position:absolute;
	background-color:#1A1A1A;
	z-index:99;
	padding-top:5px;
	margin-left:-50px;
	width:120px;
	border-radius:3px;
	text-align:right;
	display:none;
}

.languagesel{
	padding:5px 10px;
	color:white;
	font-size:12px;
}

.languagesel img{
	height:12px;
	padding-left:5px;
}

.mobilemorepop{
	display:none;
	transition: all 3s ease-in-out;
}

.livechatsmallbtn{
	position:fixed;
	height:100px;
	width:100px;
	bottom:40px;
	right:1.5%;
	color:var(--main);
	text-align:center;
	font-weight:bold;
    transition: all 3s ease-in-out;
	-webkit-animation:btmup 3000ms;
	cursor:pointer;
}

.livechatsmallbtn img{
	margin:10px 20px -10px 20px;
	height:50px;
}

@-webkit-keyframes btmup {
	0% {
		transform: translateY(9000px);opacity:0;
	}
	90%{
		transform: translateY(-20px);opacity:1;
	}
	100% {
		transform: translateY(0px); opacity:1;
	}
}

@media only screen and (max-width: 1026px) {
  .box{
    width: 100%;
  }
  .popup{
  margin: 130px auto;
  padding: 0px;
  background-color:var(--popbg);
  border-radius: 5px;
  width: 300px;
  position: relative;
  }

 .error input[type=checkbox] {
   outline: 2px solid #c00;
}

.popup .content table tr td{
	font-family: sans-serif;
}

.loginbtn{
	text-shadow: none;
}

.livechatsmallbtn{
	display:none;
}


.mobilemorepop{
	position:fixed;
	bottom:-100px;
	width:98%;
	margin:1%;
	z-index:100;
	background: rgba(0, 0, 0, 0.8);
	display:none;
	z-index:100;
	-webkit-animation:btmup2 300ms;

}

@-webkit-keyframes btmup2 {
	0% {
		transform: translateY(100px);opacity:0;
	}
	50%{
		transform: translateY(-20px);opacity:1;
	}
	100% {
		transform: translateY(0px); opacity:1;
	}
}

.morecontain .moreheader{
	padding:5px 15px;
	color:white;
	vertical-align:middle;
	margin-bottom:-15px;
	font-weight:bold;
}

.mobilemorepop .morecontain{
	background-color:#282828;
	height:170px;
	border-radius:3px;
}

.morecontain .moreboxitem{
	padding-top:10px;
	width:20%;
	text-align:center;
	float:left;
	display:block;
}

.morecontain .close{
	position: absolute;
	right:15px;
	font-size: 25px;
	color:white;
	font-weight:bold;
	top:2px;
}

.morecontain .boxtitle{
	margin-top:-9px;
	height:15px;
	color:white;
	font-size:10px;
	padding-bottom:10px;
	font-family: sans-serif;
}

.loginbtn{

	font-weight:bold;
}

.joinnow{
	font-weight:bold;
}

/*qrpopup*/
.qrpopup {
  margin: 50px auto;
  background-color:rgba(0, 0, 0, 1);
  background-size:cover;
  width: 310px;
  position: relative;
  color:white;
  font-size:13px;
}

.qrside{
	border:6px solid var(--main);
	float:none;
	height:320px;
	width:310px;
}

.qrside .qrtitle img{
	height:100px;
}

.stepside{
	background-color:#1f1f27;
	width:310px;
	display:flex;
	font-size:12px;
	float:none;
	height:160px;
	padding:0px 30px;
}
.sscircle {
	position: relative;
	border: 2px solid #999;
	border-radius: 100%;
	width: 25px;
	line-height: 20px;
	text-align: center;
	margin-top: 23px;
	margin-left:2px;
	background-color: #1b1c21;
	z-index: 2;
	color:var(--main);
}
.sscircle:before {
	position: absolute;
	border: 1px solid #999;
	width: 0;
	height: 22px;
	display: block;
	content: '';
	left: 50%;
	z-index: 1;
	top: -24px;
	margin-left: -1px;
}


.stepline{
	padding:29px 10px 19px 10px;
	font-size:12px;
	height:25px;
}

.qrbottom2{
	position:relative;
	height:120px;
	background-color:#1f1f27;
	width:310px;
	bottom:0px;
	text-align:center;
	left:0px;
}

.qrbottomsocial{
	text-align:center;
	padding:15px;
}

.qrbottomsocial img{
	height:35px;
	padding: 0px 5px;
}
/*qrpopup---end---*/

}