#wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--gutter);
    height: 100vh;

    background: radial-gradient(circle at top left,
            #0E5C54 0%,
            #07322D 50%,
            #021917 100%);

    color: var(--color-white);
    position: relative;
}

#searchBar {
    padding: var(--gutter);
    /* color: var(--color-secondary); */
    width: 80%;
    border-radius: 88px;
    border: none;

    box-shadow: 0px 0px 15px -3px rgba(13, 27, 42, 0.75);
}

#result-container {
    width: 70%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%);
    margin-top: 80px;
    background: var(--color-white);
    color: var(--color-black);
    display: none;
}

#result-container #result-head {
    display: flex;
    gap: var(--margin);
    padding: var(--margin);
    /* margin-bottom: var(--margin); */
    border-bottom: 2px solid var(--color-black)
}

#result-container #result-head p {
    transform: translateY(2px);
}

#result-container .result{
    padding: var(--margin) var(--margin);
    border-bottom: 1px solid gray;
}

#result-container .result:hover{
    background: #ffffff;
}