form {
padding-left: 8px;
  max-width: 700px;
}

.umai-form-group {
  text-align: end;
  margin: 25px 0;
  position: relative;
}

/* ---------- INPUT FIELDS ---------- */
input, select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #fff;
  font-size: 14px;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #15887c;
  outline: none;
}

textarea {
  resize: vertical;
}

/* ---------- FLOATING LABEL ---------- */
.umai-form-group label {
  position: absolute;
  top: 11px;
  left: 12px;
  background: #fff;
  padding: 0 5px;
  font-size: 16px;
  color: #868686;
  transition: 0.2s ease;
  pointer-events: none;
}

input:focus + label,
input:not(:placeholder-shown) + label,
textarea:focus + label,
textarea:not(:placeholder-shown) + label,
select:focus + label,
select:valid + label {
  top: -10px;
  left: 8px;
  font-size: 14px;
  color: #15887c;
}

/* ---------- BUTTON ---------- */
button {
  margin-top: 20px;
  padding: 12px;
  background-color: #2e6c8a;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
}

button:hover {
  background-color: #327799 !important;

}
.umai-pagination a {
  background-color: #fff !important;
}

.umai-pagination .active {
  background-color: #959f70e8 !important;
}

.uami-comm-card {
  background: #fff;
  padding: 22px;
}
.umai-comm-nam {
  background: #a1eccc1c;
  padding: 23px;
}
/* ---------- RESPONSIVE ---------- */
@media (max-width: 600px) {
  .umai-form {
    flex-direction: column;
  }
}