<!-- DC Accordions CSS -->
<link type="text/css" rel="stylesheet" href="dreamcodes/accordion_toggle/css/tsc_accordion_toggle.css" />

<!-- jQuery Library (skip this step if already called on page ) -->
<script type="text/javascript" src="dreamcodes/jquery.min.js"></script> <!-- (do not call twice) -->

<!-- DC Accordions JS -->
<script type="text/javascript" src="dreamcodes/accordion_toggle/js/tsc_accordion_toggle.js"></script>

          

  <!-- DC Accordions 1 Start -->
  <div class="tsc_accordion" style="width:80%;">
    <ul>
      <li class="block_header">The Life Stages</li>
      <li class="block" id="block_1"><a class="header" href="#block_1">Stage 1: Lorem ipsum dolor sit amet</a>
        <div class="arrow"></div>
        <div>
          <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer quis mi tincidunt orci auctor ultricies a porta sapien. Nulla laoreet nisl sed felis scelerisque sed luctus dolor iaculis. Quisque viverra ante quis lorem dignissim consequat. Maecenas pharetra mattis nulla, pharetra accumsan purus sodales vitae. Nunc quis nisi quis lorem posuere sollicitudin quis sit amet tortor. Aliquam molestie condimentum rhoncus. Duis egestas lectus non elit sodales sed mollis turpis imperdiet. Phasellus imperdiet, purus eget imperdiet molestie, purus massa commodo ligula, eget posuere nisl enim sit amet ligula. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nam id sapien nibh, dignissim adipiscing erat. Aenean ipsum turpis, vestibulum non imperdiet non, dignissim ac nibh. </p>
        </div>
      </li>
      <li class="block" id="block_2"><a class="header" href="#block_2">Stage II: Etiam turpis magna</a>
        <div class="arrow"></div>
        <div>
          <p> Etiam turpis magna, vulputate vel fermentum in, lacinia ut erat. Maecenas elementum feugiat turpis vitae consequat. Etiam lacinia, dui ut rhoncus pharetra, arcu neque auctor purus, quis pharetra massa neque sit amet mauris. Nullam in turpis est, nec tincidunt elit. Nam dui leo, blandit eu interdum et, ullamcorper vel dui. Quisque sapien lectus, facilisis vel faucibus id, sagittis in risus. Fusce arcu augue, tristique quis ultricies dictum, laoreet vitae ante. Proin vitae sem libero, sollicitudin mollis urna. Nam euismod, neque id vulputate laoreet, est felis consectetur libero, eget consectetur sem neque eget est. Nunc eget turpis sit amet mi dictum faucibus. Sed imperdiet venenatis sodales. Etiam nec tempor tortor. Mauris consectetur faucibus est, vel pharetra est congue ullamcorper. </p>
        </div>
      </li>
      <li class="block" id="block_3"><a class="header" href="#block_3">Stage III: Nullam egestas quam in arcu</a>
        <div class="arrow"></div>
        <div>
          <p> Nullam egestas quam in arcu tristique id condimentum risus vehicula. Nunc a nunc dui, sed pharetra dui. Nunc lectus neque, malesuada non mattis at, sagittis nec lacus. Pellentesque nec interdum velit. </p>
        </div>
      </li>
      <li class="block" id="block_4"><a class="header" href="#block_4">Stage IV: Nunc eu ligula pretium turpis</a>
        <div class="arrow"></div>
        <div>
          <p> Nunc eu ligula pretium turpis scelerisque vehicula sed non ante. Nam vel nulla mi, sit amet lacinia nunc. Aenean volutpat ultricies iaculis. Cras nec enim lectus. Praesent eu ante neque, nec fringilla nibh. Nam porttitor laoreet nunc, id commodo risus dignissim eu. Vivamus accumsan tempus iaculis. Nulla ultricies porttitor viverra. Integer id ipsum tellus. Quisque turpis nisl, imperdiet ut scelerisque a, congue in lectus. Praesent gravida tincidunt varius. Nulla at tellus in dui feugiat luctus id sed justo. Nullam sollicitudin tempus tortor ac luctus. Suspendisse sit amet vestibulum turpis. </p>
        </div>
      </li>
      <li class="block" id="block_5"><a class="header" href="#block_5">Stage V: Integer tempor dui ac ante</a>
        <div class="arrow"></div>
        <div>
          <p> Integer tempor dui ac ante pharetra sit amet viverra odio consequat. Nulla facilisi. Praesent vel lorem sed elit dictum auctor. Nulla neque ligula, condimentum at fermentum sed, dignissim in augue. Sed nec justo sed nibh placerat vulputate et at purus. Nulla ultrices, lorem at malesuada vulputate, dolor lectus blandit nisl, vitae interdum ligula urna vel ligula. Vivamus volutpat lacinia neque. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum eget eleifend diam. Etiam velit lectus, lacinia et venenatis non, lobortis dignissim quam. </p>
        </div>
      </li>
    </ul>
  </div>
  <!-- DC Accordions 1 End -->
	<div class="tsc_clear"></div> <!-- line break/clear line -->
	
          

