body {
    background-color: rgba(var(--color-bgdark));
}




.browser-container #header {
    margin-bottom: -74px;
}

.browser-container #header:before {
    background-image:var(--texture-theme);
}

.browser-container #header .header-container {
    padding-top:150px;
}

.browser-container #header .header-container p {
    color:rgba(var(--color-textdark));
    text-align: center;
}

.browser-container #header h1 {
    text-align: center;
    color:rgba(var(--color-theme));
    text-transform: uppercase;
    font-size: 3rem;
    padding: 0 20px
}

@media (max-width:1000px) {   

    .browser-container #header h1 {
        font-size: 2rem;
    }
}





.browser-container #search {
    position: sticky;
    top:60px;
    z-index: 1;
    backdrop-filter: blur(10px);
    background-color:rgba(var(--color-bgdark),0.9);
    padding:20px 0;
    display: flex;
    flex-direction: column;
    grid-gap:10px;
}

@media(max-width:1000px) {
    .browser-container #search {
        top:51px;
    }
}

.browser-container #search .autoscroll-container {
    display: none;
}

.browser-container #search .search-container input:placeholder-shown + .autoscroll-container {
    display: block;
}

.browser-container #search .search-container {
    position: relative;
}

.browser-container #search-clear {
    cursor: pointer;
}


.browser-container #search-filter {
    cursor: pointer;
}

.browser-container #filter .filter-item {
    margin: 0 20px 20px 20px;
    display: flex;
    flex-direction: column;
    grid-gap:10px
}

.browser-container #filter h3 {
    font-weight: bold;
    font-size: 1.5rem;
}

.browser-container #filter label:hover {
    color: rgba(var(--color-theme));
    cursor: pointer;
}

.browser-container #filter label span {
    translate: 0 0.1rem;
}







.browser-container #result {
    padding:100px 0;
    margin:0;
    color:rgba(var(--color-textlight))
}

.browser-container [id^="result-"] > div:first-child .button-container {  
    font-size: 0.8rem;
    border-radius: 50px;
    padding: 5px 10px;
    grid-gap: 0;
}

.browser-container #result .button-container span {  
    translate:0
}

.browser-container [id^="result-"] {
    max-height: calc(69px + 200px);
    overflow: hidden;
}

.browser-container [id^="result-"].activated {
    max-height: none !important;
}

.browser-container #result .loader-game {
    flex:none
}

.browser-container .result-container > p {
    width: 100%;
    text-align: center;
    color:rgba(var(--color-textdark))
}

.browser-container .load-container .button-container.activated iconify-icon {
    display: none;
}


.browser-container #result-token .token-container {
    width:224px
}