Diseñadores Hacer responsive un menú.

<div id="subvars">
<ul>
<li><a href="/guia-laboral/">Guía Laboral</a></li>
<li><a href="/procedimiento-tributario/">Procedimiento Tributario</a> </li>
<li><a href="/excel-avanzado/">Manual de Excel</a></li>
<li><a href="/manual-macros-excel">Manual de Macros</a></li>
<li><a href="/emprendimiento-internet">Emprenda en Internet</a></li>
</ul>
<form action="/google-search" id="searchform" >
  <div>
    <input type="hidden" name="cx" value="partner-pub-5489604723721:5388146150" />
    <input type="hidden" name="cof" value="FORID:10" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" size="55" />
    </div>
</form>

<script type="text/javascript" src="http://www.google.com.co/coop/cse/brand?form=cse-search-box&lang=es"></script>

</div>

#subvars{
    background:#333F49;
	width: 100%;
    height: auto;
    margin: 0 auto 0 !important;
    padding: 0;
    overflow: hidden;
	}

#subvars ul  {
	float:left;
	margin:0;
	padding:0;
	}
#subvars ul li {
    display: inline;
    list-style: none;
    margin: 0;
    padding: 0;
	float: left;
	text-decoration: none;
	}
#subvars ul li a {
    background: #333F49;
	color: #f5f5f5;
	display: inline-block;
    font-size: 14px;   
	text-transform: none;
    margin: 0;
    padding: 10px 12px;
	}

#searchform input {
    background-image: url("lupa.png");
	background-position: right;
    background-repeat: no-repeat;
	float: right;
    width: 180px;
    height: 26px;
    padding: 1px 1px 1px 3px;
	border: 1px solid #ccc;
	color:#888;
	margin: 5px 9px 0 0 !important;
	outline:0px;
	}