#nav-bar.hide-border {
    border-bottom: none;
}

#main h1 {
    margin-bottom: 0.35rem;
    padding: 0 1rem;
}

#all-source>.bi,
#search>.bi,
#search2>.bi {
    height: 1rem;
}

.sub-version {
    margin-left: 1em;
}

.suggestion {
    padding: 1rem 1rem 1rem 0;
    margin-left: 1rem;
    font-size: 1.1rem;
    border-bottom: 0.1px solid var(--color-separator);
}

.suggestion .bi {
    margin-right: 4px;
}

@media (hover:hover) {
    .suggestions:hover {
        opacity: 0.75;
    }
}

@media (prefers-color-scheme: dark) {
    #main input {
        background-color: rgba(255, 255, 255, 0.07);
        color: white;
    }

    .suggestions {
        border-bottom: 0.1px solid var(--color-separator-dark) !important;
    }
}

#suggestions,
#suggestions2 {
    display: grid;
    max-width: 768px;
    overflow-x: scroll;
    grid-template-columns: repeat(10, 3fr);
    grid-template-rows: repeat(3, 1fr);
    scroll-snap-type: x mandatory;
    grid-auto-columns: 100vw;
    scroll-behavior: smooth;
    cursor: grab;
    grid-auto-flow: column;
}
#suggestions .active,
#suggestions2 .active{
	cursor: grabbing;
} 
#suggestions>div, #suggestions2>div {
    scroll-snap-align: start;
}
#suggestions, #suggestions2 {
  user-select: none; 
  -webkit-user-drag: none;
}


.app-header-container {
    min-width: calc(100vw - 1rem);
}