div.sticky{
    top: 1.5em;
    position: sticky;
}

aside section{
    margin-top: 2em;
    border-radius: .5em;
    box-shadow: 0 2px 4px -2px #aaa;
    border: 6px #333 solid;
}

aside h2#aside-menu{
    margin: 2em auto;
    font-size: 1.2em;
    width: 90%;
    position: relative;
    padding: .5em .5em .4em;
    border-radius: 3em;
    text-align: center;
    z-index: 20;
    color: #fff;
    box-shadow: var(--shadow);
    border: 4px #fff solid;
}

aside h2#aside-menu span{
    color: inherit;
    margin-left: .5em;

}

@media screen and (min-width: 1180px){
    aside h2#aside-menu{
        margin-top: 0;
    }
}

aside h3{
    position: relative;
    text-align: center;
    padding: .5em .25em 1em;
}

.greeting .paras{
    background-color: var(--red);
}

.greeting .paras{
    padding: 1em;
}

.greeting .paras p{
    color: #fff;
}

.greeting .paras p mark,
.greeting .paras p span{
    color: inherit;
}

@media screen and (min-width: 767px){
    .greeting .paras{
        padding: 2em;
    }
}

.search-aside{
    border-color: var(--purple);
}

.search-aside h3{
    background-color: var(--purple);
}




aside ul.categories{
    display: block;
    column-count: 2;
    column-gap: 1em;
    list-style: none;
    border-radius: .25em;
}

@media screen and (min-width: 767px){
    aside ul.categories{
        column-count: 3;
    }
}

@media screen and (min-width: 1180px){
    aside ul.categories{
        column-count: 2;
    }
}

aside ul.categories li{
    break-inside: avoid;
    margin-bottom: 1em;
    list-style: none;
}

aside ul.categories li a{
    padding: 1em .25em;
    display: block;
    text-align: center;
}