/*Variables*/
:root{
  --fuente: 'Lato', sans-serif;
  --color-letra:#ffffff;
  --color-background:#ff1939;
  --color-disabled: #797979;
  --color-hover:#fc0a2b;
  --color-active:#ff5c5c;
  --color-form: #4d495fe6;
}
/*Normalización*/
*{
  margin:0px;
  padding: 0px;
}
/*Body*/
body {
  font-family: var(--fuente) !important;
  color: var(--color-letra) !important;
  font-size: 14px !important;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/*Background*/
.login-background {
  background: url('../img/background.jpg') no-repeat center center fixed var(--color-background);
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
/*Logos and Messages*/
.logoUDAMI {
  width: 20%;
  left: 10px;
  bottom: 10px;
  position: fixed;
  z-index: -1;
}

.UDAMI {
  width: 35%;
  left: 3%;
  top: 5%;
  position: fixed;
  z-index: -1;
}

.slogan {
  width: 40%;
  left: 20px;
  top: 20px;
  color: #fff;
  position: fixed;
  z-index: -1;
}

.sloganSmall {
  width: 20%;
  right: 7%;
  top: 8%;
  color: #fff;
  position: fixed;
  z-index: -1;
}

.error {
  width: 70%;
  left: 15%;
  top: 70%;
  color: #fff;
  position: fixed;
  z-index: -1;
}
/*Form*/
.login-form {
  max-width: 350px;
  margin: 150px auto 0;
  background: var(--color-form);
  border-radius: 20px;
  -webkit-border-radius: 20px;
}

.login-form .form-control {
  position: relative;
  font-size: 16px;
  height: auto;
  padding: 10px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.login-form .input-group {
  padding-bottom: 10px;
}

.login-form input[type="text"], .login-form input[type="password"] {
  border: none;
  box-shadow: none;
  font-size: 16px;
  border-radius: 0px 5px 5px 0px;
}

.login-form button[disabled="disabled"] {
  background:var(--color-disabled);
  color: var(--color-letra);
  cursor: no-drop;
}

.login-wrap {
  padding: 20px;
}

.form-control {
  display: block;
  width: 100%;
  height: 34px;
  font-size: 14px;
  line-height: 1.428571429;
  background-color: var(--color-letra);
  -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-control:focus {
  outline: none;
}
/*Icons*/
.login-form .login-img {
  text-align: center;
  color: var(--color-background);
  font-size: 50px;
  font-weight: 300;
}

.login-form .input-group-addon {
  padding: 6px 12px;
  font-size: 16px;
  color: var(--color-background);
  font-weight: normal;
  line-height: 1;
  text-align: center;
  background-color: var(--color-letra);
  border: none;
  border-radius: 100px 0px 0px 100px;
}
/*Link*/
a{
  text-decoration: none;
  color: var(--color-letra);
}

.pull-right {
  float: right !important;
  margin-top: 5px;
  margin-bottom: 10px;
}
/*Button*/
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-top: 20px;
  margin-bottom: 0;
  font-size: 18px;
  font-weight: normal;
  line-height: 1.428571429;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  border-radius: 100px 20px;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -webkit-transition: all 0.15s;
  -moz-transition: all 0.15s;
  transition: all 0.15s;
  display: block;
  width: 100%;
  color: var(--color-letra);
  background-color: var(--color-background);
  outline: none;
}

.btn:hover {
  color: var(--color-letra);
  text-decoration: none;
  background-color: var(--color-hover);
}

.btn:active {
  color: var(--color-letra);
  text-decoration: none;
  background-color: var(--color-active);
}

.btn:active {
  color: var(--color-letra);
  text-decoration: none;
  background: radial-gradient(var(--color-active),var(--color-hover));
}
/*Input*/
.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
}

.input-group-addon, .input-group-btn, .input-group .form-control {
  display: table-cell;
}

.input-group-addon, .input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}
/*Font*/
@font-face {
  font-family: 'IconsLogin';
  src: url('../icons/IconsLogin.eot');
  src: url('../icons/IconsLogin.eot?#iefix') format('embedded-opentype'), url('../icons/IconsLogin.woff') format('woff'), url('../icons/IconsLogin.ttf') format('truetype'), url('../icons/IconsLogin.svg#IconsLogin') format('svg');
  font-weight: normal;
  font-style: normal;
}

.icon_lock_alt, .icon_profile, .icon_key, .icon_key_alt, .icon_mail, .icon_id, .icon_blocked, .icon_check, .icon_update {
  font-family: 'IconsLogin';
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon_lock_alt:before {
  content: "\7e";
}

.icon_profile:before {
  content: "\e08a";
}

.icon_key:before {
  content: "\e06e";
}

.icon_key_alt:before {
  content: "\e001";
}

.icon_mail:before {
  content: "\e076";
}

.icon_id:before {
  content: "\e0e0";
}

.icon_blocked:before {
  content: "\e02a";
}

.icon_check:before {
  content: "\e063";
}

.icon_update:before {
	content: "\e052";
}