Accordion - Collapsable Panels - NESTED - SINGLE OPEN - Bootstrap 3

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css">
<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion1" href="#collapseTwo">Get Started</a> </h4>
		</div>
		<div id="collapseTwo" class="panel-collapse collapse">
			<div class="panel-body">
				<div class="panel-body">
					<h4 class="panel-title">Which Campus do you attend?</h4>
					<div class="panel-group" id="accordion21">
          <br />
						<div class="panel"> <a data-toggle="collapse" data-parent="#accordion21" href="#collapseTwoOne">BIMM Brighton » </a>
							<div id="collapseTwoOne" class="panel-collapse collapse">
								<div class="panel-body">Brighton Moodle Form »</div>
							</div>
						</div>
						<div class="panel "> <a data-toggle="collapse" data-parent="#accordion21" href="#collapseTwoTwo">BIMM Hamburg » </a>
							<div id="collapseTwoTwo" class="panel-collapse collapse">
								<div class="panel-body">Hamburg Moodle Form »</div>
							</div>
						</div>
            <div class="panel "> <a data-toggle="collapse" data-parent="#accordion21" href="#collapseThreeTwo">BIMM London » </a>
							<div id="collapseThreeTwo" class="panel-collapse collapse">
								<div class="panel-body">London Moodle Form »</div>
							</div>
						</div>
            
            
					</div>
				</div>
			</div>
		</div>
	</div>

CSS

.panel-heading a:after {
    font-family:'Glyphicons Halflings';
    content:"\e114";
    float: right;
    color: grey;
}
.panel-heading a.collapsed:after {
    content:"\e080";
}