body {
  background: url(../../imagenes/fondo_login-min.jpg) no-repeat center center;
  background-size: cover;
  font-family: helvetica;
  display: flex;
  height: 100vh;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
  align-content: center;
  align-items: center;
}
.content {
  width:50%;
  display:flex;
  flex-direction:row;
}
.login {
  box-sizing: border-box;
  width: 320px;
  height: auto;
  margin: auto;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}
.block {
  padding: 30px;
  border-radius: 30px;
  background: rgba(0, 0, 0, 0.4);
  box-shadow:0px 0px 10px 1px rgba(0, 0, 0, .35), 0 0 0 2px rgba(0, 0, 0, .2);
}
.login.white .block {
  background: rgba(255, 255, 255, 0.2);
  box-shadow:0px 0px 10px 1px rgba(0, 0, 0, .35), 0 0 0 2px rgba(255, 255, 255, .2);
}
.input-data {
  position: relative;
  width: 100%;
}
.input-data > input {
  padding: 10px 15px;
  border-radius: 30vw;
  background: rgba(255, 255, 255, 0.1);
  border: none;
  display: block;
  width: 100%;
  font-size: 18px;
  margin: 0 0 30px;
  position: relative;
  outline: 0;
  color: #fff;
  box-sizing: border-box;
}
.login.white .input-data > input {
  background: rgba(0, 0, 0, 0.1);
}
.input-data > .placeholder {
  position: absolute;
  top: 9px;
  left: 10px;
  font-size: 18px;
  color: rgba(255, 255, 255, 0.4);
  transition: transform 200ms, color 200ms;
  border-radius: 30vw;
  padding: 1px 10px;
  z-index:-1;
}
.login.white .input-data > .placeholder {
  color: rgba(255, 255, 255, 0.4);
}
.input-data > input:focus ~ label.placeholder,
.input-data > input:not(:placeholder-shown) ~ label.placeholder,
.login.white .input-data > input:focus ~ label.placeholder,
.login.white .input-data > input:not(:placeholder-shown) ~ label.placeholder {
  transform: translateY(-32px) translateX(-18px) scale(0.75);
  color: #fff;
  border: 1px solid #fff;
  z-index:1;
}

.input-data > input:not(:placeholder-shown) ~ label.placeholder {
  color: #2fdc9c;
  border-color: #2fdc9c;
}
.login.white .input-data > input:not(:placeholder-shown) ~ label.placeholder {
  background: #00ab6c;
  border-color: #00ab6c;
  color:#fff;
}
.submit {
  background: #dc2f55;
  border: none;
  font-size: 20px;
  padding: 10px 30px;
  border-radius: 30vw;
  color: #fff;
  outline: 0;
  cursor: pointer;
  margin-top:0px;
  margin-left: 50%;
  transform: translateX(-50%);
}
.submit:hover {
  background: #fff;
  color: #dc2f55;
}
.lost-password {
  font-size:12px;
  text-align:center;
  margin:20px 0 0px;
  color:#fff;
}
.lost-password a {
  color:#fff;
}
.lost-password a:hover,
.lost-password a:focus {
  color:#dc2f55;
}
.fa-user {
  font-weight:300;
}