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

@charset "utf-8";

/* Kalender */
div#kalender {
 box-shadow: 1px 1px 10px #CFCFCF;
 background-image: url(hintergrundbild.jpg);
 background-repeat: No-Repeat;
 background-size: Cover;
}

/* Tabelle */
table#kalender {
 font-family: Verdana, Sans-Serif;
 /*background-color: #F5F5F5;*/
 border-collapse: Collapse;
 empty-cells: Hide;
 width: 100%;
 opacity: 0.85;
 cursor: Default;
}

/* Tabelle Beschriftung */
table#kalender caption {
 color: #529EEA;
 font-size: 2.1rem;
 font-weight: Bold;
 letter-spacing: 2px;
 background: linear-gradient(#E0E0E0, #F5F5F5);
 padding: 5px 0 5px 0;
}

/* Tabelle Beschriftung (Bild) */
table#kalender caption img {
 max-width: 100%;
 height: Auto;
}

/* Tabelle TH */
table#kalender th {
 font-weight: Normal;
 text-align: Center !important;
 border: Solid 1px #FFFFFF;
}

/* Tabelle TD */
table#kalender td {
 vertical-align: Top;
 padding: 2px;
 border: Solid 1px #FFFFFF;
}

/* Tabelle Navigation */
table#kalender th#navigation {
 font-size: 1.6rem;
 font-weight: Bold;
 letter-spacing: 2px;
 text-align: Center !important;
 background-color: #F5F5F5;
}

table#kalender td#navigation span {
 white-space: Nowrap;
}

/* Auswahl (Monate, Jahre, Optionen) */
table#kalender td#auswahl {
 height: 30px;
 vertical-align: Middle;
 text-align: Center !important;
}

/* Anzeige (Events, Formular) */
table#kalender td#anzeige {
 font-family: Verdana, Sans-Serif;
 font-size: 1.6rem;
 background: linear-gradient(#EDEDED 1%, #FFFFFF 80%, #EDEDED);
}

/* Tabelle (child even/odd) */
table#kalender th:nth-child(even),
table#kalender td:nth-child(even) {
 background-color: rgba(250,250,250,0.6);
}
table#kalender th:nth-child(odd),
table#kalender td:nth-child(odd) {
 background-color: rgba(240,240,240,0.6);
}

/* Heute */
table#kalender td.heute {
 background-color: #DCDCDC !important;
}

/* Ein Tag! */
table#kalender td.eintag {
 height: 50px;
 cursor: Default;
 line-height: 14px;
 word-break: break-all;
 transition: background-color 0.5s;
}

table#kalender td.eintag:hover {
 background-color: #E8E8E8 !important;
}

/* Kein Tag! */
table#kalender td.keintag {
 height: 50px;
 color: #C5C5C5;
 padding-left: 8px;
 cursor: Pointer;
 transition: background-color 0.5s;
}

table#kalender td.keintag:hover {
 background-color: #E8E8E8;
 color: #529EEA;
}

/* Wochentag (Mo. - Fr.) */
table#kalender th.wochentag {
 transition: background-color 0.5s;
}

/* Wochenende (Sa.+ So.) */
table#kalender th.wochenende {
 background-color: #DCDCDC;
 transition: background-color 0.5s;
}

table#kalender th.wochentag:hover,
table#kalender th.wochenende:hover {
 background-color: #E8E8E8;
}

/* Uhrzeit */
table#kalender span.uhrzeit {
 font-family: Arial, Tahoma, Sans-Serif;
 font-size: 0.72rem;
 color: #252525;
}

/* Feiertag */
table#kalender span.feiertag {
 font-family: Arial, Tahoma, Sans-Serif;
 font-size: 1.1rem;
 color: #FA0000;
}

/* Aktiver Tag */
table#kalender .aktivtag {
 outline: Solid 1px #B3DDFF;
 box-shadow: Inset 0px 0px 100px 100px #DEEEFC;
}

/* Navigation Link */
table#kalender span.navLink {
 font-family: Verdana, Sans-Serif;
 font-weight: Normal;
 color: #303030;
 padding: 1px 4px 1px 4px;
 cursor: Pointer;
 outline: Solid 1px Transparent;
 transition: background-color 0.5s;
}

table#kalender span.navLink:hover {
 background-color: #DEEEFC;
 outline: Solid 1px #B3DDFF;
 color: #2C84DC;
}

