---

Im Format UTF-8 speichern! Ggf. im Browser - Darstellung Textcodierung auf Unicode (UTF-8) stellen

---

/*
 *  Event-Kalender - kalenderformfelder.css (utf-8)
 * - https://werner-zenk.de
 */

@charset "utf-8";

/*form[inert] {
 border: Solid 1px #FF0000;
}*/

/* Formularfelder ausblenden */
/*
table#tafel .ausblenden_volltag,
table#tafel .ausblenden_dauer,
table#tafel .ausblenden_adresse,
table#tafel .ausblenden_prioritaet,
table#tafel .ausblenden_kategorie,
table#tafel .ausblenden_kopieren,
table#tafel .ausblenden_wiederholung,
table#tafel .ausblenden_beschreibung,
table#tafel .ausblenden_privat,
table#tafel .ausblenden_aufgabe {
 display: None;
}
*/

form#eKsuche {
  display: Inline;
}

table#tafel input[type="text"],
table#tafel input[type="password"],
table#tafel input[type="search"],
table#tafel input[type="number"],
table#tafel input[type="date"],
table#tafel input[type="time"],
table#tafel input[type="reset"],
table#tafel input[type="button"],
table#tafel input[type="checkbox"],
table#tafel button[type="button"],
table#tafel textarea,
table#tafel select {
  border: Solid 1px #9a9a9a;
  font-family: var(--font-family);
  font-size: 0.95rem;
  caret-color: #ff0000;
}

:focus-visible {
  outline: Solid 1px var(--highlight-outlinecolor);
}

table#tafel input[type="button"],
table#tafel input[type="submit"],
table#tafel input[type="reset"],
table#tafel button[type="button"].senden,
table#tafel button[type="submit"],
table#tafel button[type="reset"] {
  font-family: var(--font-family);
  font-size: 0.95rem;
  color: #000000;
  border: Solid 1px #9a9a9a;
  background-color: #e1e1e1;
  transition: all 0.4s;
}

table#tafel input[type="button"]:hover,
table#tafel input[type="submit"]:hover,
table#tafel input[type="reset"]:hover,
table#tafel button[type="button"].senden:hover,
table#tafel button[type="submit"]:hover,
table#tafel button[type="reset"]:hover {
  border: Solid 1px #0078d7;
  background-color: #e5f1fb;
  box-shadow: inset 0px -10px 5px #ffffff;
}

table#tafel input[type="file"] {
  font-size: 1.05rem;
}

table#tafel input[type="range"]#stunden {
  vertical-align: Middle;
  width: 180px;
}

table#tafel button[type="button"]:disabled,
table#tafel button[type="button"]:disabled:hover {
  background-color: #e1e1e1;
  border: Solid 1px #e1e1e1;
  cursor: Not-Allowed;
}

table#tafel input[type="number"]:out-of-range {
  border: Solid 1px #dd0000;
  background-color: #ffcaca;
}

table#tafel input[type="text"]#event {
  width: 260px;
}

/* Form Gruppe bearbeiten */
table#tafel input[type="text"].event {
  width: 230px;
}

table#tafel input[type="text"]#ort {
  width: 340px;
}

table#tafel input[type="text"]#adresse {
  width: 70%;
}

table#tafel input[type="search"] {
  width: 265px;
  padding-left: 5px;
}

table#tafel textarea.textarea {
  color: #000000 !important;
  width: 400px;
  min-width: 400px;
  height: 150px;
  min-height: 150px;
  overscroll-behavior: contain;
  /*scrollbar-color: gray transparent;*/
  /*scrollbar-width: thin;*/
  resize: Both;
}

table#tafel div.notiz {
  font-family: var(--font-family);
  font-size: 1rem;
  color: #dd0000;
}

table#tafel input::placeholder,
table#tafel textarea::placeholder {
  color: #aaaaaa;
  font-size: 1rem;
}

table#tafel input:placeholder-shown,
table#tafel textarea:placeholder-shown {
  color: var(--highlight-color);
  text-overflow: ellipsis;
}

textarea#notiz {
  width: 250px;
  min-width: 250px;
  height: 150px;
  min-height: 150px;
  resize: Both;
}

table#tafel fieldset {
  border: Solid 1px #bbbbbb;
  display: Inline-Block;
  margin-top: 15px;
}

table#tafel figure {
  margin: 0px;
  padding: 0px;
  display: Inline;
}

table#tafel figure > figcaption {
  margin: 0px;
  font-style: Oblique;
  padding-left: 25px;
}

/* Anmeldung */
table#tafel input[type="text"]#benutzername,
table#tafel input[type="password"]#passwort {
  width: 185px;
}

table#tafel input[type="number"] {
  width: 65px;
  padding-left: 5px;
}

table#tafel input[type="time"] {
  width: 95px;
  padding-left: 5px;
  vertical-align: Middle;
}

table#tafel input[type="date"] {
  width: 150px;
  padding-left: 5px;
  vertical-align: Middle;
}

table#tafel label {
  white-space: Nowrap;
  transition: color 0.5s;
}

table#tafel label:hover {
  color: var(--highlight-color);
}

/* Checkbox (checked) */
table#tafel input[type="checkbox"]:checked + label {
  color: var(--highlight-color);
}

table#tafel input[type="checkbox"]:checked + label.achtung {
  color: #ff0000;
}

table#tafel input[type="checkbox"]:checked + label.markiert {
  background-color: var(--highlight-bgcolor);
  animation: keyAnim 0.5s ease-in-out infinite alternate;
}

table#tafel input[type="checkbox"],
table#tafel input[type="radio"],
table#tafel input[type="range"] {
  accent-color: var(--highlight-color);
}

@keyframes keyAnim {
  from {
    box-shadow: 0px 0px 1px 2.3px var(--highlight-color);
  }
  to {
    box-shadow: 0px 0px 1px 2.3px var(--highlight-outlinecolor);
  }
}

table#tafel input[type="checkbox"].checkboxGruppe {
  visibility: Hidden;
  margin-right: -25px;
}

table#tafel option:nth-child(even) {
  background-color: var(--highlight-bgcolor);
  color: #000000;
}

table#tafel option:nth-child(odd) {
  background-color: #ffffff;
  color: #000000;
}

table#tafel optgroup {
  background-color: #dcdcdc;
  color: #000000;
  font-style: Normal;
}

table#tafel option:default {
  color: var(--highlight-color);
}

table#tafel div#buttons {
  line-height: 45px;
  text-align: Center;
  margin: 0px Auto 20px Auto;
}

table#tafel p.gruppe {
  line-height: 30px;
  margin: 0;
  padding: 0.5rem;
  border: Solid 1px #aaaaaa;
  border-radius: 4px;
}

table#tafel div#gruppeBearbeiten {
  display: Flex;
  flex-wrap: Wrap;
  gap: 0.5rem;
}

Zurück zum Kalender