[Solved] Remove HTML Table cell extra space from jQuery Modal Popup using CSS

MY CODE

Please i have this Modal Popup that contains a table which has excess space in the color column <td>.

i have checked all my code and i am unable to trace where the error is coming from.

MY CODE

<style type="text/css">
        #customers1 {
            font-family: Arial, Helvetica, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }
 
            #customers1 td, #customers th {
                border: 1px solid #ddd;
                padding: 8px;
            }
 
            #customers1 tr:nth-child(even) {
                background-color:;
            }
 
 
 
            #customers1 th {
                padding-top: 12px;
                padding-bottom: 12px;
                text-align: left;
                background-color: #4CAF50;
                color: white;
            }
 
        #customers01 {
            font-family: Arial, Helvetica, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }
    </style>

    <style type="text/css">
        #customers12 {
            font-family: Arial, Helvetica, sans-serif;
            border-collapse: collapse;
            width: 100%;
        }
 
            #customers12 td, #customers th {
                border: 1px solid #ddd;
                padding: 8px;
            }
 
            #customers12 tr:nth-child(even) {
                background-color:;
            }
 
 
 
            #customers12 th {
                padding-top: 12px;
                padding-bottom: 12px;
                text-align: left;
                background-color: #4CAF50;
                color: white;
            }
 
       
        }
    </style>
    <style type="text/css">
        table.roundedCorners {
            border: 1px solid DarkOrange;
            border-radius: 13px;
            border-spacing: 0;
        }
 
            table.roundedCorners td,
            table.roundedCorners th {
                border-bottom: 1px solid DarkOrange;
                padding: 4px;
            }
 
            table.roundedCorners tr:last-child > td {
                border-bottom: none;
            }
 </style>
 <style type="text/css">
    body {
        font-family: Arial;
        font-size: 10pt;
    }
 
    .Pager span {
        text-align: center;
        color: #999;
        display: inline-block;
        width: 20px;
        background-color: #A1DCF2;
        margin-right: 3px;
        line-height: 150%;
        border: 1px solid #3AC0F2;
    }
 
    .Pager a {
        text-align: center;
        display: inline-block;
        width: 20px;
        background-color: #3AC0F2;
        color: #fff;
        border: 1px solid #3AC0F2;
        margin-right: 3px;
        line-height: 150%;
        text-decoration: none;
    }
     .style102
     {
         width: 797px;
     }
 </style>

Please help me sir