/************************************************************
*************************************************************
*******************     SQUAT THEME     *********************
********** Javascript-free attempt at a better web **********
*************************************************************
************************************************************/

/* Menu widget styles */
.widget-menu {
    width: 100%; white-space: nowrap; box-sizing: border-box;
    ul {
        list-style: none; margin: 0; padding: 0;
        display: inline-block; 
        @media screen and (max-width: 62em) { display: none; }
        li { display: inline-block; padding: 0; margin: 0; position: relative; }
    }
}


#menu-nav-main { text-align: center; font-size: 1.2rem; }
.pure-menu-link, .pure-menu-open { display: block; padding: 0.5em 1em; }
#menu-nav-main .pure-menu-children { left: 50% !important; transform: translateX(-50%); }

.pure-menu-open {
    display: none;
    @media screen and (max-width: 62em) {
        display: block;
        &:target {
            display: none;
            & ~ .pure-menu-close { display: inline-block; }
            & ~ ul {
                display: block;
                li { display: block; position: relative; }
            }
        }
    }
}

/* Making pureCSS menu responsive without Javascript */
.pure-menu-close { display: none; }