<?php include('head.php'); ?>

<?php include('header.php'); ?>

<main class="layout">
    <div class="ss-section">
        <div class="ss-section-inner">
            <div class="container">
                <div class="row">
                    <div class="col">
                        <strong style="display:block;color:red;font-size: 42px">Display Text</strong>
                        <h2 class="d1">Display 1 text</h2>
                        <h2 class="d2">Display 2 text</h2>
                        <br><br>

                        <strong style="display:block;color:red;font-size: 42px">Headings</strong>
                        <h1>H1Text lorem</h1>
                        <h2>H2Text lorem</h2>
                        <h3>H3Text lorem</h3>
                        <h4>H4Text lorem</h4>
                        <h5>H5Text lorem</h5>
                        <h6>H6Text lorem</h6>

                        <br><br>

                        <strong style="display:block;color:red;font-size: 42px">Paragraphs</strong>
                        <p class="p0">P0Text lorem</p>
                        <p class="p1">P1Text lorem</p>
                        <p class="p2">P2Text lorem</p>
                        <p class="p3">P3Text lorem</p>
                        <p class="p4">P4Text lorem</p>

                        <br><br>

                        <strong style="display:block;color:red;font-size: 42px">UL/OL/DL/LI/DT/DD</strong>
                        <ul>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>
                                Lorem ipsum dolor sit amet consectetur
                                <ul>
                                    <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit</li>
                                    <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit</li>
                                </ul>
                            </li>
                        </ul>

                        <br><br>

                        <ol>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                            <li>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Repellat molestiae maxime tempora ut doloremque cupiditate aperiam, repudiandae modi veritatis iste incidunt animi dolores illo beatae similique error, assumenda nisi voluptates.</li>
                        </ol>

                        <br><br>

                        <dl>
                            <dt>Coffee</dt>
                            <dd>Black hot drink</dd>
                            <dt>Milk</dt>
                            <dd>White cold drink</dd>
                        </dl>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">HYPERLINKS</strong>
                        <a href="#">Hyperlinks</a><br>
                        <a href="#">Hyperlinks</a><br>
                        <a href="#">Hyperlinks</a><br>
                        <a href="#">Hyperlinks</a><br>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Global Buttons</strong>
                        <a class="btn btn-primary btn-lg">Large</a>
                        <a class="btn btn-secondary btn-lg">Large</a>
                        <a class="btn btn-dark btn-lg">Large</a>
                        <a class="btn btn-light btn-lg">Large</a>
                        <a class="btn btn-warning btn-lg">Large</a>
                        <a class="btn btn-danger btn-lg">Large</a>
                        <br><br>
                        <a class="btn btn-primary">Primary</a>
                        <a class="btn btn-secondary">Secondary</a>
                        <a class="btn btn-dark">Dark</a>
                        <a class="btn btn-light">Light</a>
                        <a class="btn btn-warning">Warning</a>
                        <a class="btn btn-danger">Danger</a>
                        <br><br>
                        <a class="btn btn-primary with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <a class="btn btn-secondary with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <a class="btn btn-dark with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <a class="btn btn-light with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <a class="btn btn-warning with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <a class="btn btn-danger with-icon">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span>Button</span>
                        </a>
                        <br><br>
                        <a class="btn btn-primary btn-sm">small</a>
                        <a class="btn btn-secondary btn-sm">small</a>
                        <a class="btn btn-dark btn-sm">small</a>
                        <a class="btn btn-light btn-sm">small</a>
                        <a class="btn btn-warning btn-sm">small</a>
                        <a class="btn btn-danger btn-sm">small</a>
                        <br><br>
                        <a class="btn btn-outline-primary">Outline</a>
                        <a class="btn btn-outline-secondary">Outline</a>
                        <a class="btn btn-outline-dark">Outline</a>
                        <a class="btn btn-outline-light">Outline</a>
                        <a class="btn btn-outline-warning">Outline</a>
                        <a class="btn btn-outline-danger">Outline</a>
                        <br><br>
                        <a class="btn btn-primary disabled">Disabled</a>
                        <a class="btn btn-secondary disabled">Disabled</a>
                        <a class="btn btn-dark disabled">Disabled</a>
                        <a class="btn btn-light disabled">Disabled</a>
                        <a class="btn btn-warning disabled">Disabled</a>
                        <a class="btn btn-danger disabled">Disabled</a>
                        <br><br>
                        <a class="btn btn-outline-primary disabled">Disabled</a>
                        <a class="btn btn-outline-secondary disabled">Disabled</a>
                        <a class="btn btn-outline-dark disabled">Disabled</a>
                        <a class="btn btn-outline-light disabled">Disabled</a>
                        <a class="btn btn-outline-warning disabled">Disabled</a>
                        <a class="btn btn-outline-danger disabled">Disabled</a>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Secondary Buttons</strong>
                        <div class="row">
                            <div class="col">
                                <h4>Label-Button</h4>
                                <a class="btn-label">
                                    <i class="ss-icon-save"><svg><use xlink:href="#ss-icon-save"></use></svg></i>
                                    <span>Save</span>
                                </a>
                                <br>
                                <a class="btn-label disabled">
                                    <i class="ss-icon-save"><svg><use xlink:href="#ss-icon-save"></use></svg></i>
                                    <span>Save</span>
                                </a>
                            </div>
                            <div class="col">
                                <h4>Icons-Button</h4>
                                <a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a>
                                <a class="btn-icon danger"><i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i></a>
                                <a class="btn-icon success fit-icon"><i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i></a>
                                <a class="btn-icon dark fit-icon"><i class="ss-icon-plus-circle"><svg><use xlink:href="#ss-icon-plus-circle"></use></svg></i></a>
                                <br>
                                <a class="btn-icon disabled"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a>
                                <a class="btn-icon danger disabled"><i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i></a>
                                <a class="btn-icon success fit-icon disabled"><i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i></a>
                                <a class="btn-icon dark fit-icon disabled"><i class="ss-icon-plus-circle"><svg><use xlink:href="#ss-icon-plus-circle"></use></svg></i></a>
                            </div>
                        </div>
                        
                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Alerts</strong>
                        <div class="row">
                            <div class="col-6">
                                <div class="alert fade show alert-warning d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-triangle"><svg><use xlink:href="#ss-icon-triangle"></use></svg></i>
                                    <div class="text-body">Alert message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="alert fade show alert-light d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-triangle text-yellow"><svg><use xlink:href="#ss-icon-triangle"></use></svg></i>
                                    <div class="text-body">Alert message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="alert fade show alert-primary d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-info-fill"><svg><use xlink:href="#ss-icon-info-fill"></use></svg></i>
                                    <div class="text-body">Info message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="alert fade show alert-light d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-info-fill text-primary"><svg><use xlink:href="#ss-icon-info-fill"></use></svg></i>
                                    <div class="text-body">Info message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="alert fade show alert-success d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-check-circle"><svg><use xlink:href="#ss-icon-check-circle"></use></svg></i>
                                    <div class="text-body">Success message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="alert fade show alert-light d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-check-circle text-secondary"><svg><use xlink:href="#ss-icon-check-circle"></use></svg></i>
                                    <div class="text-body">Success message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="alert fade show alert-danger d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-close-fill-two"><svg><use xlink:href="#ss-icon-close-fill-two"></use></svg></i>
                                    <div class="text-body">Error message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="alert fade show alert-light d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-close-fill-two text-danger"><svg><use xlink:href="#ss-icon-close-fill-two"></use></svg></i>
                                    <div class="text-body">Error message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-6">
                                <div class="alert fade show alert-dark d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-info-fill"><svg><use xlink:href="#ss-icon-info-fill"></use></svg></i>
                                    <div class="text-body">Multi-purpose message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                            <div class="col-6">
                                <div class="alert fade show alert-light d-flex align-items-center alert-dismissible" role="alert">
                                    <i class="flex-shrink-0 ss-icon-info-fill text-body"><svg><use xlink:href="#ss-icon-info-fill"></use></svg></i>
                                    <div class="text-body">Multi-purpose message</div>
                                    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Badges/Tags/Avatars</strong>

                        <h2>Basic Tags</h2>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag lg">
                                <span class="ss-tag-txt">Large</span>
                            </span>
                            <span class="ss-tag lg rounded">
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag lg">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag lg">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag lg removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag lg removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag">
                                <span class="ss-tag-txt">Default</span>
                            </span>
                            <span class="ss-tag rounded">
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag sm">
                                <span class="ss-tag-txt">Small</span>
                            </span>
                            <span class="ss-tag sm rounded">
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag sm">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag sm">
                                <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                                <span class="ss-tag-txt">Label</span>
                            </span>
                            <span class="ss-tag sm removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag sm removable">
                                <span class="ss-tag-txt">Label</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                        </div>
                        <br><br>
                        <h2>Filter Tags</h2>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag primary lg">
                                <span class="ss-tag-txt">Tag (11)</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag primary lg">
                                <span class="ss-tag-txt">Refine by Tags (11)</span>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag primary">
                                <span class="ss-tag-txt">Tag (11)</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag primary">
                                <span class="ss-tag-txt">Refine by Tags (11)</span>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag primary sm">
                                <span class="ss-tag-txt">Tag (11)</span>
                                <a class="ss-tag-remove"><i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i></a>
                            </span>
                            <span class="ss-tag primary sm">
                                <span class="ss-tag-txt">Refine by Tags (11)</span>
                            </span>
                        </div>
                        <br><br>
                        <h2>Status Tags</h2>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag lg">
                                <span class="ss-tag-txt">Large  (3/5)</span>
                            </span>
                            <span class="ss-tag lg">
                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                <span class="ss-tag-txt">John Doe (3/5)</span>
                            </span>
                            <span class="ss-tag lg">
                                <i class="ss-icon-circle-fill text-success"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Jeremy Smitchzdog  (3/5)</span>
                            </span>
                            <span class="ss-tag lg">
                                <i class="ss-icon-circle-fill text-danger"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Al Doe (3/5)</span>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag">
                                <span class="ss-tag-txt">Default (3/5)</span>
                            </span>
                            <span class="ss-tag">
                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                <span class="ss-tag-txt">John Doe (3/5)</span>
                            </span>
                            <span class="ss-tag">
                                <i class="ss-icon-circle-fill text-success"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Jeremy Smitchzdog  (3/5)</span>
                            </span>
                            <span class="ss-tag">
                                <i class="ss-icon-circle-fill text-danger"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Al Doe (3/5)</span>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-tag sm">
                                <span class="ss-tag-txt">Small  (3/5)</span>
                            </span>
                            <span class="ss-tag sm">
                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                <span class="ss-tag-txt">John Doe (3/5)</span>
                            </span>
                            <span class="ss-tag sm">
                                <i class="ss-icon-circle-fill text-success"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Jeremy Smitchzdog  (3/5)</span>
                            </span>
                            <span class="ss-tag sm">
                                <i class="ss-icon-circle-fill text-danger"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                <span class="ss-tag-txt">Al Doe (3/5)</span>
                            </span>
                        </div>
                        <br><br>
                        <h2>Status Badges</h2>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge danger">
                                <span class="ss-badge-txt">Danger</span>
                            </span>
                            <span class="ss-badge success">
                                <span class="ss-badge-txt">Success</span>
                            </span>
                            <span class="ss-badge warning">
                                <span class="ss-badge-txt">Warning</span>
                            </span>
                            <span class="ss-badge info">
                                <span class="ss-badge-txt">Info</span>
                            </span>
                            <span class="ss-badge dark">
                                <span class="ss-badge-txt">Dark</span>
                            </span>
                            <span class="ss-badge light">
                                <span class="ss-badge-txt">Light</span>
                            </span>
                            <span class="ss-badge">
                                <span class="ss-badge-txt">Secondary</span>
                            </span>
                        </div>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge danger rounded">
                                <span class="ss-badge-txt">Danger</span>
                            </span>
                            <span class="ss-badge success rounded">
                                <span class="ss-badge-txt">Success</span>
                            </span>
                            <span class="ss-badge warning rounded">
                                <span class="ss-badge-txt">Warning</span>
                            </span>
                            <span class="ss-badge info rounded">
                                <span class="ss-badge-txt">Info</span>
                            </span>
                            <span class="ss-badge dark rounded">
                                <span class="ss-badge-txt">Dark</span>
                            </span>
                            <span class="ss-badge light rounded">
                                <span class="ss-badge-txt">Light</span>
                            </span>
                            <span class="ss-badge rounded">
                                <span class="ss-badge-txt">Secondary</span>
                            </span>
                        </div>
                        <br><br>
                        <h2>Badge Icons</h2>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge-icon lg danger">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg success">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg warning">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg info">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg dark">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg light">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon lg">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                        </div>
                        <br>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge-icon md danger">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md success">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md warning">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md info">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md dark">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md light">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon md">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                        </div>
                        <br>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge-icon danger">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon success">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon warning">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon info">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon dark">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon light">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                        </div>
                        <br>
                        <div class="d-flex flex-wrap align-items-start">
                            <span class="ss-badge-icon sm danger">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm success">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm warning">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm info">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm dark">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm light">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                            <span class="ss-badge-icon sm">
                                <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            </span>
                        </div>
                        <br>
                        <div class="ss-badge-row">
                            <span class="ss-badge-icon-b">
                                <span class="ss-badge-icon bg-hot-pink-200">
                                    <i class="ss-icon-comment-smile text-hot-pink"><svg><use xlink:href="#ss-icon-comment-smile"></use></svg></i>
                                </span>
                            </span>
                            <div class="ss-badge-txt">
                                <h3 class="h4 fw-bold mb-1">Culture 20/20™ Surveys</h3>
                                <div class="p2 text-gray-inactive">Short survey to baseline readings for our real-time sentiment analysis</div>
                            </div>
                        </div>
                        <br><br>
                        <h2>Breadcrumb</h2>
                        <ul class="ss-breadcrumb">
                            <li>
                                <a href="#">Account</a>
                            </li>
                            <li>
                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                            </li>
                            <li>
                                <a href="#">User</a>
                            </li>
                            <li>
                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                            </li>
                            <li>
                                <span>Management</span>
                            </li>
                        </ul>

                        <br><br>
                        <h2>Progress Bars</h2>
                        <div class="progress-row mb-4">
                            <span class="progress-lable-top">25%</span>
                            <div class="progress">
                                <div class="progress-bar bg-primary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <span class="progress-lable-bottom"> Total Response Rate</span>
                        </div>
                        <div class="progress-row mb-4">
                            <span class="progress-lable-top">25%</span>
                            <div class="progress">
                                <div class="progress-bar bg-secondary" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <span class="progress-lable-bottom"> Total Response Rate</span>
                        </div>
                        <div class="progress-row mb-4">
                            <span class="progress-lable-top">25%</span>
                            <div class="progress">
                                <div class="progress-bar bg-danger" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <span class="progress-lable-bottom"> Total Response Rate</span>
                        </div>
                        <div class="progress-row mb-4">
                            <span class="progress-lable-top">25%</span>
                            <div class="progress">
                                <div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <span class="progress-lable-bottom"> Total Response Rate</span>
                        </div>
                        <div class="progress-row mb-4">
                            <span class="progress-lable-top">25%</span>
                            <div class="progress">
                                <div class="progress-bar bg-dark" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>
                            <span class="progress-lable-bottom"> Total Response Rate</span>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Tags Inputs</strong>
                        <div class="ss-tags-input">
                            <input type="text" value="Basic Survey,Human Resource" name="ss_tags" data-ss="tagsinput" data-maxtags="10">
                            <span class="form-control-help p2 mt-1">Max 10 tags separated by commas</span>
                        </div>
                        <br>
                        <div class="ss-tags-input with-icon-left">
                            <i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>
                            <input type="text" value="" name="email_addresses" data-ss="tagsinput" data-maxtags="10" placeholder="Email Addresses">
                            <span class="form-control-help p2 mt-1">Max 10 emails separated by commas</span>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Inputs</strong>
                        <div class="row">
                            <div class="col-3">
                                <p class="text-uppercase">NORMAL</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">DISABLED</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">ERROR</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">POSITIVE</p>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-icon-left">
                                        <input type="search" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                        <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-icon-left">
                                        <input type="search" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                        <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-icon-left">
                                        <input type="search" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                        <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-icon-left">
                                        <input type="search" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                        <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control" data-placeholder="Placeholder">
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control" data-placeholder="Placeholder" disabled>
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control is-invalid" data-placeholder="Placeholder">
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control is-valid" data-placeholder="Placeholder">
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control" data-placeholder="Placeholder" multiple>
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1" selected>One</option>
                                            <option value="2" selected>Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                            <option value="5">Six</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control" data-placeholder="Placeholder" multiple disabled>
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control is-invalid" data-placeholder="Placeholder" multiple>
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper">
                                        <select class="form-control is-valid" data-placeholder="Placeholder" multiple>
                                            <!-- don't rmeove below blank option because it's for show placeholder -->
                                            <option label="placeholder"></option>
                                            <option value="1">One</option>
                                            <option value="2">Two</option>
                                            <option value="3">Three</option>
                                            <option value="4">Four</option>
                                            <option value="5">Five</option>
                                        </select>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-url-prefix">
                                        <input type="url" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                        <span class="url-prefix-text">http://</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-url-prefix">
                                        <input type="url" value="" name="input-name" class="form-control" placeholder="Placeholder" disabled>
                                        <span class="url-prefix-text">http://</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-url-prefix">
                                        <input type="url" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                        <span class="url-prefix-text">http://</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Label</label>
                                    <span class="form-control-wrapper with-url-prefix">
                                        <input type="url" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                        <span class="url-prefix-text">http://</span>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <label class="form-label">Datepicker</label>
                                    <span class="form-control-wrapper with-icon-right with-sep-right">
                                        <input type="text" value="" name="ed_schedule" class="form-control js-datepicker" placeholder="Select Date">
                                        <i class="ss-icon-calender"><svg><use xlink:href="#ss-icon-calender"></use></svg></i>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-5">
                                <label class="form-label">Datepicker Range</label>
                                <div class="ss-send-sm-h-r js-daterange-picker">
                                    <div class="form-group">
                                        <span class="form-control-wrapper with-icon-right with-sep-right">
                                            <input type="text" value="" name="sm_from" class="form-control js-datepicker-from" placeholder="Select Date">
                                            <i class="ss-icon-calender"><svg><use xlink:href="#ss-icon-calender"></use></svg></i>
                                        </span>
                                    </div>
                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                    <div class="form-group">
                                        <span class="form-control-wrapper with-icon-right with-sep-right">
                                            <input type="text" value="" name="sm_to" class="form-control js-datepicker-to" placeholder="Select Date">
                                            <i class="ss-icon-calender"><svg><use xlink:href="#ss-icon-calender"></use></svg></i>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Inputs | Design/Build</strong>
                        <div class="row">
                            <div class="col-3">
                                <p class="text-uppercase">NORMAL</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">DISABLED</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">ERROR</p>
                            </div>
                            <div class="col-3">
                                <p class="text-uppercase">POSITIVE</p>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                        <span class="flexible-lbl">
                                            <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                        </span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                        <span class="flexible-lbl">
                                            <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                        </span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                        <span class="flexible-lbl">
                                            <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                        </span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                        <span class="flexible-lbl">
                                            <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                        </span>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                        <span class="flexible-lbl">a.</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                        <span class="flexible-lbl">a.</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                        <span class="flexible-lbl">a.</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                        <span class="flexible-lbl">a.</span>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                        <span class="flexible-lbl">&ndash;</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                        <span class="flexible-lbl">&ndash;</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                        <span class="flexible-lbl">&ndash;</span>
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-a flexible">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                        <span class="flexible-lbl">&ndash;</span>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-b">
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-b">
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-b">
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-b">
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-c flexible">
                                        <span class="flexible-lbl">Email Name:</span>
                                        <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-c flexible">
                                        <span class="flexible-lbl">Email Name:</span>
                                        <input type="text" value="" name="input-name" class="form-control" disabled placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-c flexible">
                                        <span class="flexible-lbl">Email Name:</span>
                                        <input type="text" value="" name="input-name" class="form-control is-invalid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                            <div class="col-3">
                                <div class="form-group">
                                    <span class="form-control-wrapper theme-c flexible">
                                        <span class="flexible-lbl">Email Name:</span>
                                        <input type="text" value="" name="input-name" class="form-control is-valid" placeholder="Placeholder">
                                    </span>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Selectors</strong>
                        <div class="row">
                            <div class="col-3">
                                <h2>Checkbox Buttons</h2>
                                <div class="form-group">
                                    <label class="ss-checkradio">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Default</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio default-outline">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Default Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio primary">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Primary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio primary-outline">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Primary Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio secondary">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Secondary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio secondary-outline">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Secondary Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio dark">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Dark</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio dark-outline">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Dark Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio">
                                        <input type="checkbox" value="" name="checkbox[]" class="is-invalid">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Error</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio default-outline">
                                        <input type="checkbox" value="" name="checkbox[]" class="is-invalid">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Error Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio">
                                        <input type="checkbox" value="" name="checkbox[]" disabled>
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Disabled</span>
                                    </label>
                                </div>
                            </div>
                            <div class="col-3">
                                <h2>Radio Buttons</h2>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Check Default</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Default</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio default-outline">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Default Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio primary">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Check Primary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio primary">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Primary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio primary-outline">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Primary Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio secondary">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Check Secondary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio secondary">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Secondary</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio secondary-outline">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Secondary Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio dark">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Check Dark</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio dark">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Dark</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio dark-outline">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Dark Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio">
                                        <input type="radio" value="" name="radio[]" class="is-invalid">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Error</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio default-outline">
                                        <input type="radio" value="" name="radio[]" class="is-invalid">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Error Outline</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio">
                                        <input type="radio" value="" name="radio[]" disabled>
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">Disabled</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-checkradio type-radio">
                                        <input type="radio" value="" name="radio[]">
                                        <span class="ss-checkradio-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-checkradio-text">
                                            <span class="ss-badge-icon warning sm">Sa</span>
                                            <span>With Badge</span>
                                        </span>
                                    </label>
                                </div>
                            </div>
                            <div class="col-2">
                                <h2>Toggles</h2>
                                <div class="form-group">
                                    <label class="ss-switcher">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher primary">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher secondary">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher warning">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher danger">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher dark">
                                        <input type="checkbox" value="" name="checkbox[]">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher primary xsm text-on-left d-inline-flex">
                                        <input type="checkbox" value="Y" name="activate_lnik">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-switcher-text text-uppercase text-end fw-bold">Activate Link</span>
                                    </label>
                                </div>
                                <div class="form-group">
                                    <label class="ss-switcher primary xsm d-inline-flex">
                                        <input type="checkbox" value="Y" name="activate_lnik">
                                        <span class="ss-switcher-ui">
                                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                        </span>
                                        <span class="ss-switcher-text text-uppercase text-end fw-bold">Activate Link</span>
                                    </label>
                                </div>
                            </div>
                            <div class="col-2">
                                <h2>Counters</h2>
                                <div class="form-group">
                                    <div class="ss-spinner">
                                        <input type="number" value="1" name="spinner" min="1" max="10" step="1">
                                        <a class="ss-spinner-arrow up">
                                            <i class="ss-icon-chevron-up"><svg><use xlink:href="#ss-icon-chevron-up"></use></svg></i>
                                        </a>
                                        <a class="ss-spinner-arrow down disabled">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="ss-spinner">
                                        <input type="number" value="1" name="spinner" min="1" max="10" step="1">
                                        <a class="ss-spinner-arrow up">
                                            <i class="ss-icon-chevron-up"><svg><use xlink:href="#ss-icon-chevron-up"></use></svg></i>
                                        </a>
                                        <a class="ss-spinner-arrow down disabled">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="ss-spinner">
                                        <input type="number" value="1" name="spinner" min="1" max="10" step="1">
                                        <a class="ss-spinner-arrow up">
                                            <i class="ss-icon-chevron-up"><svg><use xlink:href="#ss-icon-chevron-up"></use></svg></i>
                                        </a>
                                        <a class="ss-spinner-arrow down disabled">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="ss-spinner horizontal d-inline-flex">
                                        <input type="number" value="1" name="spinner" min="0" max="10" step="1">
                                        <a class="ss-spinner-arrow up">
                                            <i class="ss-icon-chevron-up"><svg><use xlink:href="#ss-icon-chevron-up"></use></svg></i>
                                        </a>
                                        <a class="ss-spinner-arrow down disabled">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-2">
                                <h2>Steppers</h2>
                                <div class="ss-stepper horizontal bordered">
                                    <a href="#">
                                        <i class="ss-icon-chevron-left"><svg><use xlink:href="#ss-icon-chevron-left"></use></svg></i>
                                    </a>
                                    <a href="#">
                                        <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                    </a>
                                </div>
                                <div class="ss-stepper horizontal">
                                    <a href="#">
                                        <i class="ss-icon-chevron-left"><svg><use xlink:href="#ss-icon-chevron-left"></use></svg></i>
                                    </a>
                                    <a href="#">
                                        <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                    </a>
                                </div>
                                <br><br>
                                <div class="ss-stepper vertical">
                                    <a href="#">
                                        <i class="ss-icon-arrow-top-line"><svg><use xlink:href="#ss-icon-arrow-top-line"></use></svg></i>
                                    </a>
                                    <a href="#">
                                        <i class="ss-icon-arrow-top"><svg><use xlink:href="#ss-icon-arrow-top"></use></svg></i>
                                    </a>
                                    <a href="#">
                                        <i class="ss-icon-arrow-bottom"><svg><use xlink:href="#ss-icon-arrow-bottom"></use></svg></i>
                                    </a>
                                    <a href="#">
                                        <i class="ss-icon-arrow-bottom-line"><svg><use xlink:href="#ss-icon-arrow-bottom-line"></use></svg></i>
                                    </a>
                                    <a href="#" class="stepper-close">
                                        <i class="ss-icon-close-fill"><svg><use xlink:href="#ss-icon-close-fill"></use></svg></i>
                                    </a>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <div class="row">
                            <div class="col-12">
                                <h2>Group Radio Default</h2>
                                <div class="ss-radiogroup-wrapper">
                                    <div class="ss-radiogroup-row">
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">1</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">2</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">3</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">4</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">5</span>
                                        </label>
                                    </div>
                                    <div class="ss-radiogroup-lbls">
                                        <p class="text-start">Very ineffective</p>
                                        <p class="text-center">Neither effective or ineffective</p>
                                        <p class="text-end">Very effective</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <div class="row">
                            <div class="col-12">
                                <h2>Group Radio Small</h2>
                                <div class="ss-radiogroup-wrapper">
                                    <div class="ss-radiogroup-row">
                                        <label class="ss-radiogroup sm">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">1</span>
                                        </label>
                                        <label class="ss-radiogroup sm">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">2</span>
                                        </label>
                                        <label class="ss-radiogroup sm">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">3</span>
                                        </label>
                                        <label class="ss-radiogroup sm">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">4</span>
                                        </label>
                                        <label class="ss-radiogroup sm">
                                            <input type="radio" value="1" name="ls_points">
                                            <span class="ss-radiogroup-text">5</span>
                                        </label>
                                    </div>
                                    <div class="ss-radiogroup-lbls p2">
                                        <p class="text-start">Very ineffective</p>
                                        <p class="text-center">Neither effective or ineffective</p>
                                        <p class="text-end">Very effective</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <div class="row">
                            <div class="col-12">
                                <h2>Group Radio btn primary</h2>
                                <div class="ss-radiogroup-wrapper">
                                    <div class="ss-radiogroup-row primary-btns">
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="lsp_points">
                                            <span class="ss-radiogroup-text">1</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="lsp_points">
                                            <span class="ss-radiogroup-text">2</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="lsp_points">
                                            <span class="ss-radiogroup-text">3</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="lsp_points">
                                            <span class="ss-radiogroup-text">4</span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="lsp_points">
                                            <span class="ss-radiogroup-text">5</span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <div class="row">
                            <div class="col-12">
                                <h2>Group Radio icons primary</h2>
                                <div class="ss-radiogroup-wrapper">
                                    <div class="ss-radiogroup-row primary-icons">
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="1" name="helpus_radio">
                                            <span class="ss-radiogroup-icon">
                                                <i class="ss-icon-face-one"><svg><use xlink:href="#ss-icon-face-one"></use></svg></i>
                                            </span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="2" name="helpus_radio">
                                            <span class="ss-radiogroup-icon">
                                                <i class="ss-icon-face-two"><svg><use xlink:href="#ss-icon-face-two"></use></svg></i>
                                            </span>
                                        </label>
                                        <label class="ss-radiogroup">
                                            <input type="radio" value="3" name="helpus_radio">
                                            <span class="ss-radiogroup-icon">
                                                <i class="ss-icon-face-three"><svg><use xlink:href="#ss-icon-face-three"></use></svg></i>
                                            </span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Dropdowns/Pop-Over</strong>
                        <h2 class="h1">Single select Dropdowns</h2>
                        <div class="row">
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Default SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item">
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item">
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item">
                                                <span class="dropdown-item-text">Placeholder three</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Icons SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Icons-Arrow SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Radio SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Filter SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <span class="form-control-wrapper with-icon-left ss-dropdown-search">
                                                <input type="search" value="" name="input-name" class="form-control" placeholder="Search">
                                                <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                            </span>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio">
                                                <span class="ss-dropdown-radio-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                            </a>
                                        </li>
                                        <li class="no-result-msg d-none">
                                            <span class="p1">No result found</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Nested SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li class="dropdown dropend">
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon dropdown-submenu-toggle" data-bs-offset="0,17" data-bs-toggle="dropdown" aria-expanded="false">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Submenu Toggle</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder one</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder two</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder three</span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Menu SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown js-single-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Menu</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li class="ss-dropdown-group-head">Help</li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li class="dropdown dropend">
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon dropdown-submenu-toggle" data-bs-offset="0,17" data-bs-toggle="dropdown" aria-expanded="false">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Submenu Toggle</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder one</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder two</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                        <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                        <span class="dropdown-item-text">Placeholder three</span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li class="ss-dropdown-group-head">About</li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder four</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder five</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder six</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Table Dropdown SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown js-single-select">
                                    <button type="button" class="btn-icon" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </button>
                                    <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Super Admin</strong>
                                                    <small>Create, edit add users, add groups, sell</small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Group Admin</strong>
                                                    <small>Create, edit add users, add groups, </small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Admin</strong>
                                                    <small>Create, edit add users, add groups, </small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Contributor</strong>
                                                    <small>Create, edit survey projects</small>
                                                </span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <div style="background-color: #387899;padding: 2rem;color: #fff;">
                                    <h4 class="text-uppercase">Badge Dropdown SINGLE SELECT</h4>
                                    <div class="ss-dropdown dropdown js-single-select">
                                        <button type="button" class="ss-dropdown-toggle white-transparent" data-bs-offset="0,10" data-bs-toggle="dropdown" aria-expanded="false">
                                            <span class="ss-dropdown-toggle-txt">Marketing Team</span>
                                            <span class="ss-dropdown-arrow">
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </span>
                                        </button>
                                        <ul class="dropdown-menu dropdown-menu-end">
                                            <li class="ss-dropdown-group-head">Invesco Finance Corp.</li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm danger">Ma</span>
                                                    <span class="dropdown-item-text">Marketing Team</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm success">Le</span>
                                                    <span class="dropdown-item-text">Leadership Group</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm info">De</span>
                                                    <span class="dropdown-item-text">Design team</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li class="ss-dropdown-group-head">My Other Company</li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm warning"><i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i></span>
                                                    <span class="dropdown-item-text">Other company A</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm dark"><i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i></span>
                                                    <span class="dropdown-item-text">Other company B</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm primary"><i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i></span>
                                                    <span class="dropdown-item-text">Other company C</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <div class="ss-dropdown dropdown js-single-select">
                                    <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Multiple Roles</span>
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </a>
                                    <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Super Admin</strong>
                                                    <small>Create, edit add users, add groups, sell</small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Group Admin</strong>
                                                    <small>Create, edit add users, add groups, </small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Admin</strong>
                                                    <small>Create, edit add users, add groups, </small>
                                                </span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">
                                                    <strong>Contributor</strong>
                                                    <small>Create, edit survey projects</small>
                                                </span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <div class="ss-dropdown dropdown js-single-select-withicon">
                                    <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-badge-icon sm dark">FG</span>
                                        <span class="ss-dropdown-toggle-txt">Flantonmix Gorfenhauser</span>
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-end">
                                        <span class="form-control-wrapper with-icon-left ss-dropdown-search">
                                            <input type="search" value="" name="input-name" class="form-control" placeholder="Search">
                                            <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                        </span>
                                        <ul class="search-overflow-scroll">
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">AG</span>
                                                    <span class="dropdown-item-text">Alantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">BG</span>
                                                    <span class="dropdown-item-text">Blantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">CG</span>
                                                    <span class="dropdown-item-text">Clantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">DG</span>
                                                    <span class="dropdown-item-text">Dlantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">EG</span>
                                                    <span class="dropdown-item-text">Elantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                </a>
                                            </li>
                                            <li class="no-result-msg d-none">
                                                <span class="p1">No result found</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <div class="ss-dropdown dropdown js-single-select-withicon">
                                    <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline theme-b" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-badge-icon sm bg-danger">Ma</span>
                                        <span class="ss-dropdown-toggle-txt">Marketing Team</span>
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-end">
                                        <ul class="search-overflow-scroll">
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge active">
                                                    <span class="ss-badge-icon sm bg-danger">Ma</span>
                                                    <span class="dropdown-item-text">Marketing Team</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-secondary">Le</span>
                                                    <span class="dropdown-item-text">Leadership Group</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-yellow">De</span>
                                                    <span class="dropdown-item-text">Design team</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">HR</span>
                                                    <span class="dropdown-item-text">HR team</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">BUTTON SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown js-single-select">
                                    <button type="button" class="btn btn-dark with-icon-right" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span>Action</span>
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-download"><svg><use xlink:href="#ss-icon-download"></use></svg></i>
                                                <span class="dropdown-item-text">Export Data</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-share"><svg><use xlink:href="#ss-icon-share"></use></svg></i>
                                                <span class="dropdown-item-text">Share Results</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-chart-pie"><svg><use xlink:href="#ss-icon-chart-pie"></use></svg></i>
                                                <span class="dropdown-item-text">Generate Report</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">SINGLE SELECT WITH SEARCH AND SCROLL</h4>
                                <div class="ss-dropdown d-block dropdown js-single-select">
                                    <a href="javascript:;" role="button" class="ss-dropdown-toggle-ag" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                        <i class="ss-icon-plus-circle"><svg><use xlink:href="#ss-icon-plus-circle"></use></svg></i>
                                        <span>Add group membership</span>
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-bottom-center without-arrow">
                                        <span class="form-control-wrapper with-icon-left ss-dropdown-search">
                                            <input type="search" value="" name="input-name" class="form-control" placeholder="Search">
                                            <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                        </span>
                                        <ul class="search-overflow-scroll">
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-badge">
                                                    <span class="ss-badge-icon sm bg-dark">FG</span>
                                                    <span class="dropdown-item-text">Flantonmix Gorfenhauser</span>
                                                    <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                                </a>
                                            </li>
                                            <li class="no-result-msg d-none">
                                                <span class="p1">No result found</span>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">TIME PERIOD SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown js-single-select">
                                    <button type="button" class="btn btn-primary with-icon-sep" data-bs-offset="0,8" data-bs-toggle="dropdown" aria-expanded="false">
                                        <span class="ss-dropdown-toggle-txt">Period 1</span>
                                        <i class="ss-icon-caret-down"><svg><use xlink:href="#ss-icon-caret-down"></use></svg></i>
                                    </button>
                                    <div class="dropdown-menu dropdown-menu-end p-0">
                                        <ul class="search-overflow-scroll">
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-date active">
                                                    <span class="dropdown-item-text">Period 1</span>
                                                    <span class="dropdown-item-date">2/3/2021</span>
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                    <span class="dropdown-item-date">5/3/2021</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-date">
                                                    <span class="dropdown-item-text">Period 2</span>
                                                    <span class="dropdown-item-date">2/3/2021</span>
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                    <span class="dropdown-item-date">5/3/2021</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-date">
                                                    <span class="dropdown-item-text">Period 3</span>
                                                    <span class="dropdown-item-date">2/3/2021</span>
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                    <span class="dropdown-item-date">5/3/2021</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-date">
                                                    <span class="dropdown-item-text">Period 4</span>
                                                    <span class="dropdown-item-date">2/3/2021</span>
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                    <span class="dropdown-item-date">5/3/2021</span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-date">
                                                    <span class="dropdown-item-text">Period 5</span>
                                                    <span class="dropdown-item-date">2/3/2021</span>
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                    <span class="dropdown-item-date">5/3/2021</span>
                                                </a>
                                            </li>
                                        </ul>
                                        <a class="ss-dropdown-flink text-uppercase">MANAGE PERIODS</a>
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">PESONALIZE SINGLE SELECT</h4>
                                <div class="ss-dropdown dropdown dropup js-single-select">
                                    <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" data-bs-auto-close="outside" aria-expanded="false">
                                        <span>Personalize</span>
                                        <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-end ss-dropdown-prsnlz">
                                        <div class="ss-dropdown-prsnlz-head">
                                            <h4 class="h5 text-uppercase">INSERT PERSONALIZED TOKEN</h4>
                                            <div class="row align-items-center">
                                                <div class="col-8">
                                                    <div class="form-group mb-0">
                                                        <span class="form-control-wrapper">
                                                            <select name="wym_token_type" class="form-control sm">
                                                                <option selected value="1">Participant</option>
                                                                <option value="2">Survey </option>
                                                                <option value="3">Target Talent</option>
                                                            </select>
                                                        </span>
                                                    </div>
                                                </div>
                                                <div class="col-4">
                                                    <div class="p2 text-gray-300">Select Type</div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="ss-dropdown-prsnlz-b">
                                            <!-- you can add/remove "d-none" class to hide/show below seletable items based on above select box -->
                                            <a href="javascript:;" class="dropdown-item" data-bs-hide="dropdown">
                                                <span class="dropdown-item-text">First name</span>
                                            </a>
                                            <a href="javascript:;" class="dropdown-item active" data-bs-hide="dropdown">
                                                <span class="dropdown-item-text">Last name</span>
                                            </a>
                                            <a href="javascript:;" class="dropdown-item" data-bs-hide="dropdown">
                                                <span class="dropdown-item-text">Email</span>
                                            </a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br>
                        <h2 class="h1">Multi select Dropdowns</h2>
                        <div class="row">
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">TAGS Multiselect</h4>
                                <div class="ss-dropdown dropdown d-block js-multi-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected" data-placeholder="Dropdown">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Switcher Multiselect</h4>
                                <div class="ss-dropdown dropdown d-block js-multi-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected" data-placeholder="Dropdown">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder two</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder three</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5 align-self-center">
                                <h4 class="text-uppercase">Elipsis Multiselect</h4>
                                <div class="ss-dropdown dropdown js-multi-select">
                                    <button type="button" class="btn-icon" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected">
                                        <i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder two</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder three</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Filter Multiselect</h4>
                                <div class="ss-dropdown dropdown d-block js-multi-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected" data-placeholder="Filter Items">
                                        <span class="ss-dropdown-toggle-txt">Filter Items</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <span class="form-control-wrapper with-icon-left ss-dropdown-search">
                                                <input type="search" value="" name="input-name" class="form-control" placeholder="Search">
                                                <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                            </span>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                <span class="dropdown-item-text">Placeholder three</span>
                                                <span class="ss-dropdown-checkbox-count">25</span>
                                            </a>
                                        </li>
                                        <li class="no-result-msg d-none">
                                            <span class="p1">No result found</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Nested Multi SELECT</h4>
                                <div class="ss-dropdown dropdown d-block js-multi-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected" data-placeholder="Dropdown">
                                        <span class="ss-dropdown-toggle-txt">Dropdown</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li class="dropdown dropend">
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon dropdown-submenu-toggle" data-bs-offset="0,17" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Submenu Toggle</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder one</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder two</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder three</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Menu Multi SELECT</h4>
                                <div class="ss-dropdown dropdown js-multi-select">
                                    <button type="button" class="ss-dropdown-toggle" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false" data-selected-prefix="Selected" data-placeholder="Menu">
                                        <span class="ss-dropdown-toggle-txt">Menu</span>
                                        <span class="ss-dropdown-arrow">
                                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                        </span>
                                    </button>
                                    <ul class="dropdown-menu dropdown-menu-end">
                                        <li class="ss-dropdown-group-head">Help</li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder two</span>
                                            </a>
                                        </li>
                                        <li class="dropdown dropend">
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon dropdown-submenu-toggle" data-bs-offset="0,17" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Submenu Toggle</span>
                                                <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder one</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder two</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-checkbox">
                                                        <span class="ss-dropdown-checkbox-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">Placeholder three</span>
                                                        <span class="ss-dropdown-checkbox-count">25</span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li class="ss-dropdown-group-head">About</li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder four</span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-switcher">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder one</span>
                                                <span class="ss-dropdown-switcher-ui"><i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i></span>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="javascript:;" class="dropdown-item ss-dpitem-icon">
                                                <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                                                <span class="dropdown-item-text">Placeholder six</span>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Invite User Multiselect</h4>
                                <div class="ss-dropdown dropdown js-multi-select">
                                    <a class="btn btn-dark with-icon" role="button" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                        <span>Invite Users</span>
                                    </a>
                                    <div class="dropdown-menu dropdown-menu-end ss-dropdown-iu">
                                        <span class="form-control-wrapper with-icon-left ss-dropdown-search">
                                            <input type="search" value="" name="input-name" class="form-control" placeholder="Add Person by Name">
                                            <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                                        </span>
                                        <ul class="search-overflow-scroll">
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Adam Black</span>
                                                        <span class="ss-dpitem-person-email">adam_black@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">John Doe</span>
                                                        <span class="ss-dpitem-person-email">jdoe@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Eve Jackson</span>
                                                        <span class="ss-dpitem-person-email">eve.jackson@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Eva Smith</span>
                                                        <span class="ss-dpitem-person-email">esmith@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Hailey Caret</span>
                                                        <span class="ss-dpitem-person-email">hcaret@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Adam Black</span>
                                                        <span class="ss-dpitem-person-email">adam_black@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">John Doe</span>
                                                        <span class="ss-dpitem-person-email">jdoe@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Eve Jackson</span>
                                                        <span class="ss-dpitem-person-email">eve.jackson@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Eva Smith</span>
                                                        <span class="ss-dpitem-person-email">esmith@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li>
                                                <a href="javascript:;" class="dropdown-item ss-dpitem-person">
                                                    <span class="ss-dpitem-person-img">
                                                        <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                                        <!-- <span class="lazy-loader">
                                                            <span class="lazyload" data-original="images/avtar.png" data-preload="true"></span>
                                                        </span> -->
                                                    </span>
                                                    <span class="ss-dpitem-person-info">
                                                        <span class="dropdown-item-text">Hailey Caret</span>
                                                        <span class="ss-dpitem-person-email">hcaret@email.com</span>
                                                    </span>
                                                    <span class="ss-dpitem-person-pm">
                                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                                        <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                                                    </span>
                                                </a>
                                            </li>
                                            <li class="no-result-msg d-none">
                                                <span class="p1">No result found</span>
                                            </li>
                                        </ul>
                                        <div class="ss-dropdown-iu-footer">
                                            <a class="btn btn-primary btn-block">Invite to Group</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br>
                        <h2 class="h1">Form Dropdowns</h2>
                        <div class="row">
                            <div class="col-3 mb-5">
                                <h4 class="text-uppercase">Invite form dropdown</h4>
                                <div class="ss-dropdown dropdown d-block ">
                                    <a class="btn btn-secondary with-icon" role="button" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
                                        <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                                        <span>Invite</span>
                                    </a>
                                    <div class="dropdown-menu ss-dropdown-form dropdown-menu-end">
                                        <div class="ss-dropdown-head">
                                            <h4 class="h4 mb-0 text-center">Invite to Organization</h4>
                                        </div>
                                        <form name="invite-form" method="POST" action="#">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group">
                                                        <label class="form-label">Label</label>
                                                        <span class="form-control-wrapper with-icon-left">
                                                            <input type="text" value="" name="input-name" class="form-control" placeholder="Separate Emails with Comma">
                                                            <i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group">
                                                        <label class="form-label">Label</label>
                                                        <span class="form-control-wrapper">
                                                            <select class="form-control" data-placeholder="Member (create, edit survey projects)">
                                                                <!-- don't rmeove below blank option because it's for show placeholder -->
                                                                <option label="Placeholder"></option>
                                                                <option value="1">Member One</option>
                                                                <option value="2">Member Two</option>
                                                                <option value="3">Member Three</option>
                                                                <option value="4">Member Four</option>
                                                                <option value="5">Member Five</option>
                                                            </select>
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group">
                                                        <label class="form-label">Label</label>
                                                        <span class="form-control-wrapper">
                                                            <input type="text" value="" name="input-name" class="form-control" placeholder="Placeholder">
                                                        </span>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row ss-dropdown-btn-row">
                                                <div class="col-6">
                                                    <a class="btn btn-light btn-block" data-bs-hide="dropdown">Cancel</a>
                                                </div>
                                                <div class="col-6">
                                                    <button type="submit" class="btn btn-primary btn-block">Submit</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br><br>
                        <h2 class="h1 text-center">Pop-Overs</h2>
                        <div class="row">
                            <div class="col-6 offset-3 text-center">
                                <a class="btn btn-dark popover-dismiss" data-bs-toggle="popover" data-bs-placement="top" data-bs-trigger="click" data-bs-html="true" data-bs-offset="[0,20]" data-bs-content="<div class='ss-popover-body text-center'><p>Are you sure you want to <strong>force close</strong> this survey? </p></div><div class='ss-popover-footer text-center'><a class='btn btn-danger'>Force Close</a><a class='btn btn-light ss-popover-close'>Cancel</a></div>">Show Top</a>

                                <a class="btn btn-dark" data-bs-toggle="popover" data-bs-placement="bottom" data-bs-trigger="click" data-bs-html="true" data-bs-offset="[0,20]" data-bs-content="<div class='ss-popover-body text-center'><p>Are you sure you want to <strong>force close</strong> this survey? </p></div><div class='ss-popover-footer text-center'><a class='btn btn-danger'>Force Close</a><a class='btn btn-light ss-popover-close'>Cancel</a></div>">Show Bottom</a>

                                <a class="btn btn-dark" data-bs-toggle="popover" data-bs-placement="right" data-bs-trigger="click" data-bs-html="true" data-bs-offset="[0,20]" data-bs-content="<div class='ss-popover-body text-center'><p>Are you sure you want to <strong>force close</strong> this survey? </p></div><div class='ss-popover-footer text-center'><a class='btn btn-danger'>Force Close</a><a class='btn btn-light ss-popover-close'>Cancel</a></div>">Show RIght</a>

                                <a class="btn btn-dark" data-bs-toggle="popover" data-bs-placement="left" data-bs-trigger="click" data-bs-html="true" data-bs-offset="[0,20]" data-bs-content="<div class='ss-popover-body text-center'><p>Are you sure you want to <strong>force close</strong> this survey? </p></div><div class='ss-popover-footer text-center'><a class='btn btn-danger'>Force Close</a><a class='btn btn-light ss-popover-close'>Cancel</a></div>">Show Left</a>
                            </div>
                        </div>
                        <br><br>
                        <h2 class="h1 text-center">Tooltip</h2>
                        <div class="row">
                            <div class="col-6 offset-3 text-center">
                                <a tabindex="0" class="btn btn-dark" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip text will be added here as required">Show Top</a>

                                <a tabindex="0" class="btn btn-dark" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tooltip text will be added here as required">Show Bottom</a>

                                <a tabindex="0" class="btn btn-dark" data-bs-toggle="tooltip" data-bs-placement="right" title="Tooltip text will be added here as required">Show RIght</a>

                                <a tabindex="0" class="btn btn-dark" data-bs-toggle="tooltip" data-bs-placement="left" title="Tooltip text will be added here as required">Show Left</a>
                            </div>
                        </div>
                        <br><br>

                        <strong style="display:block;color:red;font-size: 42px">Tables</strong>
                        <br>

                        <h3>Survey Tracking Tables</h3>
                        <table class="ss-table mb-5">
                            <thead>
                                <tr>
                                    <th width="30px" class="text-end">&nbsp;</th>
                                    <th>EMAIL / PHONE NUMBER</th>
                                    <th>First Name</th>
                                    <th>Last Name</th>
                                    <th>Group</th>
                                    <th>Status</th>
                                    <th>Sent Time Stamp</th>
                                    <th>Last Activity</th>
                                    <th class="text-end">&nbsp;</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                    <td><span class="ss-status">Scheduled</span></td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-mobile"><svg><use xlink:href="#ss-icon-mobile"></use></svg></i>+43 123 456 7890</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                    <td><span class="ss-status primary">In Progress</span></td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                    <td><span class="ss-status secondary">Submitted</span></td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-mobile"><svg><use xlink:href="#ss-icon-mobile"></use></svg></i>+43 123 456 7890</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                    <td><span class="ss-status warning">Bounced</span></td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                    <td><span class="ss-status danger">Sent/Received</span></td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td>9/8/2020; 8:30am CDT</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                            </tbody>
                        </table>

                        <table class="ss-table mb-5">
                            <thead>
                                <tr>
                                    <th width="30px" class="text-end">&nbsp;</th>
                                    <th>EMAIL / PHONE NUMBER</th>
                                    <th>First Name</th>
                                    <th>Last Name</th>
                                    <th>Group</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-mobile"><svg><use xlink:href="#ss-icon-mobile"></use></svg></i>+43 123 456 7890</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-mobile"><svg><use xlink:href="#ss-icon-mobile"></use></svg></i>+43 123 456 7890</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                </tr>
                                <tr>
                                    <td class="text-end"><span class="ss-table-no">2</span></td>
                                    <td class="text-nowrap"><i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>eve@example.com</td>
                                    <td>Eve</td>
                                    <td>Doe</td>
                                    <td>Peer</td>
                                </tr>
                            </tbody>
                        </table>

                        <h3>Survey Invoice Tables</h3>
                        <table class="ss-table-history">
                            <thead>
                                <tr>
                                    <th>Date</th>
                                    <th>Invoice #</th>
                                    <th>Description</th>
                                    <th class="text-end">Total</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>05/15/2020</td>
                                    <td>7306542</td>
                                    <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                    <td class="text-end">$280.00</td>
                                </tr>
                                <tr>
                                    <td>04/21/2020</td>
                                    <td>7306541</td>
                                    <td>SurveySaurus License (50-499 Employees | Medium</td>
                                    <td class="text-end">$240.00</td>
                                </tr>
                                <tr>
                                    <td>05/02/2020</td>
                                    <td>7306540</td>
                                    <td>SurveySaurus License (50-499 Employees | Medium</td>
                                    <td class="text-end">$867.00</td>
                                </tr>
                            </tbody>
                        </table>
                        <br>

                        <h3>Survey payment Methods Tables</h3>
                        <table class="ss-table-pd highlight-oddeven">
                            <tbody>
                                <tr>
                                    <td>
                                        <div class="ss-setcdr-card-row">
                                            <div class="ss-setcdr-card-img sm">
                                                <span class="lazy-loader contain">
                                                    <img class="lazyload" src="images/blank.gif" data-original="images/visa.png" alt="">
                                                </span>
                                            </div>
                                            <div class="ss-setcdr-card-info">
                                                <p>*** *** *** 1234</p>
                                            </div>
                                        </div>
                                    </td>
                                    <td class="text-uppercase">Adam Smithly</td>
                                    <td>08/2025</td>
                                    <td class="text-end">
                                        <a href="#ss-update-payment-method-modal" data-bs-toggle="modal" class="btn btn-light btn-sm">Edit Info</a>
                                    </td>
                                    <td class="text-center">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i>
                                            <span class="visually-hidden">Delete</span>
                                        </a>
                                    </td>
                                    <td class="text-center">
                                        <span class="ss-table-pd-sep"></span>
                                    </td>
                                    <td>
                                        <span class="ss-checkradio type-radio primary reversed checked">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-checkradio-text">Active</span>
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-setcdr-card-row">
                                            <div class="ss-setcdr-card-img sm">
                                                <span class="lazy-loader contain">
                                                    <img class="lazyload" src="images/blank.gif" data-original="images/visa.png" alt="">
                                                </span>
                                            </div>
                                            <div class="ss-setcdr-card-info">
                                                <p>*** *** *** 4872</p>
                                            </div>
                                        </div>
                                    </td>
                                    <td class="text-uppercase">Tamison Faximillion</td>
                                    <td>06/2027</td>
                                    <td class="text-end">
                                        <a href="#ss-update-payment-method-modal" data-bs-toggle="modal" class="btn btn-light btn-sm">Edit Info</a>
                                    </td>
                                    <td class="text-center">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i>
                                            <span class="visually-hidden">Delete</span>
                                        </a>
                                    </td>
                                    <td class="text-center">
                                        <span class="ss-table-pd-sep"></span>
                                    </td>
                                    <td>
                                        <span class="ss-checkradio type-radio primary reversed">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-checkradio-text">Inactive</span>
                                        </span>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-setcdr-card-row">
                                            <div class="ss-setcdr-card-img sm">
                                                <span class="lazy-loader contain">
                                                    <img class="lazyload" src="images/blank.gif" data-original="images/visa.png" alt="">
                                                </span>
                                            </div>
                                            <div class="ss-setcdr-card-info">
                                                <p>*** *** *** 1234</p>
                                            </div>
                                        </div>
                                    </td>
                                    <td class="text-uppercase">Adam Smithly</td>
                                    <td>08/2025</td>
                                    <td class="text-end">
                                        <a href="#ss-update-payment-method-modal" data-bs-toggle="modal" class="btn btn-light btn-sm">Edit Info</a>
                                    </td>
                                    <td class="text-center">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i>
                                            <span class="visually-hidden">Delete</span>
                                        </a>
                                    </td>
                                    <td class="text-center">
                                        <span class="ss-table-pd-sep"></span>
                                    </td>
                                    <td>
                                        <span class="ss-checkradio type-radio primary reversed">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-checkradio-text">Inactive</span>
                                        </span>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <br>

                        <h3>Survey Audience List Tables</h3>
                        <table class="ss-table-al">
                            <tbody>
                                <tr>
                                    <td width="66px">
                                        <label class="ss-checkradio primary">
                                            <input type="checkbox" value="" name="aud_standard_list[]">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                            </span>
                                        </label>
                                    </td>
                                    <td>
                                        <div class="p1"><a href="#">Janice Miller - Team (2)</a></div>
                                        <div class="p2">Target: Janice Miller</div>
                                    </td>
                                    <td class="text-center">
                                        <a class="ss-tag m-0 dark">
                                            <span class="ss-tag-txt">Target List</span>
                                        </a>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>43</strong></div>
                                        <div class="p2">Raters</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>3</strong></div>
                                        <div class="p2">Surveys Used</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p2">8/11/2021</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="66px">
                                        <label class="ss-checkradio primary">
                                            <input type="checkbox" value="" name="aud_standard_list[]">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                            </span>
                                        </label>
                                    </td>
                                    <td>
                                        <div class="p1"><a href="#">Janice Miller - Team (2)</a></div>
                                        <div class="p2">Target: Janice Miller</div>
                                    </td>
                                    <td class="text-center">
                                        <a class="ss-tag m-0 dark">
                                            <span class="ss-tag-txt">Target List</span>
                                        </a>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>43</strong></div>
                                        <div class="p2">Raters</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>3</strong></div>
                                        <div class="p2">Surveys Used</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p2">8/11/2021</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="66px">
                                        <label class="ss-checkradio primary">
                                            <input type="checkbox" value="" name="aud_standard_list[]">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                            </span>
                                        </label>
                                    </td>
                                    <td>
                                        <div class="p1"><a href="#">Janice Miller - Team (2)</a></div>
                                        <div class="p2">Target: Janice Miller</div>
                                    </td>
                                    <td class="text-center">
                                        <a class="ss-tag m-0 dark">
                                            <span class="ss-tag-txt">Target List</span>
                                        </a>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>43</strong></div>
                                        <div class="p2">Raters</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>3</strong></div>
                                        <div class="p2">Surveys Used</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p2">8/11/2021</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="66px">
                                        <label class="ss-checkradio primary">
                                            <input type="checkbox" value="" name="aud_standard_list[]">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                            </span>
                                        </label>
                                    </td>
                                    <td>
                                        <div class="p1"><a href="#">Janice Miller - Team (2)</a></div>
                                        <div class="p2">Target: Janice Miller</div>
                                    </td>
                                    <td class="text-center">
                                        <a class="ss-tag m-0 dark">
                                            <span class="ss-tag-txt">Target List</span>
                                        </a>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>43</strong></div>
                                        <div class="p2">Raters</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>3</strong></div>
                                        <div class="p2">Surveys Used</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p2">8/11/2021</div>
                                    </td>
                                </tr>
                                <tr>
                                    <td width="66px">
                                        <label class="ss-checkradio primary">
                                            <input type="checkbox" value="" name="aud_standard_list[]">
                                            <span class="ss-checkradio-ui">
                                                <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                                            </span>
                                        </label>
                                    </td>
                                    <td>
                                        <div class="p1"><a href="#">Janice Miller - Team (2)</a></div>
                                        <div class="p2">Target: Janice Miller</div>
                                    </td>
                                    <td class="text-center">
                                        <a class="ss-tag m-0 dark">
                                            <span class="ss-tag-txt">Target List</span>
                                        </a>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>43</strong></div>
                                        <div class="p2">Raters</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p1"><strong>3</strong></div>
                                        <div class="p2">Surveys Used</div>
                                    </td>
                                    <td class="text-end">
                                        <div class="p2">8/11/2021</div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <br>

                        <h3>Input Fields Tables</h3>
                        <div class="ss-table-inputs">
                            <div class="ss-table-inputs-h">
                                <div class="ss-table-inputs-cell">
                                    <strong class="text-uppercase">EMAIL</strong>
                                </div>
                                <div class="ss-table-inputs-cell">
                                    <strong class="text-uppercase">Phone Number</strong>
                                </div>
                                <div class="ss-table-inputs-cell">
                                    <strong class="text-uppercase">First Name</strong>
                                </div>
                                <div class="ss-table-inputs-cell">
                                    <strong class="text-uppercase">Last Name</strong>
                                </div>
                                <div class="ss-table-inputs-cell">
                                    <strong class="text-uppercase">Group</strong>
                                </div>
                                <div class="ss-table-inputs-cell">&nbsp;</div>
                            </div>
                            <div class="ss-table-inputs-b">
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                                <div class="ss-table-inputs-row">
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a flexible">
                                                <input type="text" value="" name="contact_email[]" class="form-control" placeholder="Email">
                                                <span class="flexible-lbl">
                                                    <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                                                </span>
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_phone[]" class="form-control" placeholder="Phone Number">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_fname[]" class="form-control" placeholder="First Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_lname[]" class="form-control" placeholder="Last Name">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <div class="form-group mb-0">
                                            <span class="form-control-wrapper theme-a">
                                                <input type="text" value="" name="contact_group[]" class="form-control" placeholder="Group">
                                            </span>
                                        </div>
                                    </div>
                                    <div class="ss-table-inputs-cell">
                                        <a class="btn-icon danger">
                                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                                            <span class="visually-hidden">Remove</span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <br>

                        <h3>Survey Tracking Tables</h3>
                        <table class="ss-table ss-table-theme-b highlight-oddeven">
                            <thead>
                                <tr>
                                    <th>Date</th>
                                    <th>Invoice #</th>
                                    <th>DESCRIPTION</th>
                                    <th>Total</th>
                                    <th width="42px">&nbsp;</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                   <td>May 17, 2020</td>
                                   <td>7309853</td>
                                   <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                   <td>$280.00</td>
                                   <td><a class="btn-icon"><i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>May 17, 2020</td>
                                    <td>7309853</td>
                                    <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                    <td>$280.00</td>
                                    <td><a class="btn-icon"><i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i></a></td>
                                 </tr>
                                 <tr>
                                    <td>May 17, 2020</td>
                                    <td>7309853</td>
                                    <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                    <td>$280.00</td>
                                    <td><a class="btn-icon"><i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i></a></td>
                                 </tr>
                                 <tr>
                                    <td>May 17, 2020</td>
                                    <td>7309853</td>
                                    <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                    <td>$280.00</td>
                                    <td><a class="btn-icon"><i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i></a></td>
                                 </tr>
                                 <tr>
                                    <td>May 17, 2020</td>
                                    <td>7309853</td>
                                    <td>Team Effectiveness, 360-Degree Survey Credit(s)</td>
                                    <td>$280.00</td>
                                    <td><a class="btn-icon"><i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i></a></td>
                                 </tr>
                            </tbody>
                        </table>
                        <div class="ss-table-btns">
                            <a class="btn btn-outline-dark with-icon">
                                <i class="ss-icon-arrow-left-two"><svg><use xlink:href="#ss-icon-arrow-left-two"></use></svg></i>
                                <span>Previous 5</span>
                            </a>
                            <a class="btn btn-outline-dark with-icon-right">
                                <span>Next 5</span>
                                <i class="ss-icon-arrow-right"><svg><use xlink:href="#ss-icon-arrow-right"></use></svg></i>
                            </a>
                        </div>

                        <h3>User/Team Tracking</h3>
                        <table class="ss-table ss-table-theme-b">
                            <thead>
                                <tr>
                                    <th>Person</th>
                                    <th>ROLE</th>
                                    <th>GROUP</th>
                                    <th class="text-end">Latest Activity</th>
                                    <th class="text-end">&nbsp;</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td>Group Admin</td>
                                    <td>
                                        <div class="ss-badge-row">
                                            <span class="ss-badge-icon dark">Sa</span>
                                            <span class="ss-badge-txt">Sales</span>
                                        </div>
                                    </td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Multiple Roles</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td>
                                        <div class="ss-badge-row">
                                            <span class="ss-badge-icon success">Sa</span>
                                            <span class="ss-badge-txt">Sales</span>
                                        </div>
                                    </td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td>Member</td>
                                    <td>
                                        <div class="ss-badge-row">
                                            <span class="ss-badge-icon warning">Sa</span>
                                            <span class="ss-badge-txt">Sales</span>
                                        </div>
                                    </td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td>Admin</td>
                                    <td>
                                        <div class="ss-badge-row">
                                            <span class="ss-badge-icon primary">Sa</span>
                                            <span class="ss-badge-txt">Sales</span>
                                        </div>
                                    </td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td>Admin</td>
                                    <td>
                                        <div class="ss-badge-row">
                                            <span class="ss-badge-icon light">Sa</span>
                                            <span class="ss-badge-txt">Sales</span>
                                        </div>
                                    </td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                            </tbody>
                        </table>

                        <table class="ss-table ss-table-theme-b">
                            <thead>
                                <tr>
                                    <th>Person</th>
                                    <th class="text-end">USER ROLE</th>
                                    <th class="text-end">Survey Projects</th>
                                    <th class="text-end">Latest Activity</th>
                                    <th class="text-end">&nbsp;</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <span class="lazy-loader">
                                                    <span class="lazyload" data-original="images/avtar.png"></span>
                                                </span>
                                                <span class="ss-favorite-badge"><i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i></span>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="text-end">
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Group Admin</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b active">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td class="text-end">20 Projects</td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <span class="lazy-loader">
                                                    <span class="lazyload" data-original="images/avtar.png"></span>
                                                </span>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="text-end">
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Group Admin</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b active">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td class="text-end">20 Projects</td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <span class="lazy-loader">
                                                    <span class="lazyload" data-original="images/avtar.png"></span>
                                                </span>
                                                <span class="ss-favorite-badge"><i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i></span>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="text-end">
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Group Admin</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b active">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td class="text-end">20 Projects</td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <span class="lazy-loader">
                                                    <span class="lazyload" data-original="images/avtar.png"></span>
                                                </span>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="text-end">
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Group Admin</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b active">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td class="text-end">20 Projects</td>
                                    <td class="text-end">5/10/2020</td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                                <tr>
                                    <td>
                                        <div class="ss-person-row">
                                            <span class="ss-person-img">
                                                <span class="lazy-loader">
                                                    <span class="lazyload" data-original="images/avtar.png"></span>
                                                </span>
                                                <span class="ss-favorite-badge"><i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i></span>
                                            </span>
                                            <span class="ss-person-info">
                                                <strong class="ss-person-name">Jane Doe</strong>
                                                <span class="ss-person-email">jdoe@email.com</span>
                                            </span>
                                        </div>
                                    </td>
                                    <td class="text-end">
                                        <div class="ss-dropdown dropdown js-single-select">
                                            <a href="javascript:;" role="button" class="ss-dropdown-toggle-inline" data-bs-offset="0,8" data-bs-toggle="dropdown" data-bs-display="static" aria-expanded="false">
                                                <span class="ss-dropdown-toggle-txt">Group Admin</span>
                                                <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                                            </a>
                                            <ul class="dropdown-menu ss-dropdown-table dropdown-menu-bottom-center">
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Super Admin</strong>
                                                            <small>Create, edit add users, add groups, sell</small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b active">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Group Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Admin</strong>
                                                            <small>Create, edit add users, add groups, </small>
                                                        </span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="javascript:;" class="dropdown-item ss-dpitem-radio-b">
                                                        <span class="ss-dropdown-radio-b-ui"><i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i></span>
                                                        <span class="dropdown-item-text">
                                                            <strong>Contributor</strong>
                                                            <small>Create, edit survey projects</small>
                                                        </span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td class="text-end">20 Projects</td>
                                    <td class="text-end">
                                        <a class="btn btn-outline-light btn-sm">Resend Invite</a>
                                    </td>
                                    <td class="text-end"><a class="btn-icon"><i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i></a></td>
                                </tr>
                            </tbody>
                        </table>

                        <br><br>
                        <strong style="display:block;color:red;font-size: 42px">Icons/Symbols</strong>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-common" style="font-size: 11.7rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ss-eda-surveys-logo.png" alt="EDA SURVEYS">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-common</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-common" style="font-size: 11.7rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ss-eda-culture-logo.png" alt="EDA CULTURE">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-common</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-common" style="font-size: 11.7rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ss-eda-email-logo.png" alt="EDA EMAIL">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-common</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-common" style="font-size: 11.7rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ss-eda-binders-logo.png" alt="EDA BINDERS">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-common</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo bg-dark" style="font-size: 15.4rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ssl-logo-white.png" alt="EDA SURVEYS">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-colored" style="font-size: 15.4rem;">
                                <span class="lazy-loader no-loader">
                                    <img class="lazyload" src="images/blank.gif" data-original="images/ssl-logo.png" alt="EDA SURVEYS">
                                </span>
                            </i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-colored</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logo-stripe"><svg><use xlink:href="#ss-icon-logo-stripe"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-logo-stripe</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-heart-hand"><svg><use xlink:href="#ss-icon-heart-hand"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-heart-hand</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-ai"><svg><use xlink:href="#ss-icon-ai"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-ai</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-ai-outline"><svg><use xlink:href="#ss-icon-ai-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-ai-outline</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-growth"><svg><use xlink:href="#ss-icon-growth"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-growth</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-bulb"><svg><use xlink:href="#ss-icon-bulb"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-bulb</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-heart-box"><svg><use xlink:href="#ss-icon-heart-box"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-heart-box</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-signal"><svg><use xlink:href="#ss-icon-signal"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-signal</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-bolt"><svg><use xlink:href="#ss-icon-bolt"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-bolt</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-thumbup"><svg><use xlink:href="#ss-icon-thumbup"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-thumbup</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-refresh"><svg><use xlink:href="#ss-icon-refresh"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-refresh</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-ribbon"><svg><use xlink:href="#ss-icon-ribbon"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-ribbon</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-man"><svg><use xlink:href="#ss-icon-man"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-man</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-discover"><svg><use xlink:href="#ss-icon-discover"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-discover</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-twitter"><svg><use xlink:href="#ss-icon-twitter"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-twitter</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-facebook"><svg><use xlink:href="#ss-icon-facebook"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-facebook</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-linkedin"><svg><use xlink:href="#ss-icon-linkedin"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-linkedin</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-instagram"><svg><use xlink:href="#ss-icon-instagram"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-instagram</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-website"><svg><use xlink:href="#ss-icon-website"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-website</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-camera"><svg><use xlink:href="#ss-icon-camera"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-camera</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sticker"><svg><use xlink:href="#ss-icon-sticker"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sticker</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sticker-check"><svg><use xlink:href="#ss-icon-sticker-check"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sticker-check</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-link"><svg><use xlink:href="#ss-icon-link"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-link</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-analytics"><svg><use xlink:href="#ss-icon-analytics"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-analytics</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-external"><svg><use xlink:href="#ss-icon-external"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-external</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-logout"><svg><use xlink:href="#ss-icon-logout"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-logout</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-alt-up"><svg><use xlink:href="#ss-icon-arrow-alt-up"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-alt-up</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sort"><svg><use xlink:href="#ss-icon-sort"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sort</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-alt-down"><svg><use xlink:href="#ss-icon-arrow-alt-down"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-alt-down</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-shift"><svg><use xlink:href="#ss-icon-arrow-shift"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-shift</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-break"><svg><use xlink:href="#ss-icon-arrow-break"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-break</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-bottom"><svg><use xlink:href="#ss-icon-arrow-bottom"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-bottom</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-up-circle"><svg><use xlink:href="#ss-icon-arrow-up-circle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-up-circle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-bottom-circle"><svg><use xlink:href="#ss-icon-arrow-bottom-circle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-bottom-circle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-bottom-line"><svg><use xlink:href="#ss-icon-arrow-bottom-line"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-bottom-line</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-left"><svg><use xlink:href="#ss-icon-arrow-left"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-left</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-left-two"><svg><use xlink:href="#ss-icon-arrow-left-two"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-left-two</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-long-right"><svg><use xlink:href="#ss-icon-arrow-long-right"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-long-right</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-right"><svg><use xlink:href="#ss-icon-arrow-right"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-right</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-right-line"><svg><use xlink:href="#ss-icon-arrow-right-line"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-right-line</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-top"><svg><use xlink:href="#ss-icon-arrow-top"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-top</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-top-line"><svg><use xlink:href="#ss-icon-arrow-top-line"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-top-line</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-arrow-reverse"><svg><use xlink:href="#ss-icon-arrow-reverse"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-arrow-reverse</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-bell-outline"><svg><use xlink:href="#ss-icon-bell-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-bell-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-bell-outline-x"><svg><use xlink:href="#ss-icon-bell-outline-x"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-bell-outline-x</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-books"><svg><use xlink:href="#ss-icon-books"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-books</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-building-fill"><svg><use xlink:href="#ss-icon-building-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-building-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-building-outline"><svg><use xlink:href="#ss-icon-building-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-building-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-buildings"><svg><use xlink:href="#ss-icon-buildings"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-buildings</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-calender"><svg><use xlink:href="#ss-icon-calender"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-calender</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-caret-down"><svg><use xlink:href="#ss-icon-caret-down"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-caret-down</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-caret-up"><svg><use xlink:href="#ss-icon-caret-up"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-caret-up</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chart-pie"><svg><use xlink:href="#ss-icon-chart-pie"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chart-pie</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chart-pie-fill"><svg><use xlink:href="#ss-icon-chart-pie-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chart-pie-fill</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chart-bar"><svg><use xlink:href="#ss-icon-chart-bar"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chart-bar</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-check-outline"><svg><use xlink:href="#ss-icon-check-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-check-outline</span>
                        </div>
                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-check-circle"><svg><use xlink:href="#ss-icon-check-circle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-check-circle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-check-checked"><svg><use xlink:href="#ss-icon-check-checked"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-check-checked</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-check-checked-fill"><svg><use xlink:href="#ss-icon-check-checked-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-check-checked-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-check-unchecked"><svg><use xlink:href="#ss-icon-check-unchecked"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-check-unchecked</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-board-checked"><svg><use xlink:href="#ss-icon-board-checked"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-board-checked</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-board-checked-outline"><svg><use xlink:href="#ss-icon-board-checked-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-board-checked-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-down"><svg><use xlink:href="#ss-icon-chevron-down"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-down</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-down-b"><svg><use xlink:href="#ss-icon-chevron-down-b"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-down-b</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-left"><svg><use xlink:href="#ss-icon-chevron-left"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-left</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-right"><svg><use xlink:href="#ss-icon-chevron-right"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-right</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-up"><svg><use xlink:href="#ss-icon-chevron-up"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-up</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-chevron-up-b"><svg><use xlink:href="#ss-icon-chevron-up-b"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-chevron-up-b</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-circle-fill"><svg><use xlink:href="#ss-icon-circle-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-circle-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-close"><svg><use xlink:href="#ss-icon-close"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-close</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-close-fill"><svg><use xlink:href="#ss-icon-close-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-close-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-close-fill-two"><svg><use xlink:href="#ss-icon-close-fill-two"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-close-fill-two</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-edit"><svg><use xlink:href="#ss-icon-comment-edit"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-edit</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment"><svg><use xlink:href="#ss-icon-comment"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-missed"><svg><use xlink:href="#ss-icon-comment-missed"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-missed</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-warning"><svg><use xlink:href="#ss-icon-comment-warning"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-warning</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-smile"><svg><use xlink:href="#ss-icon-comment-smile"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-smile</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-check"><svg><use xlink:href="#ss-icon-comment-check"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-check</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comment-check-fill"><svg><use xlink:href="#ss-icon-comment-check-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comment-check-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comments-alt"><svg><use xlink:href="#ss-icon-comments-alt"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comments-alt</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-comments-alt-fill"><svg><use xlink:href="#ss-icon-comments-alt-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-comments-alt-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-compass"><svg><use xlink:href="#ss-icon-compass"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-compass</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-edit"><svg><use xlink:href="#ss-icon-edit"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-edit</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-edit-fill"><svg><use xlink:href="#ss-icon-edit-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-edit-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-edit-square"><svg><use xlink:href="#ss-icon-edit-square"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-edit-square</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-edit-square-two"><svg><use xlink:href="#ss-icon-edit-square-two"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-edit-square-two</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-edit-learn"><svg><use xlink:href="#ss-icon-edit-learn"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-edit-learn</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-ellipsis-v"><svg><use xlink:href="#ss-icon-ellipsis-v"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-ellipsis-v</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-ellipsis-h"><svg><use xlink:href="#ss-icon-ellipsis-h"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-ellipsis-h</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dot-grid"><svg><use xlink:href="#ss-icon-dot-grid"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dot-grid</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dot-vline"><svg><use xlink:href="#ss-icon-dot-vline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dot-vline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-envelope-open"><svg><use xlink:href="#ss-icon-envelope-open"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-envelope-open</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-envelope"><svg><use xlink:href="#ss-icon-envelope"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-envelope</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-envelope-fill"><svg><use xlink:href="#ss-icon-envelope-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-envelope-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-envelope-square"><svg><use xlink:href="#ss-icon-envelope-square"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-envelope-square</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-eye"><svg><use xlink:href="#ss-icon-eye"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-eye</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-filter"><svg><use xlink:href="#ss-icon-filter"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-filter</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-folder-open"><svg><use xlink:href="#ss-icon-folder-open"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-folder-open</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-folders"><svg><use xlink:href="#ss-icon-folders"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-folders</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-grid-h"><svg><use xlink:href="#ss-icon-grid-h"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-grid-h</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-grid-h-fill"><svg><use xlink:href="#ss-icon-grid-h-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-grid-h-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-home"><svg><use xlink:href="#ss-icon-home"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-home</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-info"><svg><use xlink:href="#ss-icon-info"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-info</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-info-fill"><svg><use xlink:href="#ss-icon-info-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-info-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-triangle"><svg><use xlink:href="#ss-icon-triangle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-triangle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-triangle-o"><svg><use xlink:href="#ss-icon-triangle-o"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-triangle-o</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-list"><svg><use xlink:href="#ss-icon-list"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-list</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-list-b"><svg><use xlink:href="#ss-icon-list-b"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-list-b</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-list-squer"><svg><use xlink:href="#ss-icon-list-squer"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-list-squer</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-lock"><svg><use xlink:href="#ss-icon-lock"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-lock</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-medikit"><svg><use xlink:href="#ss-icon-medikit"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-medikit</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-minus"><svg><use xlink:href="#ss-icon-minus"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-minus</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-minus-circle"><svg><use xlink:href="#ss-icon-minus-circle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-minus-circle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-minus-circle-fill"><svg><use xlink:href="#ss-icon-minus-circle-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-minus-circle-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-plus"><svg><use xlink:href="#ss-icon-plus"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-plus</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-plus-fill"><svg><use xlink:href="#ss-icon-plus-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-plus-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-plus-circle"><svg><use xlink:href="#ss-icon-plus-circle"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-plus-circle</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-mobile"><svg><use xlink:href="#ss-icon-mobile"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-mobile</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-network"><svg><use xlink:href="#ss-icon-network"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-network</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-save"><svg><use xlink:href="#ss-icon-save"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-save</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-search"><svg><use xlink:href="#ss-icon-search"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-search</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-search-two"><svg><use xlink:href="#ss-icon-search-two"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-search-two</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-setting-fill"><svg><use xlink:href="#ss-icon-setting-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-setting-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-setting"><svg><use xlink:href="#ss-icon-setting"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-setting</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-settings-fill"><svg><use xlink:href="#ss-icon-settings-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-settings-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-share"><svg><use xlink:href="#ss-icon-share"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-share</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sitemap"><svg><use xlink:href="#ss-icon-sitemap"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sitemap</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sitemap-fill"><svg><use xlink:href="#ss-icon-sitemap-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sitemap-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sliders"><svg><use xlink:href="#ss-icon-sliders"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sliders</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sliders-v"><svg><use xlink:href="#ss-icon-sliders-v"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sliders-v</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-smile"><svg><use xlink:href="#ss-icon-smile"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-smile</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-star"><svg><use xlink:href="#ss-icon-star"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-star</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-star-outline"><svg><use xlink:href="#ss-icon-star-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-star-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-table"><svg><use xlink:href="#ss-icon-table"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-table</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-table-th"><svg><use xlink:href="#ss-icon-table-th"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-table-th</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-task"><svg><use xlink:href="#ss-icon-task"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-task</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-tasklist"><svg><use xlink:href="#ss-icon-tasklist"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-tasklist</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-trash"><svg><use xlink:href="#ss-icon-trash"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-trash</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-fill"><svg><use xlink:href="#ss-icon-user-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-check"><svg><use xlink:href="#ss-icon-user-check"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-check</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-check-outline"><svg><use xlink:href="#ss-icon-user-check-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-check-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-card"><svg><use xlink:href="#ss-icon-user-card"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-card</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-card-o"><svg><use xlink:href="#ss-icon-user-card-o"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-card-o</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-plus"><svg><use xlink:href="#ss-icon-user-plus"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-plus</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-plus-fill"><svg><use xlink:href="#ss-icon-user-plus-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-plus-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-class"><svg><use xlink:href="#ss-icon-users-class"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-class</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-class-fill"><svg><use xlink:href="#ss-icon-users-class-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-class-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-friend"><svg><use xlink:href="#ss-icon-users-friend"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-friend</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-friend-fill"><svg><use xlink:href="#ss-icon-users-friend-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-friend-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users"><svg><use xlink:href="#ss-icon-users"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-fill"><svg><use xlink:href="#ss-icon-users-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-user-setting"><svg><use xlink:href="#ss-icon-user-setting"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-user-setting</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-users-setting"><svg><use xlink:href="#ss-icon-users-setting"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-users-setting</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-wrench"><svg><use xlink:href="#ss-icon-wrench"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-wrench</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-watch"><svg><use xlink:href="#ss-icon-watch"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-watch</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-clock"><svg><use xlink:href="#ss-icon-clock"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-clock</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-branch"><svg><use xlink:href="#ss-icon-branch"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-branch</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-copy"><svg><use xlink:href="#ss-icon-copy"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-copy</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-award"><svg><use xlink:href="#ss-icon-award"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-award</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-trophy"><svg><use xlink:href="#ss-icon-trophy"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-trophy</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-trophy-shield"><svg><use xlink:href="#ss-icon-trophy-shield"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-trophy-shield</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-pagebreak"><svg><use xlink:href="#ss-icon-pagebreak"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-pagebreak</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-flag"><svg><use xlink:href="#ss-icon-flag"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-flag</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-download"><svg><use xlink:href="#ss-icon-download"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-download</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-upload"><svg><use xlink:href="#ss-icon-upload"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-upload</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-upload-square"><svg><use xlink:href="#ss-icon-upload-square"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-upload-square</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-upload-square-fill"><svg><use xlink:href="#ss-icon-upload-square-fill"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-upload-square-fill</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-upload-file"><svg><use xlink:href="#ss-icon-upload-file"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-upload-file</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-file"><svg><use xlink:href="#ss-icon-file"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-file</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-paste"><svg><use xlink:href="#ss-icon-paste"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-paste</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-quote-left"><svg><use xlink:href="#ss-icon-quote-left"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-quote-left</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-quote-left-outline"><svg><use xlink:href="#ss-icon-quote-left-outline"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-quote-left-outline</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-inbox-out"><svg><use xlink:href="#ss-icon-inbox-out"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-inbox-out</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-score"><svg><use xlink:href="#ss-icon-score"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-score</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-send"><svg><use xlink:href="#ss-icon-send"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-send</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-horn"><svg><use xlink:href="#ss-icon-horn"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-horn</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-horn-o"><svg><use xlink:href="#ss-icon-horn-o"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-horn-o</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-credit-card"><svg><use xlink:href="#ss-icon-credit-card"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-credit-card</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-payment"><svg><use xlink:href="#ss-icon-payment"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-payment</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-code"><svg><use xlink:href="#ss-icon-code"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-code</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-attache"><svg><use xlink:href="#ss-icon-attache"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-attache</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-compress"><svg><use xlink:href="#ss-icon-compress"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-compress</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-clone"><svg><use xlink:href="#ss-icon-clone"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-clone</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-competency"><svg><use xlink:href="#ss-icon-competency"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-competency</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-yesno"><svg><use xlink:href="#ss-icon-yesno"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-yesno</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-datepicker"><svg><use xlink:href="#ss-icon-datepicker"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-datepicker</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-numrange"><svg><use xlink:href="#ss-icon-numrange"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-numrange</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-sign"><svg><use xlink:href="#ss-icon-sign"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-sign</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-a"><svg><use xlink:href="#ss-icon-andb-a"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-a</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-b"><svg><use xlink:href="#ss-icon-andb-b"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-b</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-c"><svg><use xlink:href="#ss-icon-andb-c"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-c</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-d"><svg><use xlink:href="#ss-icon-andb-d"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-d</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-e"><svg><use xlink:href="#ss-icon-andb-e"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-e</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-f"><svg><use xlink:href="#ss-icon-andb-f"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-f</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-g"><svg><use xlink:href="#ss-icon-andb-g"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-g</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-h"><svg><use xlink:href="#ss-icon-andb-h"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-h</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-andb-i"><svg><use xlink:href="#ss-icon-andb-i"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-andb-i</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-face-one"><svg><use xlink:href="#ss-icon-face-one"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-face-one</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-face-two"><svg><use xlink:href="#ss-icon-face-two"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-face-two</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-face-three"><svg><use xlink:href="#ss-icon-face-three"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-face-three</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-1"><svg><use xlink:href="#ss-icon-dp-1"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-1</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-2"><svg><use xlink:href="#ss-icon-dp-2"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-2</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-3"><svg><use xlink:href="#ss-icon-dp-3"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-3</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-4"><svg><use xlink:href="#ss-icon-dp-4"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-4</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-5"><svg><use xlink:href="#ss-icon-dp-5"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-5</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-6"><svg><use xlink:href="#ss-icon-dp-6"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-6</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-7"><svg><use xlink:href="#ss-icon-dp-7"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-7</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-8"><svg><use xlink:href="#ss-icon-dp-8"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-8</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-9"><svg><use xlink:href="#ss-icon-dp-9"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-9</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-10"><svg><use xlink:href="#ss-icon-dp-10"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-10</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-11"><svg><use xlink:href="#ss-icon-dp-11"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-11</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-12"><svg><use xlink:href="#ss-icon-dp-12"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-12</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-13"><svg><use xlink:href="#ss-icon-dp-13"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-13</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-14"><svg><use xlink:href="#ss-icon-dp-14"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-14</span>
                        </div>

                        <div class="fs-1 mb-3 d-flex align-items-center">
                            <i class="ss-icon-dp-15"><svg><use xlink:href="#ss-icon-dp-15"></use></svg></i>
                            <span class="fs-2 d-block ms-4">ss-icon-dp-15</span>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

<?php include('footer.php'); ?>
