:root{
    --main-color:rgb(237, 127, 196);
}
.sec-body{
    background:linear-gradient(to right,rgb(242, 165, 214),var(--main-color) ,#111111) ;
    color: var(--main-color);
}
.sec-body h1{
    font-weight: bolder;
    font-style: italic;
    text-shadow:2px 2px 4px #111111;
}
.sec-body input:focus{
    box-shadow:2px 2px 10px 3px var(--main-color);
    border-color: var(--main-color);
}

.sec-body label{
    font-weight: bold;
    font-size: 17px;
}
.sec-body input{
    border-color: var(--main-color);
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
#btn-add ,
#btn-Update{
    background-color: var(--main-color);
    color: white;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
#btn-add:hover,
#btn-Update:hover{
    opacity: 0.8;
}

table{
    width: 95%;
    border: 2px solid var(--main-color);
    
}
table thead{
    background-color: var(--main-color);
}
#btn-edit{
    background-color: var(--main-color);
    color: white;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
#btn-delete{
    border: 1px solid var(--main-color);
    color: var(--main-color);
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -ms-transition: all 1s;
    -o-transition: all 1s;
}
#btn-edit:hover{
    border: 1px solid var(--main-color);
    color: var(--main-color);
    background-color: transparent;
}
#btn-delete:hover{
    background-color: var(--main-color);
    color: white;

}