/* S1: 1 column */
@media (max-width: 949px)
{
    .illuminati-s1 {
        display: none;
        visibility: hidden;
    }

    #grid-layout {
        grid-template-columns: 1fr;
        grid-template-areas: "header"
                             "main"
                             "footer";
        max-width: 640px;
    }

    #item-header{
        padding: 0 1rem;
    }

    #item-nav{
        grid-area: main;
        width: 100%;
        max-width: 640px;
        height: 100%;
        max-height: 0;
        transition:max-height 0.25s ease-out;

        a.nav-link > div{
            justify-content: center;
        }
    }
}

/* SS1: 1 or 2 columns */
@media (max-width: 1199px)
{
    .ss1-margin-auto{
        margin-left: auto;
        margin-right: auto;
    }

    .ss1-max-width-350{
        max-width: 350px;
    }

    #item-header{
        justify-content: space-between;
    }

    #item-user{
        grid-area: main;
        width: 100%;
        max-width: 640px;
        height: 100%;
        max-height: 0;
        transition:max-height 0.25s ease-out;
    }
}

/* SS2: 2 or 3 columns */
@media (min-width: 950px)
{
    #item-nav
    {
        grid-area: nav;
        padding-right: 2rem;
        width: 280px;
        height: max-content;
    }

    /* S2: 2 columns */
    @media (max-width: 1199px)
    {
        #grid-layout
        {
            grid-template-columns: 280px 640px;
            grid-template-areas: ". header"
                             "nav main"
                             ". footer";
            max-width: 920px;
        }

        header > button:first-child {
            display: none;
        }
    }

    /* S3: 3 columns */
    @media (min-width: 1200px)
    {
        #grid-layout
        {
            grid-template-columns: 280px 640px 280px;
            grid-template-areas: ". header ."
                             "nav main user"
                             ". footer .";
            max-width: 1200px;
        }

        #item-header
        {
            justify-content: center;
        }

        #item-user
        {
            grid-area: user;
            padding-left: 2rem;
            width: 280px;
            height: max-content;
        }

        header > button {
            display: none;
        }
    }
}


@media (min-width: 590px) {
    .big-order--1 {
        order: -1;
    }
}

@media (max-width: 589px) {
    .mini-f-column {
        flex-direction: column;
    }
    .mini-mb-1 {
        margin-bottom: 1rem;
    }
    .mini-mr-0 {
        margin-right: 0;
    }
    .mini-ml-0 {
        margin-left: 0;
    }
}

@media (min-width: 500px) {
    .illuminati-greater-500 {
        display: none;
        visibility: hidden;
    }
}

@media (max-width: 499px) {
    .illuminati-less-500 {
        display: none;
        visibility: hidden;
    }
}

@media (max-width: 369px) {
    .mini-font-23 {
        font-size: 2.3rem
    }
}

@media print {
    .illuminati-print {
        display: none !important;
        visibility: hidden !important;
    }
}