/* Bootstrap 4 visual compatibility for the Bootstrap 5 migration. */
:root {
  --bs-primary: #007bff;
  --bs-link-color: #007bff;
  --bs-link-hover-color: #0056b3;
  --bs-border-radius: .25rem;
  --bs-border-radius-sm: .2rem;
  --bs-border-radius-lg: .3rem;
}

body {
  color: #212529;
}

a {
  color: #007bff;
}

a:hover {
  color: #0056b3;
}

.navbar {
  padding: .5rem 1rem;
}

.navbar.bg-dark {
  background-color: #343a40 !important;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #007bff;
  --bs-btn-border-color: #007bff;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #0069d9;
  --bs-btn-hover-border-color: #0062cc;
  --bs-btn-active-bg: #0062cc;
  --bs-btn-active-border-color: #005cbf;
}

.jumbotron {
  min-height: 280px;
  margin-bottom: 2rem;
  padding: 4rem 2rem;
  display: flex;
  align-items: center;
}

.jumbotron + .container {
  margin-top: 0;
}

.project-preview .row > .col,
.project-list .row > .col {
  display: flex;
  margin-bottom: 1.5rem;
}

.project-card {
  width: 100%;
  height: 100%;
}

.project-card .card-body {
  display: flex;
  flex-direction: column;
}

.project-card .card-title {
  min-height: 3rem;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.project-card .card-subtitle {
  min-height: 1.5rem;
}

.project-card .crop {
  flex: 0 0 auto;
}

.project-card .card-text {
  flex-grow: 1;
}

.project-card .btn {
  align-self: flex-end;
  margin-top: auto;
}

@media (max-width: 767.98px) {
  .jumbotron {
    min-height: 220px;
    padding: 3rem 1rem;
  }
}