Check with your designers to help you design this section
Check with your designers to help you design this section
<div
id="raul-accordion-single"
class="raul-accordion-container raul-accordion-single raul-accordion-with-icon"
>
<div class="raul-accordion-item">
<input type="radio" id="radio-1" name="radio">
<label for="radio-1">
<i class="fa fa-cube" aria-hidden="true"></i>Title1 Goes Here
</label>
<div class="raul-accordion-item-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-2" name="radio">
<label for="radio-2"><i class="fa fa-cube" aria-hidden="true"></i>Title2 Goes Here</label>
<div class="raul-accordion-item-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-3" name="radio">
<label for="radio-3"><i class="fa fa-cube" aria-hidden="true"></i>Title3 Goes Here</label>
<div class="raul-accordion-item-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-4" name="radio">
<label for="radio-4"><i class="fa fa-cube" aria-hidden="true"></i>Title4 Goes Here</label>
<div class="raul-accordion-item-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</div>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
<div class="raul-accordion-container raul-accordion-gutters">
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-1" name="checkbox">
<label for="checkbox-1">Title1 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-2" name="checkbox">
<label for="checkbox-2">Title2 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-3" name="checkbox">
<label for="checkbox-3">Title3 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-4" name="checkbox">
<label for="checkbox-4">Title4 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
<div class="raul-accordion-container raul-light-accordion">
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-5" name="checkbox">
<label for="checkbox-5">Title1 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non
rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-6" name="checkbox">
<label for="checkbox-6">Title2 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-7" name="checkbox">
<label for="checkbox-7">Title3 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="checkbox" id="checkbox-8" name="checkbox">
<label for="checkbox-8">Title4 Goes Here</label>
<div class="raul-accordion-item-content">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
</div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien. Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa. Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris. Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est, non rhoncus tortor libero eu mauris.
<div
id="raul-complex-accordion"
class="raul-accordion-container
raul-accordion-single
raul-accordion-gutters
raul-accordion-complex"
>
<div class="raul-accordion-item">
<input type="radio" id="radio-11" name="c-radio">
<label for="radio-11">
<div class="raul-accordion-title-panel">
<div class="raul-accordion-title">Title1 Goes Here</div>
<div class="raul-accordion-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
</div>
<div class="raul-accordion-edit-panel">
<i class="fa fa-pencil" aria-hidden="true"></i>
<i class="fa fa-ellipsis-v" aria-hidden="true"></i>
</div>
</label>
<div class="raul-accordion-item-content">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-12" name="c-radio">
<label for="radio-12">
<div class="raul-accordion-title-panel">
<div class="raul-accordion-title">Title2 Goes Here</div>
<div class="raul-accordion-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
</div>
<div class="raul-accordion-edit-panel">
<i class="fa fa-pencil" aria-hidden="true"></i>
<i class="fa fa-ellipsis-v" aria-hidden="true"></i>
</div>
</label>
<div class="raul-accordion-item-content">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-13" name="c-radio">
<label for="radio-13">
<div class="raul-accordion-title-panel">
<div class="raul-accordion-title">Title3 Goes Here</div>
<div class="raul-accordion-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
</div>
<div class="raul-accordion-edit-panel">
<i class="fa fa-pencil" aria-hidden="true"></i>
<i class="fa fa-ellipsis-v" aria-hidden="true"></i>
</div>
</label>
<div class="raul-accordion-item-content">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
<div class="raul-accordion-item">
<input type="radio" id="radio-14" name="c-radio">
<label for="radio-14" class="clearfix">
<div class="raul-accordion-title-panel">
<div class="raul-accordion-title">Title4 Goes Here</div>
<div class="raul-accordion-description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</div>
</div>
<div class="raul-accordion-edit-panel">
<i class="fa fa-pencil" aria-hidden="true"></i>
<i class="fa fa-ellipsis-v" aria-hidden="true"></i>
</div>
</label>
<div class="raul-accordion-item-content">
<p class="m-0">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla id malesuada sapien.
Mauris urna justo, ultrices id aliquet aliquet, pellentesque sed massa.
Cras vulputate ipsum vitae erat lobortis, sed tempus erat volutpat.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
Sed porttitor, augue iaculis faucibus lobortis, elit nunc scelerisque est,
non rhoncus tortor libero eu mauris.
</p>
</div>
</div>
</div>