.login-card {
  margin: 15px auto;
}

.btn {
  background-color: #d18336;
}

.btm input {
  color: white !important;
}

.btn input:focus {
  box-shadow: unset !important;
}


.logo-wrapper {
  text-align: center;
  position: relative;
}

.logo-wrapper .verth-logo {
  width: 300px;
  height: 175px;
  margin: 0 auto;
}


.login-background {
  width: 100%;
  height: 100%;
  background-image: url("login-background-722df4ec396d53ff4c93d13a61b2cea1.jpg") !important;
  background-size: cover;
}

.login-background::before {
  position: absolute;
  content: " ";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 0;
  background-color: rgba(55,52,53,0.86);
  animation: fadeBackground 2s linear;
}

.login-message {
  color: orangered;
  margin: 15px;
}

.fade-in {
  opacity: 1;
  animation-name: fadeInOpacity;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  animation-duration: 500ms;
}

@keyframes fadeInOpacity {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

.fadeBackground {
  opacity: 1;
  animation-name: fadeBackground;
  animation-iteration-count: 1;
  animation-timing-function: ease-in;
  animation-duration: 2s;
}

@keyframes fadeBackground {
  0% {
    background-color: #373435;
  }
  50% {
    background-color: #373435;
  }
  100% {
    background-color: rgba(55,52,53,0.86);;
  }
}