<div class="accordion md-accordion" id="accordionEx" role="tablist" aria-multiselectable="true"> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingOne1"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseOne1" aria-expanded="false" aria-controls="collapseOne1">        <h4 class="mb-0 text-secondary font-weight-bold">          Title 1 <i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseOne1" class="collapse" role="tabpanel" aria-labelledby="headingOne1" data-parent="#accordionEx"> 

   <div class="card-body"> <p>body 1</p> </div> 

  </div>

 </div> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingTwo2"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseTwo2" aria-expanded="false" aria-controls="collapseTwo2">        <h4 class="mb-0 text-secondary font-weight-bold">  Title 2 <i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseTwo2" class="collapse" role="tabpanel" aria-labelledby="headingTwo2" data-parent="#accordionEx"> 

   <div class="card-body"> <p>body 2</p> </div> 

  </div>

 </div> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingThree3"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseThree3" aria-expanded="false" aria-controls="collapseThree3">        <h4 class="mb-0 text-secondary font-weight-bold"> Title 3<i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseThree3" class="collapse show" role="tabpanel" aria-labelledby="headingThree3" data-parent="#accordionEx"> 

   <div class="card-body"><p>body 3</p> </div> 

  </div>

 </div> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingFour4"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseFour4" aria-expanded="false" aria-controls="collapseFour4">        <h4 class="mb-0 text-secondary font-weight-bold">  Title 4  <i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseFour4" class="collapse" role="tabpanel" aria-labelledby="headingFour4" data-parent="#accordionEx"> 

   <div class="card-body"> <p>body 4</p> </div> 

  </div>

 </div> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingFive5"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseFive5" aria-expanded="false" aria-controls="collapseFive5">        <h4 class="mb-0 text-secondary font-weight-bold">   Title 5   <i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseFive5" class="collapse" role="tabpanel" aria-labelledby="headingFive5" data-parent="#accordionEx"> 

   <div class="card-body"> <p>body 5</p> </div>

  </div> 

 </div> 

 <div class="card"> 

  <div class="card-header" role="tab" id="headingSix6"> <a class="collapsed" data-toggle="collapse" data-parent="#accordionEx" href="#collapseSix6" aria-expanded="false" aria-controls="collapseSix6">        <h4 class="mb-0 text-secondary font-weight-bold">     Title 6   <i class="fas fa-angle-down rotate-icon"></i>        </h4>      </a> 

  </div> 

  <div id="collapseSix6" class="collapse" role="tabpanel" aria-labelledby="headingSix6" data-parent="#accordionEx"> 

   <div class="card-body"> <p>body 6</p> </div>

  </div> 

 </div> 

</div>