html {
    font-size: 20px;
}

.social img {
        padding: 1rem 0.2rem 0.2rem 0rem;
        transition: filter 0.3s ease;
        width: 35px !important;
        height: 35px !important;
}

.socials .social:hover img {
    transform: scale(1.2);
}

.left-nav > .logo{
    img {
        transition: filter 0.6s ease;
        width: 80px !important;
        height: 80px !important;
    }
    img:hover {
        filter: hue-rotate(15deg);
        transform: scale(1.2);
    }
}

.right-nav {
    padding: 0.5rem;
}

nav {
    background-color: var(--bg-1);
    border-radius: 1.2rem;
}

.search-button {
    transform: scale(1.5);
    margin-right: 1rem;
}

.search-button:hover {
    transform: scale(2.0);
    background-color: var(--text-2);
    border-radius: 99999px;
}

.filter-primary {
    filter: invert(88%) sepia(27%) saturate(5859%) hue-rotate(186deg) brightness(83%) contrast(106%);
}