<h3>Success</h3>
<div class="alert alert-success">Well done! You successfully read this important alert message.</div>

<div id="accordion1" class="accordion">
<div class="accordion-group">
<div class="accordion-heading"><a class="accordion-toggle" href="#collapseOne" data-toggle="collapse" data-parent="#accordion1">How to use</a></div>
<div id="collapseOne" class="accordion-body collapse">
<div class="accordion-inner">
<pre><code>
   &lt;div class="alert alert-success"&gt;Well done! You successfully read this important alert message.&lt;/div&gt;
</code>
</pre>
</div>
</div>
</div>
</div>
<br>

<h3>Info</h3>
<div class="alert alert-info">Heads up! This alert needs your attention, but it's not super important.</div>
<div id="accordion3" class="accordion">
<div class="accordion-group">
<div class="accordion-heading"><a class="accordion-toggle" href="#collapseThree" data-toggle="collapse" data-parent="#accordion3">How to use</a></div>
<div id="collapseThree" class="accordion-body collapse">
<div class="accordion-inner">
<pre><code>
  &lt;div class="alert alert-info"&gt;Heads up! This alert needs your attention, but it's not super important.&lt;/div&gt;
</code>
</pre>
</div>
</div>
</div>
</div>

<br>
<h3>Warning</h3>
<div class="alert alert-warning">Warning! Better check yourself, you're not looking too good.</div>
<div id="accordion2" class="accordion">
<div class="accordion-group">
<div class="accordion-heading"><a class="accordion-toggle" href="#collapseTwo" data-toggle="collapse" data-parent="#accordion2">How to use</a></div>
<div id="collapseTwo" class="accordion-body collapse">
<div class="accordion-inner">
<pre><code>
   &lt;div class="alert alert-warning"&gt;Warning! Better check yourself, you're not looking too good.&lt;/div&gt;
</code>
</pre>
</div>
</div>
</div>
</div>

<br>

<h3>Dangerg</h3>
<div class="alert alert-danger">Oh snap! Change a few things up and try submitting again.</div>
<div id="accordion4" class="accordion">
<div class="accordion-group">
<div class="accordion-heading"><a class="accordion-toggle" href="#collapse4" data-toggle="collapse" data-parent="#accordion4">How to use</a></div>
<div id="collapse4" class="accordion-body collapse">
<div class="accordion-inner">
<pre><code>
   &lt;div class="alert alert-warning"&gt;Warning! Better check yourself, you're not looking too good.&lt;/div&gt;
</code>
</pre>
</div>
</div>
</div>
</div>



