<div class="table-responsive">
                        <h6 id="edit_warning_text" style="display: none;" class="text-capitalize text-dark text-center bg-warning"></h6>

                        <table class="table table-bordered table-striped">
                            <thead>
                                <tr>
                                        <th class="">سليمان بوجروه (بواحمد)</th>
                                        <th class="">ناصر المحارب (بوفهد)</th>
                                        <th class="">فوزان الجندل (بوعبدالله)</th>
                                        <th class="">فهد الخميس (بوصالح)</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td class=""><input autocomplete="off" name="hand" type="radio" value="1"><select name="hand1" class="form-select select_hand hand1 hand" style="display: none;">
                                            <option value="0">هند/خلوص</option><option value="8">خلوص</option><option value="2">عادي</option><option value="3">جيكر</option><option value="4">جيكرين</option><option value="5">زات</option><option value="6">زات جيكر</option><option value="7">زات جيكرين</option>
                                        </select></td>
                                    <td class=""><input autocomplete="off" name="hand" type="radio" value="2"><select name="hand2" class="form-select select_hand hand2 hand" style="display: none;">
                                            <option value="0">هند/خلوص</option><option value="8">خلوص</option><option value="2">عادي</option><option value="3">جيكر</option><option value="4">جيكرين</option><option value="5">زات</option><option value="6">زات جيكر</option><option value="7">زات جيكرين</option>
                                        </select></td>
                                    <td class=""><input autocomplete="off" name="hand" type="radio" value="3"><select name="hand3" class="form-select select_hand hand3 hand" style="display: none;">
                                            <option value="0">هند/خلوص</option><option value="8">خلوص</option><option value="2">عادي</option><option value="3">جيكر</option><option value="4">جيكرين</option><option value="5">زات</option><option value="6">زات جيكر</option><option value="7">زات جيكرين</option>
                                        </select></td>
									<td class=""><input autocomplete="off" value="4" name="hand" type="radio"><select name="hand4" class="form-select select_hand hand4 hand" style="display: none;">
                                            <option value="0">هند/خلوص</option><option value="8">خلوص</option><option value="2">عادي</option><option value="3">جيكر</option><option value="4">جيكرين</option><option value="5">زات</option><option value="6">زات جيكر</option><option value="7">زات جيكرين</option>
                                        </select></td>
                                </tr><tr><td>    <div class="pretty p-icon p-toggle p-plain fromhand fromhand1">
<input autocomplete="off" type="radio" name="fromhand" value="1" class="fromhand fromhand1">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="far fa-hand-paper" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-hand-paper" aria-hidden="true"></i>
        </div>
    </div></td><td>    <div class="pretty p-icon p-toggle p-plain fromhand fromhand2">
<input autocomplete="off" type="radio" name="fromhand" value="2" class="fromhand fromhand2">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="far fa-hand-paper" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-hand-paper" aria-hidden="true"></i>
        </div>
    </div></td><td>    <div class="pretty p-icon p-toggle p-plain fromhand fromhand3">
<input autocomplete="off" type="radio" name="fromhand" value="3" class="fromhand fromhand3">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="far fa-hand-paper" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-hand-paper" aria-hidden="true"></i>
        </div>
    </div></td><td>    <div class="pretty p-icon p-toggle p-plain fromhand fromhand4">
<input autocomplete="off" type="radio" name="fromhand" value="4" class="fromhand fromhand4">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="far fa-hand-paper" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-hand-paper" aria-hidden="true"></i>
        </div>
    </div></td></tr>
                                <tr>
                                    <td class=""><input name="nzol1" type="number" autocomplete="off" class="nzol nzol1 form-control" style=""></td>
                                    <td class=""><input name="nzol2" type="number" autocomplete="off" class="nzol nzol2 form-control" style=""></td>
                                    <td class=""><input name="nzol3" type="number" autocomplete="off" class="nzol nzol3 form-control" style=""></td>
                                    <td class=""><input name="nzol4" type="number" autocomplete="off" class="nzol nzol4 form-control" style=""></td>
                                </tr>
                                <tr>
                                    <td class="">    <div class="pretty p-icon p-toggle p-plain m5ysh m5ysh1">
<input name="m5ysh1" autocomplete="off" type="checkbox" value="1" class="m5ysh m5ysh1">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="fas fa-check" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-times" aria-hidden="true"></i>
        </div>
    </div></td>
                                    <td class="">    <div class="pretty p-icon p-toggle p-plain m5ysh m5ysh2">
<input name="m5ysh2" autocomplete="off" type="checkbox" value="1" class="m5ysh m5ysh2">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="fas fa-check" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-times" aria-hidden="true"></i>
        </div>
    </div></td>
                                    <td class="">    <div class="pretty p-icon p-toggle p-plain m5ysh m5ysh3">
<input name="m5ysh3" autocomplete="off" type="checkbox" value="1" class="m5ysh m5ysh3">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="fas fa-check" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-times" aria-hidden="true"></i>
        </div>
    </div></td>
                                    <td class="">    <div class="pretty p-icon p-toggle p-plain m5ysh m5ysh4">
<input name="m5ysh4" autocomplete="off" type="checkbox" value="1" class="m5ysh m5ysh4">
        <div class="state p-off">
		<i style="font-size: large;color: green;" class="fas fa-check" aria-hidden="true"></i>
        </div>
        <div class="state p-on p-info-o">
		<i style="font-size: large;color: red;" class="fas fa-times" aria-hidden="true"></i>
        </div>
    </div></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>

Add a code snippet to your website: www.paste.org