jquery ui autocomplete result are too small

I am sure that i am missing something but don't know what. I have an jquery autocomplete field that gets data from a mysql query. I am getting the results but drop down list has a height only few pixels per result.

data i use is

[{"id":1,"name":"France","created_at":"2016-06-18 05:05:27","updated_at":"2016-06-18 05:05:27"},{"id":2,"name":"United Kingdom","created_at":"2016-06-18 05:05:38","updated_at":"2016-06-18 05:05:38"},{"id":3,"name":"Sweden","created_at":"2016-06-18 05:05:46","updated_at":"2016-06-18 05:05:46"},{"id":4,"name":"Norway","created_at":"2016-06-18 05:05:50","updated_at":"2016-06-18 05:05:50"},{"id":5,"name":"Hungary","created_at":"2016-06-18 05:05:56","updated_at":"2016-06-18 05:05:56"},{"id":6,"name":"Germany","created_at":"2016-06-18 05:06:01","updated_at":"2016-06-18 05:06:01"},{"id":7,"name":"Austria","created_at":"2016-06-18 05:06:09","updated_at":"2016-06-18 05:06:09"},{"id":8,"name":"Slovakia","created_at":"2016-06-18 05:06:15","updated_at":"2016-06-18 05:06:15"},{"id":9,"name":"Romania","created_at":"2016-06-18 05:06:22","updated_at":"2016-06-18 05:06:22"},{"id":10,"name":"Ukraine","created_at":"2016-06-18 05:06:28","updated_at":"2016-06-18 05:06:28"}]

If data is formated like this:

["France","United Kingdom","Sweden","Norway","Hungary","Germany","Austria","Slovakia","Romania","Ukraine"]

its shown as it should. Thing is i would need id field later on here is the code

<script> $(function(){
 $( "#cname" ).autocomplete({
  source: "{{url('country/complete')}}",
  minLength: 3,
  select: function(event, ui) {
    $('#cname').val(ui.item.name);
      }
   });
}); 
</script>

and

<div class="form-group">
     {!! Form::label('cname','Country')!!}
     {!! Form::text('cname', null, ['class'=>'form-control'])!!}
</div>

Here is the css and js

<!-- Styles -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js" integrity="sha384-I6F5OKECLVtK/BL+8iSLDEHowSAfUo76ZL9+kGAgTRdiByINKJaqTPH/QVNS1VDb" crossorigin="anonymous"></script>

    <style>
    body {
        font-family: 'Lato';
    }

    .fa-btn {
        margin-right: 6px;
    }
    </style>