Google custon search box display on apple conputers

Hi all, I use this code to display a google custom search box in my side bar;

<?php
/**
 * @package WordPress
 * @subpackage Constructor
 */
?>
	<ul>

		<?php 	/* Widgetized sidebar, if you have the plugin installed. */
				if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar') ) : ?>

        <?php if (!is_404()) : ?>
	    <li>

<style type="text/css">
@import url(http://www.google.com/cse/api/branding.css);
</style>
<div class="cse-branding-bottom" style="background-color:#FFFFFF;color:#000000">
  <div class="cse-branding-form">
    <form action="http://www.google.com/cse" id="cse-search-box" target="_blank">
      <div>
        <input type="hidden" name="cx" value="partner-pub-0877470817592706:nioda6b29iw" />
        <input type="hidden" name="ie" value="ISO-8859-1" />
        <input type="text" name="q" size="31" />
        <input type="submit" name="sa" value="Search" />
      </div>
    </form>
  </div>
  <div class="cse-branding-logo">
    <img src="http://www.google.com/images/poweredby_transparent/poweredby_FFFFFF.gif" alt="Google" />
  </div>
  <div class="cse-branding-text">
    Custom Search
  </div>
</div>

		</li>
		<?php endif; ?>

		<?php wp_list_pages('title_li=<h3>'.__('Pages', 'constructor').'</h3>' ); ?>

		<?php wp_list_categories('show_count=1&title_li=<h3>'.__('Categories', 'constructor').'</h3>'); ?>

        <li><h3><?php _e('Tags', 'constructor')?></h3>
    	    <?php if(function_exists('wp_tag_cloud')) { wp_tag_cloud('smallest=8&largest=18&number=40'); } ?>

The problem is that when viewed on a PC it displays fine but when viewed on an apple PC in either safari of firefox the search entry box is larger and extend out of the border.

I’m not sure how to approach this – does anyone have any ideas?

My Site: http://www.loadscreen.net