body {
    background-image: url("resources/houses.png");
    background-size: cover;
    margin-left: 100px;
    margin-right: 100px;
}

h4 {
    color: yellow;
}

/* Grid: 3 per row, auto-wrap */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1rem;
}

.card {
  display: flex;
  flex-direction: column;
  height: 320px;

  overflow: hidden;

  background-image: url("resources/panelbg.png");
  background-size: cover;
  background-position: center;
  box-shadow: -10px 10px 10px rgba(0, 0, 0, .75);

}


/* Fixed header */
.card-header {
  padding: 0.75rem 1rem;
  font-weight: bold;
  border-bottom: 1px solid #ffffff;
  background: #ffffff;
}

/* Scrollable area */
.card-body {
  flex: 1;
  overflow-y: auto;
  padding: 0.5rem;
}

/* Individual link items */
.item {
  display: block;
  padding: 0.5rem;
  margin-bottom: 0.5rem;
  text-decoration: none;
  color: inherit;
  background-color: black;
}

.item:hover {
  background: #0000005e;
}

.item h4 {
  margin: 0 0 0.25rem;
  font-size: 0.95rem;
}

.item p {
  margin: 0;
  font-size: 0.8rem;
  color: #ffffff;
}