Overriding properties in CSS

While working on the design of my site using Twitter's bootstrap, I had a hard time resizing the height of the search box, which due to a strange reason was looking much smaller than it should.
The first thing I tried was making my own CSS file and make a class style.css . However even after adding that class to my search box div, there was no change. This is because the class contained within the bootstrap.css is more specific. To enforce a change however all that needs to be done is add !important following the property in css. As an example :-
.search
{ height: 28px !important; }