html{
  display: table;
  max-width: 375px;
  margin: 0 auto; 
  height: 100vh;
}
body{
  font-family: 'Montserrat';
  padding: 20px;
  margin: 0;   
  margin: 0 auto;
  color:#333333;
  /*border: 1px solid #b3b3b3;*/
  font-size: 16px;
  display: table-cell;
  vertical-align: middle;  
  text-align: center;  
}

body a{
  color: #d10002;
}

/* LOGIN */

.product-title {
    margin-bottom: 30px;
}

.login-header-message {
text-align: center;
font-size: 19px;
margin: 30px 0px;
}


.field {
  margin: 10px 0px;
  border: 0;
  padding: 0;
}

.recovery {
  margin: 20px 0px;
  font-weight: 600;
}

a {
  font-weight: 600;
}

 .form .label{
  margin-bottom:15px;
  position:relative; 
  display: block;
  text-align: left;
}


input[type='text'],input[type='password']{
  width:100%;
  padding:5px 0px 0px 10px;
  margin:5px 0;
  border:0;
  border-radius: 8px;
  height: 50px;
  border:1px solid #b3b3b3;
  font-size: 12px;
  font-family: 'Montserrat';  
  letter-spacing: 0.05rem;
}

.form-item {
  font-size: 14px;
  margin: inherit;
  letter-spacing: 0.6;
}

.register {
  font-size: 16px;
  border-top: 1px solid #b3b3b3ab;
  width: 90%;
  margin: 0 auto;
}

 input::placeholder{
  opacity:0.6;
  font-size: 12px;
}

input::-webkit-input-placeholder {
  color: #999;
}
input:focus::-webkit-input-placeholder {
  transform:translateY(-15px);
  font-size: 11px;
  font-weight: 600;
}

/* Firefox < 19 */
input:-moz-placeholder {
  color: #999;
}
input:focus:-moz-placeholder {
  transform:translateY(-15px);
  font-size: 11px;
  font-weight: 600;
}

/* Firefox > 19 */
input::-moz-placeholder {
  color: #999;
}
input:focus::-moz-placeholder {
  transform:translateY(-15px);
  font-size: 11px;
  font-weight: 600;
}

/* Internet Explorer 10 */
input:-ms-input-placeholder {
  color: #999;
}
input:focus:-ms-input-placeholder {
  transform:translateY(-15px);
  font-size: 11px;
  font-weight: 600;
}


button{
  width: 100%;
  border-radius: 100px;
  border: 10px;
  background-color: #d10002;
  height: 50px;
  color: #ffffff;
  font-size: 19px;
  font-family: 'Montserrat';
  font-weight: 100;  
  margin-top: 10px;
  
}

.message {
  color: #d10002;
}

 .form .forgot{
  margin: 20px 0;
  font-size: 14px;
}

 .form .block-checkbox{
  margin:30px 0;
}
 .form label.checkbox{
  font-size: 14px;
  display: block;
  position: relative;
  padding-left: 15px;
  margin-bottom: 12px;
  cursor: pointer;
}
/* Ocultar el checkbox por defecto */
 .form label.checkbox input{
  position: absolute;
  opacity: 0;
  color: red;
  cursor: pointer;
  height: 0;
  width: 0;
  }

.mandatory-claim {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
  }

/* Crear un checkbox custom */
 .form label.checkbox .checkmark {  
  position: absolute;
  top: 3px;
  left: 0;
  height: 10px;
  width: 10px;
  outline: 1px solid #b3b3b3;
}

/* Create the checkmark/indicator (hidden when not checked) */
 .form label.checkbox .checkmark:after {
  content: "";
  position: absolute;
  width: 6px;
  height: 6px;
  background-color: #d10002;  
  left: 2px;
  top: 2px;
  display: none;
}

/* Show the checkmark when checked */
 .form label.checkbox input:checked ~ .checkmark:after {
  display: block;
}

footer{
  padding: 20px 0;
  border-top: 1px solid #b3b3b3;
}

/* CONSENT */
.hide {
  display: none;
}

.show {
  display: block;
}

.buttons .button:disabled{
  width: 40%;
  border-radius: 100px;
  border: 0;
  background-color: #b3b3b3;
  height: 50px;
  color: #ffffff;
  font-size: 19px;
  font-family: 'Montserrat';
  font-weight: 100;  
  margin: 30px 10px;
}

.buttons .button{
  width: 40%;
  border-radius: 100px;
  border: 0;
  background-color: #d10002;
  height: 50px;
  color: #ffffff;
  font-size: 19px;
  font-family: 'Montserrat';
  font-weight: 100;  
  margin: 30px 10px;
}

.consent-header-message {
  font-size: 19px;
  margin: 60px 0px;
}

.cookie-policy-message {
  margin: 60px 0px;
  font-size: 16px;
  
}