Footer Responsive Layout

Site URL: https://pte.squarespace.com/

I managed to get the footer looking great for desktop, but can someone please help me clean up the look for Mobile (767 px). I would simply like to stack the Page Links off to the right side, mirroring the Part Time Evil Logo. 

Example: (Preferably the Part Time Evil logo and the About Link start on the same line.)

PART TIME EVIL                                                                                                                                                                                                           

^ABOUT

^WORK

^BLOG

^CAREERS

^CONTACT

I made the page links in a Code Block and attached a class = "menuop" for the buttons so they can be manipulated. I'm just having trouble getting the links to stack correctly and fitting the Part Time Evil logo next to the stacked page links. All of my custom CSS is at the very bottom of the Custom CSS window. (As well as within the code block.)

Thanks!

)

Add to Design > Custom CSS

/* Stacked mobile footer links */
@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1639082713344_30712 h4 {
    display: flex;
    flex-direction: column;
}
a.menuop {
    margin-top: 5px;
    margin-bottom: 5px;
}
}

@tuanphan 

This is where I'm at with the footer now with the code from above. Would you be able to scoot up the menu to the Part Time evil logo so that they start on the same line? 

Thanks,

Patrick

Don't remove any code in your current code.

Add this to Design > Custom CSS

/* Footer mobile layout */
@media screen and (max-width:767px) {
div#block-fabc92ddc30f0383cfa9+.row>.col {
    width: 50% !important;
    float: left !important;
}
}