@media screen and (min-width: 1200px){
    a.navbar-brand .site-name{
        font-size: 1.5rem;
        font-weight: 500;
        color: var(--main-white);
        line-height: 1.5rem;
    }
}

@media screen and (max-width: 991px) {
    .sidebar {
        width: 100%;
    }
    .widget.posts-list {
        text-align: center;
    }

    .widget.posts-list img {
        width: 250px;
        aspect-ratio: 4/3;
    }
    a.navbar-brand .site-name{
        font-size: 1rem;
        line-height: 1.5rem;
    }
    a.navbar-brand .site-description{
        font-size: 0.7rem;

        line-height: 1.5rem;
    }
    h1 {
        font-size: 1.6rem;
        margin-bottom: 0.55rem;
    }
    h2 {
        font-size: calc(1rem + .9vw);
    }
}

@media screen and (max-width: 767px) {
    #mainMenu.active {
        width: 100%;
        left: 0;
    }
}