/* Custom Tiles */

.resources-section {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
  gap: 24px;
  padding-bottom: 25px;
}

.resource-card {
  background: #000000;
  border-radius: 12px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
  
.resource-card a {
  text-decoration: none;
  color: inherit; /* keeps title color */
}
  
.resource-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

.resource-card img {
  width: 254px;
  height: 180px;
  object-fit: cover;
  display: block;
}

.resource-title {
  padding: 14px;
  font-size: 14px;
  font-weight: 600;
  color: #ffffff; /*  -ish blue */
  text-align: center;
  background: #000000;
}




/* Custum SEARCH BAR */
 
.searchBar {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 0px 0px;
}

.searchBarFullWidth {
    background-color: #000
}

#connectSearch {
    width: 80%;
    font-size: 16x;
    color: #000;
    padding: 0px 0px 0px 10px;
    border: 1px solid #000
}

#connectSearch::placeholder {
    font-style: italic;
}

#searchButton {
    width: 20%;
    border: 1px solid #045376;
    background-color: #01d9c1;
    color: #000;
    font-size: 16x;
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    border-radius: .5rem;
}

#searchButton:hover {
    cursor: pointer;
}