:root {
  --primary-color: 115, 44, 37;
  --primary-color-dark: 69, 26, 22;
  --white-color: #fff;
}

* {
  outline: none;
}

a {
  text-decoration: none;
  color: inherit;
}

a:hover {
  color: rgb(var(--primary-color));
}

.alert {
  position: absolute;
  top: 25px;
  right: 25px;
  
  max-width: 400px;
}

.btn-close:focus {
  box-shadow: none;
}

.btn-primary {
  color: var(--white-color);
  background-color: transparent;
  border-color: var(--white-color);
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
  color: var(--white-color);
  background-color: rgb(var(--primary-color-dark));
  border-color: var(--white-color);
}

.btn-primary:focus {
  box-shadow: 0 0 0 0.25rem rgba(var(--primary-color), 0.5);
}

.logo {
  max-width: 250px;
  margin-bottom: 25px;

  filter: brightness(100);
}

.title {
  text-transform: uppercase;
  font-weight: 600;
  font-size: 52px;
}

.center-box {
  display: flex;
  min-height: calc(100vh - 169.2px);

  padding: 25px 0;

  align-items: center;
  justify-content: center;
  flex-direction: column;

  background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url('../images/background.jpg') center no-repeat;
  background-size: cover;
}

@media only screen and (max-width: 640px) {
  div.w-100 {
    width: 100vw !important;
  }

  .row > div {
    margin-bottom: 1rem;
  }
}