@import url("/resources/font/roboto/css/roboto.css");
@import url("/resources/stils/shared.css");
* {
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
  font-family: "Roboto", sans-serif;
  font-size: 13px;
}

:root {
  font: "Roboto", sans-serif;
}

body, html, form, .wrapper, .container-fluid, .container-fluid > .row {
  height: 100%;
}

.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
.wrapper section {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.wrapper section.form {
  width: 480px;
}
.wrapper section.form ul {
  width: 100%;
}
.wrapper section.form ul h1 {
  color: #000;
  font-size: 1.7em;
}
.wrapper section.form ul li {
  position: relative;
}
.wrapper section.form ul li.alert {
  display: none;
  font-weight: 500;
}
.wrapper section.form ul li.alert div {
  border-radius: 10px;
  padding: 1em;
}
.wrapper section.form ul li.alert div.success {
  border: 1px solid #BFE6CD;
  background: #D0EDDA;
  color: #00591F;
}
.wrapper section.form ul li.alert div.error {
  border: 1px solid #F9C5CB;
  background: #FBD5D9;
  color: #760B18;
}
.wrapper section.form ul li:not(:last-child) {
  margin-bottom: 1.5rem;
}
.wrapper section.form ul li div.error input {
  border-color: #999;
}
.wrapper section.form ul li div input {
  padding: 0 0 0 55px;
  height: 60px;
  border: 1px solid #ededed;
  transition: 300ms;
  width: 100%;
  border-radius: 10px;
  cursor: auto;
  font-size: 14px;
}
.wrapper section.form ul li div input:focus, .wrapper section.form ul li div input:active {
  /*background: #fcfcfc;
  border-color: #cfcfcf;*/
}
.wrapper section.form ul li div input:focus i, .wrapper section.form ul li div input:active i {
  color: #999;
}
.wrapper section.form ul li div input::placeholder {
  color: #ddd;
  padding-left: 0.5em;
}
.wrapper section.form ul li div small, .wrapper section.form ul li div i {
  position: absolute;
  pointer-events: none;
}
.wrapper section.form ul li div small {
  left: 45px;
  top: -7px;
  background: #fff;
  padding: 0 1em;
  color: #666;
}
.wrapper section.form ul li div i {
  width: 60px;
  height: 60px;
  left: 0;
  top: 0;
  font-size: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #b9b5b5;
}
.wrapper section.form ul li button {
  background: #333;
  border-radius: 20px;
  padding: 1.5em 2.5em;
  width: 100%;
  margin-top: 3em;
}
.wrapper section.form ul li button:hover {
  background: #41b983;
  box-shadow: 0 14px 26px -12px #333;
}
.wrapper section.form ul li button span, .wrapper section.form ul li button i {
  color: #fff;
}
.wrapper section.form ul li button i {
  font-size: 20px;
  margin-left: 10px;
}