<!-- DC Accordion 2 Start -->
  <div class="tsc_acc style1" style="width:80%;">
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Top Animal Facts</a></div>
      <div class="tsc_toggle_box"> + Hippo milk is pink.<br />
        + Turtles can breathe through their butts.<br />
      </div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Top Weird Facts</a></div>
      <div class="tsc_toggle_box"> + The chances of you dying on the way to get your lottery tickets is greater than your chances of winning.<br />
        + If the population of China walked past you, in single file, the line would never end because of the rate of reproduction.<br />
      </div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Top Weather Facts</a></div>
      <div class="tsc_toggle_box"> + In ten minutes, a hurricane releases more energy than all the world's nuclear weapons combined!<br />
        + 9 out of 10 lightning strike victims survive<br />
      </div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Top Space Facts</a></div>
      <div class="tsc_toggle_box"> + Only 55% of Americans know that the sun is a star.<br />
        + If two pieces of metal touch in space, they become permanently stuck together. </div>
    </div>
<!-- DC Accordion 2 End -->

          

  <!-- DC Accordion 3 Start -->
  <div class="tsc_acc style2" style="width:80%;">
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Most shop lifted book?</a></div>
      <div class="tsc_toggle_box">The Bible is the most-shoplifted book in the world.</div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Water Brains?</a></div>
      <div class="tsc_toggle_box">Your brain is 80% water.</div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Brain HD Storage Size?</a></div>
      <div class="tsc_toggle_box">The storage capacity of human brain exceeds 4 Terrabytes.</div>
    </div>
    <div class="tsc_acc_box">
      <div><a href="#" class="tsc_acc_link">Growing Banana Trees?</a></div>
      <div class="tsc_toggle_box">The banana tree cannot reproduce itself. It can be propagated only by the hand of man.</div>
    </div>
  </div>
  <!-- DC Accordion 3 End -->

          

<!-- DC Accordion 4 Start -->
<section class="tsc_ac-container" style="width:80%;">
  <div>
    <input id="ac-1" name="accordion-1" type="radio" checked />
    <label for="ac-1">The Firm</label>
    <article class="ac-small">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pellentesque, tortor vel aliquam elementum, lectus urna accumsan orci, eget venenatis ligula nisl quis orci. Integer rhoncus venenatis aliquam.</p>
    </article>
  </div>
  <div>
    <input id="ac-2" name="accordion-1" type="radio" />
    <label for="ac-2">Why us</label>
    <article class="ac-medium">
      <p>Nullam iaculis vehicula nunc et imperdiet. Nullam gravida nunc libero. Suspendisse interdum lacus et tellus placerat condimentum. Sed eget semper urna. Integer hendrerit convallis ipsum id tristique. </p>
    </article>
  </div>
  <div>
    <input id="ac-3" name="accordion-1" type="radio" />
    <label for="ac-3">Services</label>
    <article class="ac-large">
      <p>Donec lacinia, odio nec lacinia feugiat, mauris sem condimentum velit, sollicitudin malesuada velit ante quis quam. Fusce non scelerisque augue. Cras volutpat risus a metus fermentum placerat. </p>
    </article>
  </div>
  <div>
    <input id="ac-4" name="accordion-1" type="radio" />
    <label for="ac-4">Contact us</label>
    <article class="ac-large">
      <p>Nulla adipiscing arcu sed odio semper lobortis. Curabitur tincidunt nulla metus. Sed faucibus sem vitae libero eleifend ac ullamcorper mauris aliquam.Sed sed odio tellus. Fusce commodo suscipit augue. </p>
    </article>
  </div>
</section>
<!-- DC Accordion 4 End -->