              <div class="col-lg mpl-content">
                <ul class="nav nav-tabs" role="tablist">
                  <li role="presentation" class="nav-item"><a href="#general" class="nav-link active" aria-controls="general" role="tab" data-bs-toggle="tab" aria-selected="true">General</a></li>
                  <li role="presentation" class="nav-item"><a href="#security" class="nav-link" aria-controls="security" role="tab" data-bs-toggle="tab" aria-selected="false">Security</a></li>
                  <li role="presentation" class="nav-item"><a href="#notifications" class="nav-link" aria-controls="notifications" role="tab" data-bs-toggle="tab" aria-selected="false">Notifications</a></li>
                  <li role="presentation" class="nav-item"><a href="#sharedp" class="nav-link" aria-controls="sharedp" role="tab" data-bs-toggle="tab" aria-selected="false">Share DP/Send DP</a></li>
                  <li role="presentation" class="nav-item"><a href="#usercenter" class="nav-link" aria-controls="usercenter" role="tab" data-bs-toggle="tab" aria-selected="false">Quick Links/User Center</a></li>
                  <li role="presentation" class="nav-item"><a href="#usercenter" class="nav-link" aria-controls="staffcenter" role="tab" data-bs-toggle="tab" aria-selected="false">Staff Center</a></li>
                </ul>
                <div class="tab-content">
                  <div role="tabpanel" class="tab-pane fade show active" id="general">
                    <form action="#" data-sr="user-setting" data-sr-duration="1000" data-sr-distance="20">
                      <div class="mpl-snippet-fill" data-sr-item="user-setting">
                        <h2>Display name</h2>