/* DARK THEME */
:not(textarea)::-webkit-scrollbar {
  width: 4px;
  height: 4px; }

::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #27292B; }

::-webkit-scrollbar-thumb {
  background: #1D1F21; }

.container:after, .login-form .username:after,
.login-form .password:after {
  content: "";
  display: table;
  clear: both; }

.login-wrapper, .login-form {
  /* Center elements */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }

.login-form .username input:focus,
.login-form .password input:focus, .login-form .btn:focus, .login-form a:focus {
  outline: lime solid thin; }

.login-wrapper, .login-form .btn, .login-form a {
  transition: all .5s ease; }

* {
  box-sizing: border-box; }

.centered {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  margin: auto; }

.centera {
  margin: auto; }

.centerh {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto; }

.centerv {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto; }

.center {
  text-align: center !important; }

.left {
  text-align: left !important; }

.right {
  text-align: right !important; }

.justify {
  text-align: justify !important; }

.fleft {
  float: left !important; }

.fright {
  float: right !important; }

.clear {
  clear: both; }

.vtop {
  vertical-align: top !important; }

.vmid {
  vertical-align: middle !important; }

.nopad {
  padding: 0 !important; }

.pad {
  padding: 1vw !important; }

.nomargin {
  margin: 0 !important; }

.margin {
  margin: 1vw !important; }

.marginh {
  margin-left: 1vw !important;
  margin-right: 1vw !important; }

.marginv {
  margin-top: 1vw !important;
  margin-bottom: 1vw !important; }

.full {
  width: 100%; }

.half {
  width: 50%; }

.fullh {
  height: 100%; }

.fullvw {
  width: 100vw; }

.halfvw {
  width: 50vw; }

.fullvh {
  height: 100vh; }

.halfvh {
  height: 50vh; }

.strong {
  font-weight: bold !important; }

.lcase {
  text-transform: lowercase; }

.ucase {
  text-transform: uppercase; }

.ccase {
  text-transform: capitalize; }

.hidden {
  display: none; }

.invisible {
  visibility: hidden; }

.absolute {
  position: absolute; }

.relative {
  position: relative; }

.round {
  border-radius: 4px; }

.nowrap {
  white-space: nowrap; }

.overflow {
  overflow: auto; }

.overhid {
  overflow: hidden; }

.inline {
  display: inline-block; }

.block {
  display: block; }

.noselect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.blur {
  filter: blur(8px);
  -webkit-filter: blur(8px); }

.fa {
  font-style: normal; }

#m2d2-alert .m2d2-alert-front {
  min-width: 400px;
  min-height: 100px;
  max-width: 70%;
  background-color: #000000;
  border: 1px solid #54C1E3;
  outline: 2px solid #000000;
  color: white;
  padding: 10px;
  box-shadow: 0 0 5px 1px #000;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column; }
  #m2d2-alert .m2d2-alert-front.question::before {
    color: #54C1E3;
    font-size: 200%;
    margin: 10px; }
  #m2d2-alert .m2d2-alert-front.ok::before {
    color: #59BEA0;
    font-size: 200%;
    margin: 10px; }
  #m2d2-alert .m2d2-alert-front.input::before {
    color: #F3863D;
    font-size: 200%;
    margin: 10px; }
  #m2d2-alert .m2d2-alert-front.wait::before {
    color: white;
    font-size: 200%;
    margin: 10px;
    display: block; }
  #m2d2-alert .m2d2-alert-front.error::before {
    color: #F06D65;
    font-size: 200%;
    margin: 10px; }
  #m2d2-alert .m2d2-alert-front.info::before {
    color: #F3863D;
    font-size: 200%;
    margin: 10px; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-title {
    font-size: 200%;
    text-align: center;
    line-height: 40px; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-text {
    line-height: 40px;
    text-align: center;
    width: 100%; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field {
    border: 0; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field,
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field input,
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field textarea {
    max-width: 100%; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field p * {
    vertical-align: top; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-field span {
    text-align: left; }
  #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons {
    padding: 10px;
    width: 100%; }
    #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons button {
      min-width: 100px;
      font-size: 28px;
      border-radius: 10px; }
    #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .ok, #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .yes, #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .send, #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .save, #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .print {
      float: right;
      background-color: #54C1E3;
      color: #EEE; }
    #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .no, #m2d2-alert .m2d2-alert-front .m2d2-alert-buttons .cancel {
      float: left;
      background-color: #F06D65;
      color: #EEE; }

#m2d2-alert .m2d2-alert-back {
  position: fixed !important;
  z-index: 10000; }

@keyframes popup {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.4); }
  60% {
    transform: scale(1.1); }
  70% {
    transform: scale(1.2); }
  80% {
    transform: scale(1); }
  90% {
    transform: scale(1.1); }
  100% {
    transform: scale(1); } }

@keyframes vanish {
  0% {
    transform: scale(1); }
  20% {
    transform: scale(1.4); }
  100% {
    transform: scale(0); } }

.popup {
  animation: popup 0.7s; }

.vanish {
  animation: vanish 0.5s; }

*,
*:before,
*:after {
  box-sizing: border-box; }

body {
  font-size: 1em;
  line-height: 1.4;
  background: #1f2226; }

.container {
  max-width: 760px;
  margin: 0 auto; }

.login-wrapper {
  width: 320px;
  height: 320px;
  background-position: center center;
  background-size: cover; }
  @media (min-width: 484px) {
    .login-wrapper {
      width: 484px;
      height: 484px; } }

.login-form {
  z-index: 1;
  width: 100%;
  max-width: 380px;
  width: 100%;
  padding: 0 20px; }
  .login-form .password {
    margin-top: 20px; }
  .login-form .username label,
  .login-form .password label {
    float: left;
    display: block;
    width: 15%;
    height: 55px;
    text-align: center; }
    .login-form .username label span,
    .login-form .password label span {
      line-height: 55px;
      vertical-align: middle; }
      .login-form .username label span span:hover,
      .login-form .password label span span:hover {
        color: #EA4D88;
        cursor: pointer; }
  .login-form .username input,
  .login-form .password input {
    float: right;
    display: block;
    width: 85%;
    height: 55px;
    padding: 15px 20px; }
  .login-form .btn {
    width: 100%;
    height: 55px;
    margin: 26px 0 20px; }
  .login-form p span {
    padding-left: 5px; }
  @media (min-width: 380px) {
    .login-form {
      padding: 0; } }

.login-form .username label,
.login-form .password label {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  background-color: #363b41;
  background-color: rgba(54, 59, 65, 0.8); }
  .login-form .username label span,
  .login-form .password label span {
    font-size: 28px;
    color: #606468; }

.login-form .username input,
.login-form .password input {
  border: none;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  background-color: #3b4148;
  background-color: rgba(59, 65, 72, 0.8);
  color: white; }
  .login-form .username input::placeholder,
  .login-form .password input::placeholder {
    color: #787e83; }

.login-form .btn {
  cursor: pointer;
  font-size: 20px;
  font-weight: 400;
  letter-spacing: 2px;
  text-transform: uppercase;
  border: none;
  border-radius: 4px;
  background-color: #EA4D88;
  background-color: rgba(234, 77, 136, 0.8);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  color: white; }
  .login-form .btn:hover {
    background-color: #e73679;
    background-color: rgba(231, 54, 121, 0.9); }

.login-form a {
  font-weight: 300;
  text-decoration: none;
  color: #EEE; }
  .login-form a:hover {
    color: gray; }

.login-form p {
  margin: 0;
  text-align: center;
  color: #606469; }

/*# sourceMappingURL=login.min.css.map */