/* Start by setting display:none to make this hidden. Then we position it in relation to the viewport window  with position:fixed. Width, height, top and left speak  for themselves. Background we set to 80% white with our animation centered, and no-repeating */
.modal {
    display:    none;  position:   fixed;  z-index:    1000;  top:        182px;  left:       0;      
    height:     100%;  width:      100%;  
    background: rgba( 255, 255, 255, .8 )     url('http://i.stack.imgur.com/FhHRx.gif')                50% 30%                no-repeat;
}

/* When the body has the loading class, we turn the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}
    .autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; }
    .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
    .autocomplete-selected { background: #F0F0F0; }
    .autocomplete-suggestions strong { font-weight: normal; color: #3399FF; }
    .autocomplete-group { padding: 2px 5px; }
    .autocomplete-group strong { display: block; border-bottom: 1px solid #000; }

input[type="search"] {
 -webkit-box-sizing: content-box;
 -moz-box-sizing: content-box;
 box-sizing: content-box;
 -webkit-appearance: searchfield;
}

input[type="search"]::-webkit-search-cancel-button {
-webkit-appearance: searchfield-cancel-button;
}