Style 1
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
<section id="dt-content" class="sec-pt-lg">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Style 1</h2>
<div class="accordion accordion1" id="accordionStyle1">
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle1headingOne">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle1collapseOne" aria-expanded="false" aria-controls="accordionStyle1collapseOne">
Lorem Ipsum Dolor Sit Amet ?
</button>
</h2>
<div id="accordionStyle1collapseOne" class="accordion-collapse collapse" aria-labelledby="accordionStyle1headingOne" data-bs-parent="#accordionStyle1" style="">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle1headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle1collapseTwo" aria-expanded="false" aria-controls="accordionStyle1collapseTwo">
Quisque pretium finibus ?
</button>
</h2>
<div id="accordionStyle1collapseTwo" class="accordion-collapse collapse" aria-labelledby="accordionStyle1headingTwo" data-bs-parent="#accordionStyle1" style="">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle1headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle1collapseThree" aria-expanded="false" aria-controls="accordionStyle1collapseThree">
Arcu consequat pretium elementum ?
</button>
</h2>
<div id="accordionStyle1collapseThree" class="accordion-collapse collapse" aria-labelledby="accordionStyle1headingThree" data-bs-parent="#accordionStyle1" style="">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Style 2
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
<section id="dt-content" class="sec-pt-lg">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Style 2</h2>
<div class="accordion accordion2" id="accordionStyle2">
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle2headingOne">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle2collapseOne" aria-expanded="false" aria-controls="accordionStyle2collapseOne">
Lorem Ipsum Dolor Sit Amet ?
</button>
</h2>
<div id="accordionStyle2collapseOne" class="accordion-collapse collapse" aria-labelledby="accordionStyle2headingOne" data-bs-parent="#accordionStyle2" style="">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle2headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle2collapseTwo" aria-expanded="false" aria-controls="accordionStyle2collapseTwo">
Quisque pretium finibus ?
</button>
</h2>
<div id="accordionStyle2collapseTwo" class="accordion-collapse collapse" aria-labelledby="accordionStyle2headingTwo" data-bs-parent="#accordionStyle2">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle2headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle2collapseThree" aria-expanded="false" aria-controls="accordionStyle2collapseThree">
Arcu consequat pretium elementum ?
</button>
</h2>
<div id="accordionStyle2collapseThree" class="accordion-collapse collapse" aria-labelledby="accordionStyle2headingThree" data-bs-parent="#accordionStyle2">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Style 3
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.
Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.
<section id="dt-content" class="sec-pt-lg">
<div class="container">
<div class="row">
<div class="col-12">
<h2>Style 3</h2>
<div class="accordion accordion3" id="accordionStyle3">
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle3headingOne">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle3collapseOne" aria-expanded="true" aria-controls="accordionStyle3collapseOne">
Lorem Ipsum Dolor Sit Amet ?
</button>
</h2>
<div id="accordionStyle3collapseOne" class="accordion-collapse collapse show" aria-labelledby="accordionStyle3headingOne" data-bs-parent="#accordionStyle3" style="">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle3headingTwo">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle3collapseTwo" aria-expanded="false" aria-controls="accordionStyle3collapseTwo">
Quisque pretium finibus ?
</button>
</h2>
<div id="accordionStyle3collapseTwo" class="accordion-collapse collapse" aria-labelledby="accordionStyle3headingTwo" data-bs-parent="#accordionStyle3">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="accordionStyle3headingThree">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#accordionStyle3collapseThree" aria-expanded="false" aria-controls="accordionStyle3collapseThree">
Arcu consequat pretium elementum ?
</button>
</h2>
<div id="accordionStyle3collapseThree" class="accordion-collapse collapse" aria-labelledby="accordionStyle3headingThree" data-bs-parent="#accordionStyle3">
<div class="accordion-body">
<p>Cras sit amet maximus nisl, non placerat enim. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas nec molestie magna. Quisque erat nisi, suscipit et scelerisque quis, sodales id turpis. Risus turpis euismod enim, non volutpat elit justo eget mi. Fusce lacinia eu magna sed ultricies.</p><p>Praesent aliquet euismod volutpat. Ut vel mi eleifend, fermentum mauris id, luctus turpis. Sed efficitur, nisl quis iaculis molestie, nisi turpis commodo risus, vel ornare lorem lectus vitae dui. Maecenas vel lacinia justo. Vivamus varius diam eu dignissim dictum. Nullam non massa vitae nunc posuere consectetur. Nullam magna nibh, luctus vel purus et, pharetra ornare diam.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
