Fix header bar display issues

src/Packagist/WebBundle/Resources/public/css/main.css

@@ -84,10 +84,9 @@ strong {
     left: 0;
     right: 0;
     top: 0;
-    z-index: 10;
+    z-index: 15;
     background: #2d2d32;
-    min-height: 64px;
-    border-bottom: 5px solid #f28d1a;
+    min-height: 59px;
 }
 
 .navbar {

src/Packagist/WebBundle/Resources/views/Web/searchForm.html.twig

@@ -1,13 +1,13 @@
 <form id="search-form" action="{{ path('search.ajax') }}" method="GET" {{ form_enctype(searchForm) }} autocomplete="off">
     <div class="{% if orderBys is defined %}sortable{% endif %} row">
         <div class="hidden">{{ form_errors(searchForm.query) }}</div>
-        <div class="{% if searchForm.vars.value.query is empty %}col-xs-12{% else %}col-xs-8{% endif %} js-search-field-wrapper col-sm-9">
+        <div class="{% if searchForm.vars.value.query is empty %}col-xs-12{% else %}col-xs-8{% endif %} js-search-field-wrapper col-md-9">
             {{ form_widget(searchForm.query, {'attr': {'autocomplete': 'off', 'placeholder': 'Search packages...', 'tabindex': 1}}) }}
         </div>
 
         {% set hasActiveOrderBy = false %}
         {% spaceless %}
-        <div id="order-bys-wrapper" class="col-xs-4 col-sm-3 col-lg-2{% if searchForm.vars.value.query is empty %} hidden{% endif %}">
+        <div id="order-bys-wrapper" class="col-xs-4 col-md-3 col-lg-2{% if searchForm.vars.value.query is empty %} hidden{% endif %}">
             {% for sort, param in orderBys %}
                 <a title="{{ param.title }}" href="{{ param.href }}" class="order-by-group">
                     <i class="glyphicon {{ param.class }}{% if param.arrowClass is not empty %} active{% endif %}"></i>