If you want the nav button to display on desktop, and mobile, add this to the custom css for the theme in the admin panel.

body .ow_menu_wrap,.ow_site_panel .ow_logo {
    display: none;
}
.ow_nav_btn {
    display: block;
    opacity: 1;
}
.ow_main_menu li a span {
    display: inline-block;
    line-height: 50px;
}

Add all of this to the custom css in the admin panel.  You will have to play with the "left" px setting to find your center since it is relevant to how many items you have in the right console. Personally, if I were going to do this, I would just use the float position on the logo, and exclude the position, and left setting. This would place the logo to the right of the nav button. The logo won't show on mobile view. There is just not enough room in the site panel for it, and the console item icons.

body .ow_menu_wrap,.ow_site_panel {
    display: none;
}
.ow_nav_btn {
    display: block;
    opacity: 1;
}
.ow_main_menu li a span {
    display: inline-block;
    line-height: 50px;
}
.ow_logo {
    float: none !important;
    position: relative;
    left: 350px;
}

Thanks!! Darryl

It was awesome!

I need one more help. I want to change the blue color to different colors everywhere in the theme. Through admin panel editing is limited so how can I do it?

The below css will cover the ones that aren't in the theme customization.

h1, h2, h3, h4, h5,.ow_custom_html_widget p, .ow_regular p, ul.ow_console_dropdown .ow_console_dropdown_cont a, .ow_box_menu a, .ow_content_menu li a, .ow_footer_menu a, .ow_add_content {
    color: #2196f3; "change this to your color"
}

The console icons are svg files, and can't be changed in css. See this post to see how to change the color of the icons, and swap them out.

https://developers.oxwall.com/forum/topic/55034

Once again A great thanks!! Darryl

It was great! I need some more codes:

1. to change the color of Border circle, square of the user image.

2. to change the colors of chat box

3. to remove page header image

Avatar border. Chnge to your color.
div div .ow_lp_avatars .ow_avatar a img {
    border-top-color: #2196f3;
    border-bottom-color: #5b646a;
    border-right-color: #5b646a;
    border-left-color: #2196f3;
    -moz-border-bottom-colors: #5b646a;
    -moz-border-left-colors: #2196f3;
    -moz-border-right-colors: #5b646a;
    -moz-border-top-colors: #2196f3;
}

Remove header
.ow_header {
    display: none;
}

The only thing I added to the chat was a background color for the chat bubble. There are several other elements that can be changed, but they could also affect other areas like the message box, and messages page. You can use inspect element to find what you want to change. There youtube videos that show how to use inspect element.
.ow_chat_block .ow_dialog_item.even .ow_dialog_in_item {
    background-color: #fff176;
}
.ow_chat_block .ow_dialog_item.odd .ow_dialog_in_item {
    background-color: #42a5f5;
}

Thanks a lot!!