.login-page-content {float:left; width:100%;}
.login-page-left {float:left; width:calc(100% - 560px); padding-top:130px;}
.login-page-left .title {float:left; width:100%; text-align:center; margin-bottom:30px;}
.login-page-left .title h1 {font-size:20px; font-weight:700; margin-bottom:10px; float:left; width:100%; color:#000;}
.login-page-left .title span {font-size:12px; float:left; width:100%; text-align:center; line-height:1.7em}
.login-page-right {float:right; width:560px; position:relative;}
.login-page-right > img {display:block;}
.login-page-right .login-page-alter-content {position:absolute; top:130px; left:0; color:#fff; text-align:center; padding:0 80px;}
.login-page-right .login-page-alter-content h2 {font-size:20px; font-weight:700; margin-bottom:10px; float:left; width:100%}
.login-page-right .login-page-alter-content p {font-size:12px; float:left; width:100%; text-align:center; line-height:1.7em}
.login-page-right .login-page-alter-content a {width:200px; display:block; float:left; border:1px solid #fff; color:#fff; height:40px; line-height:40px; font-size:11px; text-decoration:none; font-weight:600; border-radius:3px; left:50%; position:relative; margin-left:-100px; margin-top:30px; transition:ease all .2s;}
.login-page-right .login-page-alter-content a:hover {background:#fff; transition:ease all .2s; color:#000;}
.form-group {position: relative;float:left;width:100%;margin-bottom: 15px;}
.form-group-half {position: relative;float:left;width:calc(50% - 5px);margin-bottom: 15px; margin-right:10px;}
.form-group-half.mr-0 {margin-right:0 !important;}
.form-group label, .form-group-half label {color: #333;font-size: 10px;float:left;width:100%;margin-bottom: 0px;font-weight: 500;padding: 10px 0 0 0px;text-transform:uppercase; letter-spacing:-0.03em;}
.form-control {float: left;width: 100%;border: 1px solid #ddd;height: 38px;font-size: 11px;font-weight: 500;color: #000;z-index: 2;background: transparent;position: relative;box-shadow:none;padding: 0px 10px; background-color: #fff;border-radius: 0px; margin-top:5px; -webkit-appearance:none; appearance:none; font-family:'Helvetica'; outline:none; line-height:1.5em; font-family:'Spartan'}
select.form-control {border-radius: 0 !important;-webkit-appearance: none;background: url(/Content/images/caret-down.png) top 12px right 12px no-repeat;font-size: 11px;background-color: #fff;font-family: 'Spartan'; font-weight:500; line-height:38px;}
textarea.form-control {height: auto; padding:8px 10px; font-size:11px;}
.membership-action-button {background: #000; float: left; width: 100%; display: block; height: 42px; text-align: center; color: #fff; font-family:'Spartan'; text-decoration: none; font-weight: 600; font-size: 11px; padding-top: 0; border-radius: 0; margin-bottom: 5px; transition: ease all .2s; line-height: 42px; border:none; cursor:pointer;}
.without-membership-button {border: 1px solid #ddd; width: 100%; color: #000; float: left; font-size: 11px; text-align: center; height: 42px; line-height: 42px; text-decoration: none; font-weight: 600; margin-top: -10px;}
.login-page-form-wrapper {width:400px; margin:0 auto;}
label.lp-checkbox {position:relative; padding-left:20px; float:left; width:auto; color:#000; line-height:1.8em;}
label.lp-checkbox a {text-decoration:none; color:#000; border-bottom:1px solid #000;}
label.lp-checkbox input {position:absolute; left:0; top:11px; margin:0;}
.forgot-pass-btn {float: right; font-size: 10px; text-decoration: none; color: #000; text-transform: uppercase; margin-top: 10px;}
.password-popup {padding:30px; max-width:450px;}
.password-popup h4 {float:left; width:100%; font-size:13px; margin-bottom:30px; text-transform:uppercase; font-weight:600;}
.remember-pass-msg {float:left; width:100%; color:#ff0066; font-size:11px; text-align:center; margin-top:-5px;}
.login-error-msg {float:left; width:100%; text-align:center; font-size:11px; color:#ff0066; font-weight:500;}
.otp-login-form .error {
  font-size: 11px;
  text-align: center;
  width: 100%;
  float: left;
  margin-bottom: 20px;
  color: #ff0066;
  font-weight: 500;
}
/* Variant Login Pages */
.variant-user-login-area {float:left; width:100%; background:#f3f3f3; margin-bottom:-70px; padding-bottom:70px; display:block;}
.v2-login-form-container {width:490px; margin:0 auto;}
.user-login-variant-header {display:none;}
.v2-login-form-wrapper {float:left; width:100%; position:relative; margin-top:80px;}
.v2-login-form-wrapper img.v2-login-title-img {position:absolute; right:70px; top:-35px;}
.v2-login-form-wrapper .v2-login-form-title {float:left; width:100%;}
.v2-login-form-wrapper .v2-login-form-title h1 {float:left;font-size:20px;margin-top:8px;font-weight:600;letter-spacing: -0.03em;}
.v2-login-form-wrapper .v2-login-form-title a {float:right; background:#fff; text-decoration:none; font-size:13px; padding:0px 10px; height:30px; line-height:32px; font-size:9px; font-weight:700; color:#000; border-radius:3px;}
.v2-login-form-wrapper .v2-login-form-title a i {float:right; margin:9px 0 0 5px; font-size:12px;}
.v2-login-form-wrapper form {background:#fff; float:left; width:100%; padding:20px 30px; margin-top:10px;}
.v2-login-form-checkbox {display:none;}
.v2-login-form-wrapper form .forgot-pass-btn {float:left;}
.v2-login-form-wrapper form .membership-action-button {background:#ff0066;}
.v2-new-membership-form-info {float:left; width:100%; background:#fff; margin-top:10px; padding:20px; font-size:10px; text-align:center; line-height:1.8em;}
.v2-new-membership-form-info a {color:#000; font-weight:600; border-bottom:1px solid #000;}
.v2-login-form-wrapper .lp-checkbox span text {float:left; width:100%; text-transform:none;}

.otp-login-form {float:left; padding: 40px !important; width: min(100%, 490px) !important;}
.otp-login-form .form-group {margin-bottom:20px;}
.otp-login-form .form-control {height:50px; font-size:12px;}
.otp-login-form button[type="submit"] {height:50px; width:100%; background:#ff0066; border:none; color:#fff; font-size:11px; font-weight:700; border-radius:3px; cursor:pointer;}
.otp-login-form > a {float:left; color:#ff0066; font-size:12px; font-weight:600; display:flex; align-items:center; margin-top:10px; letter-spacing:-0.03em; margin-bottom:10px;}
.otp-login-form > a img {float:left; margin:-2px 6px 0 0;}
.otp-desc {float:left; width:100%; display:grid; grid-template-columns:50px 1fr; align-items:center; font-size:13px; line-height:22px; margin-bottom:20px;}
.resend-otp-btn {border:none; background:#fff; float:left; color:#ff0066; font-size:12px; font-weight:600; display:flex; align-items:center; margin-top:10px; letter-spacing:-0.03em; margin-bottom:10px;}
.resend-otp-btn img {float:left; margin:-2px 6px 0 0;}
.otp-sms-flex {display:flex; float:left; width:100%; align-items:center;margin-top: 10px;}
.otp-sms-flex input {width:64px; height:70px; display:flex; align-items:center; justify-content:center; text-align:center; border:1px solid #ddd; margin-right:4px; border-radius:3px;}
.resend-otp-btn.backto-login-btn {color:#999 !important;}
.resend-otp-btn.backto-login-btn i {float:left; font-size:18px; margin:-3px 5px 0 4px;}

.sms-login-trigger-btn {background: #fff; float: left; width: 100%; border:1px solid #ff0066; display: block; height: 42px; text-align: center; color: #fff; text-decoration: none; font-weight: 600; font-size: 11px; color:#ff0066; padding-top: 0; border-radius: 0; margin-bottom: 5px; transition: ease all .2s; line-height: 42px; cursor: pointer;}
/* **** TABLET YATAY ***** */
@media screen and (min-width : 992px) and (max-width : 1199px) {
    .login-page-right {width:460px;}
    .login-page-left {width:calc(100% - 460px);}
    .login-page-left .title h1 {font-size:16px;}
    .login-page-image > img {display:block;}
    .login-page-right .login-page-alter-content h2 {font-size:16px;}
    footer {margin-top:0;}
}

/* **** TABLET DIK ***** */
@media screen and (min-width : 768px) and (max-width : 991px) {
  .login-page-right {width:100%; margin-top:40px;}
  .login-page-left {width:100%; padding-top:70px;}
  .login-page-image > img {width: 100%; display:block;}
  footer {margin-top:0;}
}

/* **** TELEFON ***** */
@media screen and (max-width : 767px) {
    .login-page-right {width:100%; margin-top:40px;}
  .login-page-left {width:100%; padding-top:70px;}
  .login-page-image > img {width: 100%; display:block;}
  footer {margin-top:0;}
  .login-page-form-wrapper {width:100%;}
  .login-page-left .title h1 {font-size: 14px;}
  .login-page-right .login-page-alter-content h2 {font-size: 14px;}
  .login-page-right .login-page-alter-content {padding:0 20px;}

  /* Variant */
  .v2-login-form-container {width:100%;}
  .variant-user-login-area {margin-bottom:0}
  .user-login-variant-header {display:block;background:#fff; border-bottom:1px solid #ddd; display:grid; grid-template-columns:100px 1fr 100px; height:60px; padding-top:13px}
  .v2-user-login-back {float:left; display:grid;  width:44px; padding-left:10px; font-size:9px; text-decoration:none; color:#000; justify-content:center; font-weight:500;}
  .v2-user-login-back img {margin-bottom:-15px; margin-left:-1px;}
  header {display:none;}
  main {margin-top:0;}
}