.flat-button-group {
    display: flex;
    flex-direction: row;
    column-gap: 4px;
}

.flat-button {
    width: 100%;
    border: none;
    border-radius: 5px;
    padding: 8px 0;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.flat-button:not(:disabled) {
    cursor: pointer;
}

.flat-button.save {
    background-color: #63bf3c;
    color: #fff;
}
.flat-button.delete {
    background-color: #bf613c;
    color: #fff;
}
.flat-button.cancel {
    background-color: steelblue;
    color: #fff;
}
.flat-button.green:hover {
    background-color: #5cb437;
}

.flat-button.orange {
    background-color: orange;
    color: #fff;
}
.flat-button.orange:hover {
    background-color: #db5a00;
}

.fa-button-group {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.fa-button {
    padding: 6px;
    /* margin: 4px; */
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    background-color: transparent;
    border: none!important;
    cursor: pointer;
    font-size: 14px;
}

.fa-button i {
    padding-right: 6px;
}

.fa-button.fa-pencil,
.fa-button.fa-edit {
    color: rgb(68, 171, 218);
}
.fa-button.fa-trash {
    color: rgb(227, 155, 96);
}
.fa-button.fa-user-gear {
    color: rgb(141, 198, 63);
}
.fa-button.fa-user-xmark {
    color: rgb(170, 68, 68);
}
.fa-button.fa-location-pin {
    color: rgb(255, 0, 0);
}