{{#> base }}
    {{> AppSidebar/sidebar components-accordions=this }}
    <div class="app-main__outer">
        <div class="app-main__inner">
            {{> AppMain/page-title }}
            <div class="">
                <div class="row">
                    <div class="col-md-6">
                        <div class="main-card mb-3 card">
                            <div class="card-body">
                                <h5 class="card-title">Collapse</h5>
                                <div class="collapse" id="collapseExample123"><p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred
                                    nesciunt sapiente ea
                                    proident.</p>
                                    <p>Donec molestie odio id nisi malesuada, mattis tincidunt velit egestas. Sed non pulvinar risus. Aenean elementum eleifend nunc, pellentesque dapibus arcu hendrerit fringilla. Aliquam in nibh massa. Cras ultricies
                                        lorem non enim volutpat, a eleifend urna placerat. Fusce id luctus urna. In sed leo tellus. Mauris tristique leo a nisl feugiat, eget vehicula leo venenatis. Quisque magna metus, luctus quis sollicitudin vel,
                                        vehicula nec ipsum. Donec rutrum commodo lacus ut condimentum. Integer vel turpis purus. Etiam vehicula, nulla non fringilla blandit, massa purus faucibus tellus, a luctus enim orci non augue. Aenean
                                        ullamcorper nisl urna, non feugiat tortor volutpat in. Vivamus lobortis massa dolor, eget faucibus ipsum varius eget. Pellentesque imperdiet, turpis sed sagittis lobortis, leo elit laoreet arcu, vehicula
                                        sagittis elit leo id nisi.</p></div>
                            </div>
                            <div class="card-footer">
                                <button type="button" data-bs-toggle="collapse" href="#collapseExample123" class="btn btn-primary">Toggle</button>
                            </div>
                        </div>
                        <div class="main-card mb-3 card">
                            <div class="card-body"><h5 class="card-title">Simple</h5>
                                <div id="exampleAccordion" data-children=".item">
                                    <div class="item">
                                        <button type="button" aria-expanded="true" aria-controls="exampleAccordion1" data-bs-toggle="collapse" href="#collapseExample" class="m-0 p-0 btn btn-link">Toggle item</button>
                                        <div data-parent="#exampleAccordion" id="collapseExample" class="collapse show"><p class="mb-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed pretium lorem non vestibulum scelerisque. Proin a
                                            vestibulum sem, eget tristique massa. Aliquam lacinia rhoncus nibh quis ornare.</p></div>
                                    </div>
                                    <div class="item">
                                        <button type="button" aria-expanded="false" aria-controls="exampleAccordion2" data-bs-toggle="collapse" href="#collapseExample2" class="m-0 p-0 btn btn-link">Toggle item 2</button>
                                        <div data-parent="#exampleAccordion" id="collapseExample2" class="collapse"><p class="mb-3">Donec at ipsum dignissim, rutrum turpis scelerisque, tristique lectus. Pellentesque habitant morbi tristique
                                            senectus
                                            et netus et malesuada fames ac turpis egestas. Vivamus nec dui turpis. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div id="accordion" class="accordion-wrapper mb-3">
                            <div class="card">
                                <div id="headingOne" class="card-header">
                                    <div class="d-grid">
                                        <button type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne1" aria-expanded="true" aria-controls="collapseOne" class="text-start m-0 p-0 btn btn-link">
                                            <h5 class="m-0 p-0">Collapsible Group Item #1</h5>
                                        </button>
                                    </div>
                                </div>
                                <div data-parent="#accordion" id="collapseOne1" aria-labelledby="headingOne" class="collapse show">
                                    <div class="card-body">1. Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa
                                        nesciunt
                                        laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
                                        sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable
                                        VHS.
                                    </div>
                                </div>
                            </div>
                            <div class="card">
                                <div id="headingTwo" class="b-radius-0 card-header">
                                    <div class="d-grid">
                                        <button type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne2" aria-expanded="false" aria-controls="collapseTwo" class="text-start m-0 p-0 btn btn-link">
                                            <h5 class="m-0 p-0">Collapsible Group Item
                                            #2</h5>
                                        </button>   
                                    </div>
                                </div>
                                <div data-parent="#accordion" id="collapseOne2" class="collapse">
                                    <div class="card-body">2. Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa
                                        nesciunt
                                        laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
                                        sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable
                                        VHS.
                                    </div>
                                </div>
                            </div>
                            <div class="card">
                                <div id="headingThree" class="card-header">
                                    <div class="d-grid">
                                        <button type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne3" aria-expanded="false" aria-controls="collapseThree" class="text-start m-0 p-0 btn btn-link"><h5 class="m-0 p-0">Collapsible Group
                                            Item #3</h5>
                                        </button>
                                    </div>
                                </div>
                                <div data-parent="#accordion" id="collapseOne3" class="collapse">
                                    <div class="card-body">3. Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa
                                        nesciunt
                                        laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt
                                        sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable
                                        VHS.
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{> AppFooter/footer }}
    </div>
{{/ base }}