Better bootstrap accordion

There are a few issues (things I dont like) about the bootstrap accordion:

1- The title is inline, so you have to click the text part to activate it

2- There is no indication if the item is collapsed or open

3- :hover underlining is obnoxious.

To solve all these; simply add the below css:

.panel-heading {
    padding: 0;
}
.panel-title > a {
	color: #555;
	display: block;
	padding: 0.4em 0.6em;}
.panel-title > a:hover, .panel-title > a:active { text-decoration: none; background: #eee; color:#111;}
.panel-title > a.accordion-toggle::before {
    content:"\f077";
    float: left;
    font-family: "FontAwesome";
	margin-right:0.2em;
}
.panel-title > a.accordion-toggle.collapsed::before {
    content:"\f078";
}