@import url('https://fonts.googleapis.com/css?family=Montserrat:400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap');
body{ margin: 0; padding: 0; background: url(../images/bg-image.jpg) no-repeat; object-fit: cover; background-color: #000; font-family: 'Montserrat', sans-serif;}
a{color: #000; text-decoration: none;}
.login-main{ margin: 0 auto; text-align: center; width:736px;}

.logo{ width: 100%; text-align: center; display: inline-block; text-align: center;
    background: #000;
    opacity: 0.9;
    margin-bottom: 15px;}
    
.login-main .mid-slider{ width: 140px; text-align: center; margin: 0 auto 25px auto; overflow:hidden;}
.login-main .mid-slider .text-slider{ font-weight:500;position: relative;
    z-index: -1;background: #ffc80b; padding: 10px; display: table-cell; vertical-align: middle; color: #000; font-size: 14px; line-height: 16px; width: 120px; height: 120px; border-radius: 200px;}
    .login-main .mid-slider .text-slider-red{ font-weight:500;position: relative;
    z-index: -1;background: #cc0000; padding: 10px; display: table-cell; vertical-align: middle; color: #fff; font-size: 14px; line-height: 16px; width: 120px; height: 120px; border-radius: 200px;}
.login-box{ border-radius:5px; width: 100%; float:  left; margin: 0 auto 50px auto; overflow: hidden;}
.login-box .left-part{ background: url(../images/login-left-bg.jpg) no-repeat top; float: left; width: 50%; color: #fff; height: 418px; position: relative;    background-size: cover;}
.login-box .left-part .title{ font-size: 22px; float:  left; text-align: center; width: 100%; padding: 20px 0; font-weight: 500;}
.login-box .left-part ul{ margin: 0 0 0 10%; padding: 0;}
.login-box .left-part ul li{ list-style: disc; font-size: 14px; line-height: 18px; margin-bottom: 10px; width: 95%; text-align: left;}
.login-box .left-part .brand-logo{ float: left; width: 100%; text-align: center; position: absolute; left: 0; right: 0; bottom: 0;}
.login-box .left-part .brand-logo img{ height: 25px; margin-bottom: 20px; text-align: center; display: inline-block; width: auto; object-fit: cover;}
.login-box .left-part .brand-logo img + img{ margin-left: 20px;}
.login-box .right-part{ float: right; background: #fff; padding-top: 57px; width: 50%; color: #000; font-weight: 500;}
.login-box input[type="text"], input[type="password"], input[type="number"], input[type="tel"]{ margin-bottom: 35px; border: 0; font-size: 14px; color: #000; width: 100%; padding-bottom: 15px; border: 0px; border-bottom: 1px solid #a9a7a7;}
.input-box{border-bottom:20px; position: relative;}
.login-box .form{ width: 80%; float: left; margin: 0 10%;}
.login-box .form .forgot-pass{ float: right; width: 100%; text-align: right; margin-top: -25px;}
.login-box .form .forgot-pass a{ color: #707070; font-size: 12px; }
.login-box .login-btn-row{ float:left; width: 100%; text-align: center; margin: 25px auto;}
.login-box .login-btn-row .login-btn{ border: 0; width: auto; text-align: center; padding: 10px 30px; color: #fff; background: #000; border-radius: 3px; text-transform: uppercase; font-size: 18px; cursor: pointer;}

.register-box .left-part{ height: 556px; background:url(../images/register-left.jpg) no-repeat top; background-size: cover;}

.login-box .or-text{ font-size: 14px; float: left; text-align: center; width: 100%; margin-bottom: 25px;}
.smo-login-row{ float: left; width: 100%; text-align: center; margin-bottom:25px;}
.smo-login-row a{ color: #fff;}
.smo-login-row a + a{ margin-left: 40px;}
.fb-login{ background: #3a559f; width: 104px; font-size: 15px; padding: 8px 10px; border-radius: 3px; display: inline-block;}
.fb-login i{ float: left;font-size: 20px; padding-right: 0px;}
.fb-login span{ display: inline-block;}

.gplus-login{ background: #dd4b39; width: 104px; font-size: 15px; padding: 8px 10px; border-radius: 3px; display: inline-block;}
.gplus-login i{ float: left;font-size: 20px; padding-right: 0px;}
.gplus-login span{ display: inline-block;}
.login-register-text{ float:left; font-size: 14px; color: #000; text-align:  center; margin-bottom: 10px; width: 100%; font-weight: 500;}
.login-register-text a{ color: #037daa;}
.login-box .reset-pass{margin: 0 auto;display: inline-block; float:inherit; height: 360px;}
.float-inherit{ float:inherit;}
.error-msg{ color:#FF0000; font-size:11px;background:url(../images/error-msg.png) no-repeat left 10px; padding-left:15px; display:none;     position: absolute;
    left: 0;
    top: 32px;}
.dnone{ display:none;} 
.padt10{ padding-top:10px;}
.login-main .mid-slider .item{background-image: url(../images/login-bee.png);
    background-repeat: no-repeat;
    position: relative;
    background-position: 47px 0px;
    padding-top: 15px;}
    
    
    .needpopup-opened,
.needpopup-opened body {overflow: hidden;}
.needpopup-opened.needpopup-scrolled,
.needpopup-opened.needpopup-scrolled body { height: auto;}
.needpopup-opened.needpopup-scrolled body {position: fixed;width: 100%;}
/* Popup wrapper*/
.needpopup_wrapper {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  visibility: hidden;
  overflow: auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  padding: 40px 0;
  -webkit-transition: opacity .3s ease;
  transition: opacity .3s ease;
  opacity: 0;
  background: #000;
  background: rgba(0, 0, 0, .8);
}
.needpopup-opened .needpopup_wrapper {visibility: visible; opacity: 1;}
.needpopup-overflow .needpopup_wrapper {padding: 10px;}
.needpopup .title{ font-size:17px; width:100%; text-align:center; margin:0 auto; font-weight:700;}
.needpopup .title span{ width:185px; text-align:center;  border-bottom:1px solid #d6d6d7; padding-bottom:5px;}
.needpopup {
  position: relative;
  z-index: 9999;
  top: 50%;
  left: 50%;
  display: none;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 810px;
  max-width: 100%;
  margin-left: -405px;
  padding: 30px 60px;
  -webkit-transform: scale(.1, .1);
  -ms-transform: scale(.1, .1);
  transform: scale(.1, .1);
  opacity: 0;
  background: #fff;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.needpopup.opened {
  -webkit-transition: opacity .5s ease, -webkit-transform .5s ease;
  transition: opacity .5s ease, transform .5s ease;
  -webkit-transform: scale(1, 1);
  -ms-transform: scale(1, 1);
  transform: scale(1, 1);
  opacity: 1;
}
.needpopup.stacked {
  top: 0 !important;
  margin-top: 0 !important;
}
.needpopup-overflow .needpopup {
  left: 0;
  width: auto;
  margin-left: 0;
}
.needpopup_remover {
  position: fixed;
  z-index: 9999;
  top: 30px;
  right: 30px;
  font-size: 40px;
  line-height: .5;
  color: #fff;
  text-decoration: none;
}
.needpopup_remover:hover {
  color: #ffffff;
}
.needpopup_remover:before {
  content: 'x';
  font-size:24px;
}
.needpopup .needpopup_remover {
  top: 10px;
  right: 10px;
  font-size: 26px;
  line-height: .5;
  color: #000;
  position:absolute;
}
.needpopup .needpopup_remover:hover {
  color: #000;
}
.smallpopup{ 
    left: 50%;
    margin-left: -185px;
    max-width: 100%;  
    top: 30%;
    width:450px;
    z-index: 9999;
	padding:30px;}
.smallpopup .title{ width:100%; text-align: center;  padding-bottom:5px; font-weight:normal; color:#323232; font-size:16px; display:inline-block; font-weight: 700;}

.smallpopup .likeboxmain{ width:100%; display:inline-block; padding-top:20px;}
.smallpopup .title span{text-align:left; font-weight:normal; color:#323232; font-size:16px; display:inline; font-weight: 700;  border-bottom:1px solid #d6d6d7;}

.popup-title{ display:block; padding:30px 0 10px 0; text-align:center;}
.popup-btn {
    margin: 20px auto 0px auto;
    text-align: center;
    display: block;
	width:80px;
}
.common-btn{background:#fff; border-top:3px solid #ffc80b; text-transform:uppercase; text-align:center; padding:10px 20px; border-radius:3px; display:inline-block; cursor: pointer; border-left:0px; border-bottom:0px; border-right:0px;}
.common-btn2{background:#ffbd1d; border:0px; text-transform:uppercase; text-align:center; padding:10px 20px; border-radius:3px; display:inline-block; cursor: pointer; border-left:0px; border-bottom:0px; border-right:0px;}
.common-btn:hover{background: #ffc80b;}
.popupcontentbox{text-align:center;}
.logintoplogo{margin-top: 10px;  margin-bottom: 10px;}