Mobile/Desktop media query not working on cell phone

Question

Last night I worked on making my site mobile optimized. When a user is on a device with less than 684px it should show the mobile nav div and hide the sidebar div. I have tested this as working on my computer (by shrinking chrome like an accordion). I also checked https://www.google.com/webmasters/tools/mobile-friendly/?url=www.kisnardonline.com to see my status, but it says my site is not mobile friendly(I realize my links together is likely valid/viewport too). I will make the links more spread once I get it working overall. Thanks for any help!

Here is my code(http://www.kisnardonline.com/wp-content/themes/mytheme/style.css):

#wrapper { 
    display: block;
    min-width: 684px;
    max-width: 1200px;
    width: 98%; 
    margin: 0px auto; }

@media screen and (max-width: 684px) {
    #wrapper {
        min-width: 0px;  /* show under 684px - mobile */
    }
}

#content { 
    width: 74%;
    float: right; }

@media screen and (max-width: 684px) {
    #content {
        width: 100%;  /* show under 684px - mobile */
    }
}

#mobilenav {
    display: none; 
    margin: 15px auto;
    padding: 10px 10px 10px 10px;
    border-radius:20px;
    border:3px solid #a1a1a1;
    background:#1C2939; }

@media screen and (max-width: 684px) {
    #mobilenav {
        display: block;  /* show under 684px - mobile */
    }
}

#sidebar {
    display: block;
    width: 23%;
    min-width: 170px;
    max-width: 210px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    float: left; }

@media screen and (max-width: 684px) {
    #sidebar {
        display: none; } /* hide under 684px - mobile */
}

Here is my desktop (greater than 684px view):

Here is my desktop (less than 684px view):

Here is my mobile view(Samsung Galaxy S6):

Answer 1

For responsive pages you need to add a viewport tag which tells the device how to display the content:

<meta name="viewport" content="width=device-width, initial-scale=1">

For your other question, the "request desktop site" won't work the way you have it set up. That feature is for if you have 2 separate sites(one for mobile and one for desktop). For instance the mobile site would be m.kisnardonline.com and would have different files than the desktop site.