*{
    padding: 0;
    margin: 0;
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
    font-family: helvetica;
    
}

body {
    background-color: rgb(51, 50, 50);
}

.title {
   font-size: 25px;
    text-align: center;
    color: rgb(3, 255, 3);

}

#salvar-cliente {
    display: none;
    border-radius: 20px;
    background-color: black;
   color:  rgb(3, 255, 3);
   font-weight: bold;
   width: 150px;
   height: 50px;
   cursor: pointer;
   transition: 0.3s;
   border: 2px solid #03ff03;

}

#salvar-cliente:hover {     

    width: 160px;
    color:  rgb(3, 177, 3);

}


.caixa {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 1000px;
}

.caixa-emails {
    background-color: rgb(0, 0, 0);
    width: 100%;
    height: 100%;
    border-radius: 30px;
    border: 2px solid #03ff03;
}

.adicionar {
    width: 100%;
    height: 130px;
    background-color: rgb(0, 0, 0);
    border-radius: 30px;
    border: 3px solid #03ff03;
}


.botao-cadastrar {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100%;
}

.botao-cadastrar button {
    border-radius: 20px;
    background-color: black;
   color:  rgb(3, 255, 3);
   font-weight: bold;
   width: 150px;
   height: 50px;
   cursor: pointer;
   transition: 0.3s;
   border: 2px solid #03ff03;
}

.botao-cadastrar button:hover {
    width: 160px;
    color:  rgb(3, 177, 3);
}


.cadastro {
    width: 500px;
    height: 500px;
    position: absolute;
    background-color: #03ff03;
    border-radius: 20px;
    display: none;
}

.titulo-cliente {
    text-align: center;
    font-size: 20px;

}

form {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

form input {
    margin-bottom: 20px;
    margin-top: 5px;
    background-color: black;
    border-radius: 20px;
    height: 30px;
    width: 300px;
    color:rgb(3, 177, 3) ;
    border: none;
    padding: 20px;
}

form label {
    font-weight: bold;
}

#fechar-cadastro {
    padding: 5px;
    border-radius: 20%;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    background-color: black;
    color: rgb(3, 177, 3);
    cursor: pointer;
}

#cadastrar-cliente {
    text-align: center;
     padding: 10px;
     cursor: pointer;
     font-weight: bold;
}

.tabela-clientes {
    color: rgb(3, 177, 3) ;
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    padding: 20px;
    border-bottom: 2px solid green;
}


.pegarinfo {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


.button-delete-edit {
    display: flex;
    gap: 5px;
}


.edit-apg {
border: 1px solid #03ff03;
width: 100px;
height: 35px;
cursor: pointer;
transition: 0.3s;
background-color: black;
color: #03ff03;
}

.edit-apg:hover {
    color: #038b03;
    border: 1px solid #038b03;
}