body{
    background-color: aquamarine;
}
.boxcontainer{
    border: 3px solid black;
    width: 500px;
    height: 650px;
    margin: auto;
    margin-top: 100px;
    border-radius: 30px;
    padding: 20px;
    overflow:scroll;
    background-image: linear-gradient(362deg, rgb(247, 14, 199),rgb(24, 34, 250));
}
h1{
    text-align: center;
    
    color: aqua;
    border: 2px solid black;
    border-radius: 20px;
    padding: 5px 5px 5px 5px;
    margin-left: 20px;
    margin-right: 20px;
    background-image: radial-gradient(circle at center center, transparent,rgb(33,33,33)),repeating-linear-gradient(135deg, rgb(33,33,33) 0px, rgb(33,33,33) 2px,transparent 2px, transparent 10px,rgb(33,33,33) 10px, rgb(33,33,33) 11px,transparent 11px, transparent 21px),repeating-linear-gradient(45deg, rgb(47,47,47) 0px, rgb(47,47,47) 4px,transparent 4px, transparent 8px),linear-gradient(90deg, rgb(33,33,33),rgb(33,33,33));
}


#total{
    margin: 20px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-around;
    
}
.totalbox{
    font-size: small;
    margin: 8px;
    display: flex;
    justify-content: center;
    width: 120px;
    padding: 12px;
    border-radius: 20px;
    background-image: linear-gradient(135deg, rgb(68, 202, 201) 0%,rgb(252, 255, 114) 100%);
}
.form{
    transform: translateY(-20px);
    margin: 30px;
    margin-top: 0px;
    border-radius: 20px;
    background-image: linear-gradient(45deg, rgb(51, 138, 249),rgb(47, 248, 255));
}
.hide{
    display: none;
}
#des{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    font-size: 14px;
    padding: 10px;
    
    
}
#addData{
    margin-top: 10px;
    padding: 5px;
    border-radius: 20px;
    background-color: blueviolet;
    color:rgb(47, 248, 255);
    font-weight: 800;
}
#typeselect{
    text-align: center;
    padding-bottom: 10px;
    display: flex;
    justify-content:center;
    gap: 80px;
    margin-left: 10px;
}
.filters{
    transform: translateY(-25px);
    display: flex;
    justify-content: center;
    gap: 20px;
}
.entries{
    transform: translateY(-30px);
    width: 450px;
    height: 280px;
    overflow:scroll;
    padding: 10px;
    border: 2px solid black;
    margin: auto;
}
::-webkit-scrollbar{
    width: 0px;
}

.listaData{
    padding: 5px;
    display: flex;
    margin:10px;
    justify-content: space-around;
    border: 4px solid black;
    width: 430px;
    transform: translateX(-20px);
    list-style-type: none;
    border-radius: 20px;
    background-image: linear-gradient(45deg, rgb(51, 138, 249),rgb(47, 248, 255));
}

.btnEdit{
    border-radius: 20px;
    background-color: blueviolet;
    color:rgb(47, 248, 255);
    transform: translateX(50px);
}
.btnEdit:hover{
    color: white;
}
.delbtn{
    border-radius: 20px;
    background-color: red;
    color:white;
}
.delbtn:hover{
    color: aqua;
}