html - Google custom search customizing -

i know there many posts on subject reading through them , testing out code not issue i'm having. i'm trying make search box smaller in size can add menu bar. i'm able make search box smaller button far input box. tried changing widths of "td" tag row , didn't fix it. i'm doing testing on regular aspx page till configured correctly add master page.

test.aspx

<asp:content id="content2" contentplaceholderid="contentplaceholder1" runat="server">   <script type="text/javascript">     (function () {       var cx = '##############################';       var gcse = document.createelement('script');       gcse.type = 'text/javascript';       gcse.async = true;       gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;       var s = document.getelementsbytagname('script')[0];       s.parentnode.insertbefore(gcse, s);     })();       </script>     <gcse:searchbox-only></gcse:searchbox-only>     </asp:content> 

css

.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2  {   height: 15px !important;   margin-top: 0 !important;   min-width: 13px !important;   padding: 5px 5px !important;   width: 20px !important;     }  input.gsc-input {       width:180px !important;       font-family:verdana, geneva, 'dejavu sans', sans-serif !important;   font-size:x-small !important;   color:purple !important; }  td.gsc-input  {       width:180px !important;     }  .gsc-input-box, .gsc-input-box-hover, .gsc-input-box-focus  {   border-color: #00ff90 !important;   width:200px !important; }  table.gsc-search-box  {   border-spacing: 0 0  !important; }  

i have searched , looked @ many articles , i'm still unable correct combination of changes make display correctly. thank you.