h1 {
    color: #777777;
}


.alert {
   width:40%;    
}

body { padding-bottom: 70px; }

.grid-item {
    float: left;
    border-radius: 15px;
    padding: 5px;
    margin: 10px;

}

.card {
    width: 22rem;
}

.caption {

    max-width: 22rem;
}

.card-text {
    word-wrap: break-word;
    padding: .5rem;
}

.img-thumbnail {
    width: 22rem;
}

.img-detail {
    max-width: 60rem;
}

.title-link {
  color: inherit;       /* keeps the text color of the parent */
  text-decoration: none; /* removes underline */
  cursor: pointer;      /* shows it's clickable */
}
.title-link:hover {
  text-decoration: underline; /* optional hover effect */
}

.card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  border-radius: 0.75rem;
}

.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.1);
}

.card-title a:hover {
  color: #007bff;
}

.like-btn {
  cursor: pointer;
  font-size: 1.2rem;
}

.text-muted.small {
  color: #6c757d !important;
}