@charset "UTF-8";

html, body {
  width: 100%; height: 100%; margin: 0; padding: 0;
}

body {
  background: linear-gradient(190deg, #953AFF 0%, #0C0059 100%);
}

header {
  width: 100%; height: 90px; line-height: 90px; background-color: rgba(0, 0, 0, 0.2); color: white; padding: 0 100px; box-sizing: border-box;
}

footer {
  width: 100%; height: 50px; line-height: 50px; background-color: rgba(0, 0, 0, 0.2); position: fixed; bottom: 0; left: 0;
}

header .title {
  font-size: 24px; display: inline-block;
}

header .right {
  float: right; 
}

a {
  color: white; text-decoration: none; display: inline-block; margin-right: 2em;
}

.container {
  margin-top: 4em; max-width: 1040px;
}

.container .row .bg {
  padding: 0;
}

.container .row .bg img {
  width: 100%; transform: translateX(10px);
}

.container .right {
  margin-top: 10px; margin-bottom: 10px; color: white; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); border-radius: 0px 40px 0px 0px; position: relative;
}

.container .right .bg, .container .right .content {
  position: absolute; width: 100%; height: 100%; left: 0; top: 0;
}

.container .right .bg {
  background: linear-gradient(180deg, #834BFF 0%, #1153FC 100%); opacity: 0.3; border-radius: 0px 40px 0px 0px; z-index: 0;
}

.container .right .content {
  z-index: 1; padding: 0 2.5em;
}

.welcome {
  font-size: 1.5em; margin-top: 3em; margin-top: 3em;
}

.form-container {
  margin-top: 3em;
}

.form-container .login-tab {
  display: inline-block; cursor: pointer; color: #B8BDC1;
}

.form-container .login-tab+.login-tab {
  margin-left: 1em;
}

.form-container .login-tab:after {
  content: ""; width: 100%; height: 5px; display: inline-block; transform: translateY(-8px);
}

.form-container .login-tab.active {
  color: white;
}

.form-container .login-tab.active:after {
  content: ""; width: 100%; height: 5px; background: linear-gradient(90deg, #3245EB 0%, #2DA3FD 100%); border-radius: 10px; display: inline-block; transform: translateY(-8px);
}

.form {
  margin-top: 2em;
}

.form .input-group input.form-control {
  height: 3em; line-height: 3em; border-radius: 1.5em; background-color: white; padding-left: 0;
}

.form .input-btn {
  position: relative;
}

.form .input-btn input {
  border-top-right-radius: 1.5em !important; border-bottom-right-radius: 1.5em !important;
}

.form .input-btn .btn-code {
  position: absolute; right: 1.5em; color: #005EFF; top: 0; line-height: 3em; height: 100%; cursor: pointer; z-index: 1000;
}

.form .input-btn .btn-code.disabled {
  color: #666666;
}

.form .input-group-text {
  background-color: white; border-top-left-radius: 1.5em; border-bottom-left-radius: 1.5em;
}

.form .input-group input {
  border-left: 0;
}

.btn-register {
  background: linear-gradient(90deg, #3245EB 0%, #2DA3FD 100%); color: white; padding-left: 2em; padding-right: 2em;
}

.form-btn-container {
  text-align: right;
}

.form-btn-container a{color:#B8BDC1;}