<div class="hexagon">
  <div class="triangle" id="top_triangle"><span>Psychological</span></div>
   <div class="triangle" id="top_right_triangle"><span>Cognitive</span></div>

   <div class="triangle" id="bottom_right_triangle"><span>Social</span></div>
   <div class="triangle" id="bottom_triangle"><span>Physical</span></div>
     <div class="triangle" id="bottom_left_triangle"><span>Economic</span></div>
      <div class="triangle" id="top_left_triangle"><span>Emotional & <br>Strengths</span></div>



</div>