table#kalender span.navBlock {
 min-width: 120px;
 display: Inline-Block;
}

table#kalender span.navBlock2 {
 min-width: 50px;
 display: Inline-Block;
}

/* Link */
table#kalender a:link,
table#kalender a:visited,
table#kalender a:active {
 color: #529EEA;
}

table#kalender div.eventLink {
 font-family: Arial, Sans-Serif;
 font-size: 1.1rem;
 color: #FFFFFF;
 margin-top: 2px;
 padding: 2px 0 1px 2px;
 cursor: Pointer;
}

table#kalender span.optionLink {
 font-family: Arial, Sans-Serif;
 font-size: 1.1rem;
 color: #529EEA;
 padding: 1px 5px 1px 5px;
 cursor: Pointer;
 outline: Solid 1px Transparent;
 transition: background-color 0.5s;
}

 table#kalender span.optionLink:hover {
 background-color: #DEEEFC;
 outline: Solid 1px #B3DDFF;
 color: #2C84DC;
}

table#kalender span.nowrap {
 white-space: Nowrap;
}

/* Tabellennavigtion */
table#kalender table#tableNavigation {
 width: 100%;
 border-bottom: Solid 1px #FFFFFF;
 margin-bottom: 25px;
}

table#kalender table#tableNavigation td {
 border: 0;
 background: Transparent;
 white-space: Nowrap;
 vertical-align: Middle;
}

table#kalender table#tableNavigation th {
 border: 0;
 background: Transparent;
 vertical-align: Middle;
}

table#kalender table#tableNavigation td span.navLink  {
 font-size: 1.1rem;
}

/* user-select */
table#kalender caption,
 table#kalender td#navigation,
 table#kalender td.eintag,
 table#kalender td.keintag,
 table#kalender th.wochentag,
 table#kalender th.wochenende,
 table#kalender span.uhrzeit,
 table#kalender span.feiertag,
 table#kalender span.navLink,
 table#kalender span.eventLink,
 table#kalender span.optionLink {
 -ms-user-select: None;
 -moz-user-select: None;
 -webkit-user-select: None;
}

table#kalender span.selLink {
 -ms-user-select: Text;
 -moz-user-select: Text;
 -webkit-user-select: Text;
}

table#kalender mark.mark {
 font-weight: Bold;
 background-color: Transparent;
 color: #529EEA;
}

table#kalender mark.fehler {
 font-weight: Bold;
 font-size: 18px;
 background-color: Transparent;
 color: #FF0000;
}

/* Kalenderblatt */
table#kalender div#kalenderblatt {
 background: linear-gradient(#FFFFFF 80%, #EDEDED);
 line-height: 23px;
 color: #303030;
 padding-bottom: 25px;
}

table#kalender div#kalenderblatt > table {
 border-bottom: Solid 1px #DEDEDE;
}

table#kalender div#blatt {
 font-family: Verdana, Sans-Serif;
 font-size: 6rem;
 text-shadow: 1px 1px 5px #C0C0C0;
 color: #1069B1;
 text-align: Center;
 float: Left;
 line-height: 95px;
 width: 150px;
 height: 105px;
 margin: 5px 15px 0 0;
 background: linear-gradient(#F3F9FE, #FFFFFF);
 border: Solid 1px #F3F9FE;
}

/* Anzeige */
table#kalender form#eKform,
 table#kalender div#fehler,
 table#kalender div#aktevents {
 color: #303030;
 padding: 0 0 10px 25px;
}

table#kalender div#anzeigeOptionenBeenden {
 display: Inline-Block;
 text-align: Right;
}

/* Priorität */
table#kalender span.prioritaet {
 padding: 0px 5px 0px 5px;
 font-size: 12px;
 color: #505050;
 cursor: Pointer;
}

table#kalender span.prioritaet:hover {
 color: #FFFFFF;
}

table#kalender div#inBlock {
 display: Inline-Block;
 width: 95%;
}

table#kalender div.abschnitt {
 color: #529EEA;
 font-size: 1.1rem;
 margin-top: 20px;
}

/* Event-Anzeige / Definitionsliste */
table#kalender dl.dl {
 background-color: Transparent;
}

table#kalender dl.dl > dd {
 margin-left: 25px;
 max-width: 90%;
}

table#kalender p.formLineHeight {
 line-height: 30px;
}

table#kalender span.eventText {
 font-weight: Bold;
 letter-spacing: 1px;
 cursor: Pointer;
}

