#index {
    display: grid;
    grid-template-areas:
        "logo       logo       cart"
        "menu       menu       menu"
        "lang       search     login"
        "cp-link    content    content"
        "catalog    content    content"
        "subscribe  content    content"
        "footer     footer     footer";
    grid-template-columns: 250px 1fr auto;
    grid-template-rows: auto auto auto min-content min-content 1fr auto;
    min-height: 100vh;
    --gap: 1em;


    & > .logo {
        grid-area: logo;
        margin: auto;
    }

    & > .cart {
        grid-area: cart;
    }

    & > #main_menu {
        grid-area: menu;
        padding: var(--gap) 0 ;
    }

    & > #languages {
        grid-area: lang;
    }

    & > #search_form {
        grid-area: search;
    }

    & > .login-area {
        grid-area: login;
    }

    & > #languages, & > #search_form, & > .login-area{
        padding: var(--gap);
        border-bottom: 1px solid #CCCCCC;
    }

    & > #catalog {
        grid-area: catalog;
        padding: var(--gap);
        border-right: 1px solid #CCCCCC;
    }

    & > .collective-purchase-link {
        grid-area: cp-link;
    }

    & > .subscribe-area {
        grid-area: subscribe;
    }

    & > .content-area {
        grid-area: content;
        padding: var(--gap);
    }

    & > #footer {
        grid-area: footer;
        padding: var(--gap);
        border-top: 1px solid #CCCCCC;
    }
}



#index.no-sidebar {
    grid-template-areas:
        "logo       logo       cart"
        "menu       menu       menu"
        "lang       search     login"
        "content    content    content"
        "footer     footer     footer";
    grid-template-rows: auto auto auto 1fr auto;
}