isite/apps/client-side/site_files/css/form.css

Create High Level Multi-Language Web Site [Fast and Easy]

form {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 5px;
  color: var(--form-color);
  background-color: var(--form-background-color);
}

.control {
  display: block;
  width: 100%;
  margin: 0 auto;
  padding: 5px;
  margin-bottom: 10px;
}

form label,
form span,
form p {
  color: var(--form-color);
}
p {
  word-break: break-word;
  word-wrap: break-word;
}
label {
  font-weight: var(--label-font-weight);
  color: var(--label-color);
  font-size: var(--label-font-size);
  margin: 5px;
  margin-bottom: 10px !important;
  word-break: break-all;
}

label span {
  color: var(--form-color);
}

textarea {
  overflow-x: hidden;
}

input,
select,
textarea {
  width: inherit;
  text-align: var(--text-align);
  font-family: var(--font-family);
  height: var(--input-height);
  min-height: var(--input-height);
  line-height: var(--line-height);
  padding: var(--input-padding);
  font-size: var(--input-font-size);
  font-weight: var(--input-font-wight);
  color: var(--input-color);
  background-color: var(--input-background-color);
  background-image: none;
  -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  border-radius: var(--input-border-radius);
  border-width: var(--input-border-width);
  border-color: var(--input-border-color);
  border-style: solid;
  outline: none;
  scrollbar-arrow-color: var(--input-color);
  -ms-scrollbar-arrow-color: var(--input-color);
}

select {
  font-size: var(--select-font-size);
  height: var(--select-height);
  scrollbar-arrow-color: var(--select-color);
  -ms-scrollbar-arrow-color: var(--select-color);
  appearance: var(--select-appearance);
  -webkit-appearance: var(--select-appearance);
  -moz-appearance: var(--select-appearance);
  -ms-progress-appearance: var(--select-appearance);
}

textarea {
  border-width: var(--textarea-border-width);
}

input[type='checkbox'],
input[type='radio'] {
  -webkit-box-shadow: none;
  box-shadow: none;
}

input[type='file'] {
  padding: 3px;
}

input[type='date'],
input[type='datetime'],
input[type='datetime-local'] {
  padding: 5px;
}

input[type='number'],
input[type='date'] {
  text-align: center;
}

.control textarea {
  display: block;
  width: 100%;
  height: 100px;
}

.control label {
  text-align: var(--label-text-align);
}

.control input[type='text'],
.control input[type='email'],
.control input[type='number'],
.control input[type='password'],
.control input[type='file'],
.control input[type='date'],
.control input[type='datetime'],
.control input[type='datetime-local'],
.control textarea,
.control label,
.control select {
  display: block;
  width: 100%;
}

input:focus,
select:focus,
textarea:focus {
  border-width: var(--input-focus-border-width);
  border-color: var(--input-focus-border-color);
}

fieldset {
  padding: var(--fieldset-padding);
  margin: var(--fieldset-margin);
  background: var(--fieldset-background);
  border: var(--fieldset-border);
  border-radius: var(--fieldset-border-radius);
  max-width: 98% !important;
}

fieldset legend {
  display: contents;
  color: var(--legend-color);
  font-size: var(--legend-font-size);
  text-shadow: var(--legend-text-shadow);
  font-weight: var(--legend-font-weight);
  background: var(--fieldset-background);
  border: var(--legend-border);
  float: var(--float);
  width: auto;
  padding: 5px;
}

.files {
  border: 2px dashed var(--modal-header-background-color);
  padding: 5px;
}

.files span {
  font-size: 14px;
  color: var(--color);
  vertical-align: super;
}

.i-date .day select {
  border-bottom-color: green;
}

.i-date .month select {
  border-bottom-color: blue;
}

.i-date .year select {
  border-bottom-color: #000000;
}

.i-time .space {
  margin-top: 10px;
  font-size: 16px;
  color: #000;
}
.i-date2 label {
  display: none;
}
.i-date2 .fa-calendar-day {
  font-size: 35px;
  cursor: pointer;
  color: var(--theme-color);
}
i-file {
  display: block;
  padding: 10px !important;
  border: 1px dashed var(--theme-color);
  margin: 1% !important;
  height: fit-content;
  width: 98% !important;
}
i-file button {
  max-width: 100px;
}