#searchbar {
    background-color: var(--searchbar-background);
    border: none;
    width: 100%;
    border-radius: 1vw;
    padding: 1vw 2vw;
    outline: none;
    font-size: 4vw;
}

#boulders a {
    display: grid;
    width: 100%;
    text-decoration: none;
    color: var(--text-color);
    grid-template-columns: fit-content(100%) auto fit-content(100%);
    gap: 2vw;
    padding: 2vw 0;
    font-size: 3.5vw;
}

#boulders a img {
    aspect-ratio: 1;
    height: 10.5vw;
}

#boulders a p {
    margin: 0;
}

#boulders a div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#boulders a .title {
    font-weight: bold;
}

#boulders a .date {
    width: fit-content;
}

#boulders a .routesetter {
    grid-column-start: 2;
}

header {
    padding-bottom: 3.5vw;
}

main {
    padding-bottom: 16vw;
}

footer {
    display: flex;
    justify-content: center;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 3.5vw;
}

#new-boulder {
    aspect-ratio: 1;
    display: block;
    height: 12vw;
    filter: drop-shadow(0 0 1vw rgba(0, 0, 0, .5));
}

.project-marker {
    position: absolute;
    transform: scale(1.05);
}

/* Style for boulders that are in user's ascents */
#boulders a.completed-ascent {
    background-color: rgba(0, 182, 40, 0.2);
    border-radius: 1vw;
}