diff --git a/src/components/Project/Teams.jsx b/src/components/Project/Teams.jsx
index afde352a..ab048c89 100644
--- a/src/components/Project/Teams.jsx
+++ b/src/components/Project/Teams.jsx
@@ -265,7 +265,7 @@ const Teams = () => {
             <div className="col-md-6 col-12 d-flex align-items-center">
               <div className="dataTables_length text-start py-1 px-0 col-md-4 col-12">
                 {servicesLoading ? (
-                  <span>Loading...</span>
+                  <span></span>
                 ) : assignedServices?.length > 1 ? (
                   <label>
                     <select
@@ -287,24 +287,18 @@ const Teams = () => {
                 ) : (
                   <div
                     style={{
-                      fontSize: "0.875rem",
-                      height: "32px",
-                      width: "190px",
-                      border: "1px solid #ced4da",
-                      borderRadius: "0.25rem",
-                      padding: "4px 8px",
-                      display: "flex",
-                      alignItems: "center",          
+                          
                     }}
                   >
+                    {/* fier fitting */}
                     {assignedServices?.length === 1
-                      ? assignedServices[0].name
+                      ?<h5>{ assignedServices[0].name}</h5>
                       : "No service available"}
                   </div>
                 )}
               </div>
 
-              <div className="dataTables_filter d-inline-flex align-items-center ms-2">
+              {/* <div className="dataTables_filter d-inline-flex align-items-center ms-2">
                 <input
                   type="search"
                   className="form-control form-control-sm me-4"
@@ -313,11 +307,11 @@ const Teams = () => {
                   value={searchTerm}
                   onChange={handleSearch}
                 />
-              </div>
+              </div> */}
 
             </div>
             <div className="col-md-6 col-12 d-flex justify-content-end align-items-center">
-              <div className="form-check form-switch me-4 mt-2">
+              <div className="form-check form-switch me-2 mt-2">
                 <input
                   type="checkbox"
                   className="form-check-input"
@@ -329,6 +323,16 @@ const Teams = () => {
                   {activeEmployee ? "Active Employees" : "Inactive Employees"}
                 </label>
               </div>
+              <div className="dataTables_filter d-inline-flex align-items-center ms-2">
+                <input
+                  type="search"
+                  className="form-control form-control-sm me-4"
+                  placeholder="Search by Name or Role"
+                  aria-controls="DataTables_Table_0"
+                  value={searchTerm}
+                  onChange={handleSearch}
+                />
+              </div>
 
               <button
                 type="button"