Osclass Wizards theme Footer link formatting issue (on mobile)

[jeff77789]

This is how the footer shows up on mobile:




This is how the footer shows up on a desktop:



Here is the code in footer.php:

Code: [Select]

<ul>
        <?php if( osc_users_enabled() ) { ?>
        <?php if( osc_is_web_user_logged_in() ) { ?>
        <li> <?php echo sprintf(__('Hi %s', OSCLASSWIZARDS_THEME_FOLDER), osc_logged_user_name() . '!'); ?> &#10072; <strong><a href="<?php echo osc_user_dashboard_url(); ?>">
          <?php _e('My account', OSCLASSWIZARDS_THEME_FOLDER); ?>
          </a></strong> <a href="<?php echo osc_user_logout_url(); ?>">
          <?php _e('Logout', OSCLASSWIZARDS_THEME_FOLDER); ?>
          </a> </li>
        <?php } else { ?>
        <li> <a href="<?php echo osc_user_login_url(); ?>">
          <?php _e('Login', OSCLASSWIZARDS_THEME_FOLDER); ?>
          </a></li>
        <?php if(osc_user_registration_enabled()) { ?>
        <li> <a href="<?php echo osc_register_account_url(); ?>">
          <?php _e('Register', OSCLASSWIZARDS_THEME_FOLDER); ?>
          </a> </li>
        <?php } ?>
        <?php } ?>
        <?php } ?>
        <?php
        osc_reset_static_pages();
        while( osc_has_static_pages() ) { ?>
        <li> <a href="<?php echo osc_static_page_url(); ?>"><?php echo osc_static_page_title(); ?></a> </li>
        <?php
        }
        ?>
        <li> <a href="<?php echo osc_contact_url(); ?>">
          <?php _e('Contact', OSCLASSWIZARDS_THEME_FOLDER); ?>
          </a> </li>
        <?php if( osc_users_enabled() || ( !osc_users_enabled() && !osc_reg_user_post() )) { ?>
        <li class = "publish"> <a href="<?php echo osc_item_post_url_in_category(); ?>">
          <?php _e("Post an item", OSCLASSWIZARDS_THEME_FOLDER);?>
          </a> </li>
        <?php } ?>
      </ul>
Here is the code (and surrounding lines) in main.css for class "publish":

Code: [Select]

.links a {display: block;font-size: 15px;font-weight: 700;text-transform: uppercase;
}
.publish {float: right;
}
.form-filters {padding: 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
}
any ideas?
Thanks!