* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: aliceblue;
}

.main-body {
    width: 20%;
    background-color: white;
    padding: 30px 10px;
    margin: 50px auto;
    border-radius: 11px;
    box-shadow: 0 0 10px 0.1px black;
}

#card-body {
    width: 70%;
    margin: auto;
}

#he {
    text-align: center;
    margin: 15px;
}

#name,
#role,
#depart,
#salary,
#exp,
#email,
#hire_btn {
    width: 100%;
    padding: 5px 7px;
    margin: 3px auto;
}

#name,
#salary,
#exp,
#email,
#hire_btn {
    padding: 5px 10px;
}

thead tr th {
    background-color: gold;
}

.table-dta-8 {
    background-color: red;
    text-align: center;
    cursor: pointer;
}


#main-tb {
    width: 90%;
    margin: auto;
    border: none;
    font-size: 20px;
}

#extra1 {
    width: 10%;
}
td{
    background-color: antiquewhite;
    text-align: center;
    padding: 3px 15px;
}
#dl_all{
    padding: 0;
}
#dl_all button{
    width: 100%;
    padding: 10px 1px;
    margin: 0; 
    background-color: brown;
}
#temp,#extra1,#tsal{
    background-color: lightblue;
    padding: 3px 5px;
}
#hire_btn{
    cursor: pointer;
    box-shadow: 0 0 1px 0px gray;
}