/* Formularfelder */
table#kalender input[type="text"],
table#kalender input[type="password"],
table#kalender input[type="search"],
table#kalender input[type="number"],
table#kalender input[type="checkbox"],
table#kalender button[type="button"],
table#kalender textarea,
table#kalender select {
 border: Solid 1px #9A9A9A;
 font-family: Verdana, Arial, Sans-Serif;
 font-size: 0.95rem;
 margin-top: 2px;
 margin-bottom: 2px;
 caret-color: #FF0000;
}

table#kalender input[type="text"]:focus,
table#kalender input[type="password"]:focus,
table#kalender input[type="search"]:focus,
table#kalender input[type="number"]:focus,
table#kalender input[type="checkbox"]:focus,
table#kalender button[type="button"]:focus,
table#kalender textarea:focus,
table#kalender select:focus {
 border: Solid 1px #0078D7;
}

table#kalender input[type="button"],
table#kalender input[type="submit"],
table#kalender input[type="reset"],
table#kalender button[type="button"],
table#kalender button[type="reset"] {
 border: Solid 1px #9A9A9A;
 background-color: #E1E1E1;
 font-size: 0.95rem;
}

table#kalender input[type="button"]:hover,
table#kalender input[type="submit"]:hover,
table#kalender input[type="reset"]:hover,
table#kalender button[type="button"]:hover,
table#kalender button[type="reset"]:hover {
 border: Solid 1px #0078D7;
 background-color: #E5F1FB;
}

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

table#kalender input[type="number"]:out-of-range {
 border: Solid 1px #0078D7;
 background-color: #FFCACA;
}

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

table#kalender textarea#textarea {
 width: 400px;
 min-width: 400px;
 max-width: 400px;
 height: 150px;
 min-height: 150px;
 max-height: 350px;
 resize: Vertical;
}

/* Anmeldung */
table#kalender input[type="text"].login,
table#kalender input[type="password"].login {
 width: 150px;
}

table#kalender input[type="number"] {
 width: 65px;
}

 /* Checkbox (checked) */
table#kalender input[type="checkbox"]:checked + label {
 color: #388FE7;
}

table#kalender input[type="checkbox"]:checked + label#delete {
 color: #FF0000;
}

table#kalender option:nth-child(even) {
 background-color: #EFEFEF;
}

table#kalender option:nth-child(odd) {
 background-color: #FFFFFF;
}

/* Copy - Benachrichtigung */
span.toggleCopy {
 position: Absolute;
 margin-top: 75px;
 margin-left: 25px;
 font-size: 0.90rem;
 text-align: Center;
 background-color: #FFFFFF;
 padding: 10px;
 border: Solid 1px #529EEA;
 box-shadow: 0px 0px 7px 1px #A9A9A9;
 z-index: 1000;
 cursor: Default;
}


/* Anpassung an mobile Kleingeräte */
@media screen and (max-width: 35rem) {
 table#kalender .mobile {
  display: None !important;
 }

 /* Tabelle TH/TD */
 table#kalender th,
 table#kalender td {
  padding: 0px;
  border: 0px;
 }

 /* Feiertag */
 table#kalender span.feiertag {
  font-family: Arial, Tahoma, Sans-Serif;
  font-size: 0.60rem;
 }

 /* Uhrzeit */
 table#kalender span.uhrzeit {
  font-family: Arial, Tahoma, Sans-Serif;
  font-size: 0.60rem;
  /*display: None;*/
 }

 /* Event Link */
 table#kalender span.eventLink {
  font-family: Arial, Tahoma, Sans-Serif;
  font-size: 0.60rem;
 }

 /* Ein Tag! */
 table#kalender td.eintag {
  line-height: 8px;
 }

 /* Formularfelder */
 table#kalender textarea#textarea {
  width: 320px;
  min-width: 320px;
  max-width: 320px;
  height: 200px;
  min-height: 200px;
  max-height: 400px;
  resize: Vertical;
 }

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

 table#kalender input[type="text"]#name {
  width: 120px;
 }

 table#kalender input[type="password"]#passwort {
  width: 80px;
 }

}


/* Für den Ausdruck optimieren */
@media print {
 div#kalender {
  box-shadow: none;
 }

 table#kalender td {
  outline: Solid 1px #888888;
 }

 table#kalender .print {
  display: None;
 }

 table#kalender span.optionLink {
  display: None;
 }
}