/*
  Copyright (c) Computer-L.A.N. GmbH (http://www.lansoftware.de).
  Alle Rechte vorbehalten.
  Weitergabe und Vervielfältigung dieses Moduls oder von Teilen daraus sind,
  zu welchem Zweck und in welcher Form auch immer, ohne die ausdrückliche
  schriftliche Genehmigung durch die Computer-L.A.N. GmbH nicht gestattet.
*/

/* Standard-LAN-Elemente
----------------------------------------------------------*/

/* Die allgemeine Validierungsmeldung */
.lan-main__validationmessage 
{
    color: #DD0000;
    font-size: 12px;
    margin: 0px 0px 5px 0px;
}

/* Das DIV der Checkboxen für AGB/DSGVO und ihre Beschriftungen*/
.lan-page-overview__overviewCheckboxes
{
    margin: 30px 0px 30px 0px;
}

/* Das DIV für Checkbox und Beschriftung */
.lan-page-overview__conditions-accept 
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: stretch;
    flex-wrap: nowrap;
    margin-bottom: 10px;
}

/* Die Checkboxen für AGB/DSGVO */
.lan-page-overview__conditions-accept-checkbox 
{
    align-self: center;
    margin-top: -2px;
}

/* Den Abschicken-Button anders färbern */
.lan-page-overview__submitButton
{
    background-color: #0a7ac2;
    color: white;
}

.lan-part-field__label
{
    line-height: 30px;
    float: left;
    width: 250px;
    text-align: left;
}

.lan-control-input__invalid, .lan-control-select__invalid
{
    border-color: #DD0000 !important;
}

.lan-part-field 
{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: stretch;
    align-content: stretch;
}

.lan-part-field__label_required
{
    font-weight: bold;
}

.lan-part-field__validationmessage
{
    color: #DD0000;
    font-size: 12px;
}

/* Das Sternchen hinter dem Label zu einem erforderlichen Feld hinzufügen */
.lan-part-field__label::after
{
    content: ":";
}

/* Das Sternchen hinter dem Label zu einem erforderlichen Feld */
.lan-part-field__required_asterisk
{
    color: inherit;
}
/* Links   
----------------------------------------------------------*/

a:link {
    color: #007454;
    text-decoration: none;
}

a:visited {
    color: #696969;
    text-decoration: none;
}

a:hover {
    color: #0a7ac2;
    text-decoration: none;
}

a:active {
    color: #007454;
    text-decoration: none;
}

/* Primäre Layout-Elemente   
----------------------------------------------------------*/

.page 
{
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 30px;
}

div#title 
{
    display: block;
    text-align: left;
}

header, #header 
{
    position: relative;
    margin-bottom: 0px;
    color: #000;
    padding: 0;
}

header h1, #header h1 
{
    font-weight: bold;
    padding: 5px 0;
    margin: 0;
    color: #000000;
    border: none;
    line-height: 2em;
    font-size: 18px !important;
}

body 
{
    font-size: .85em;
    font-family: "Trebuchet MS", Verdana, Helvetica, Sans-Serif;
    margin: 0;
    padding: 0;
    color: #696969;
}

header,
footer,
nav,
section 
{
    display: block;
}

#form
{
    clear:both;
}

/** Die Größe des PanelHeaders und des PanelContents */
.panelHeader
{
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 5px;
    margin-top: 5px;
}

.panelContent
{
    padding: 1.4em 1.4em 1.4em 1.4em;
}

footer, #footer 
{
    color: #999;
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 0 0 30px 0;
    font-size: .9em;
    border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
}

/* Sekundäre Layout-Elemente   
----------------------------------------------------------*/

p
{
    margin-bottom: 20px;
    list-style-type: none;
    line-height: 1.6em;
}

/* Die Liste ohne Padding und ohne Typen.*/
ul
{
    padding: 0px;
    list-style-type: none;
}

h1, h2, h3, h4, h5, h6 
{
    font-size: 1.5em;
    color: #000;
}

h1 
{
    font-size: 2em;
    padding-bottom: 10px;
    margin-bottom: 0;
}

h2 
{
    padding: 0 0 10px 0;
}

h3 
{
    font-size: 1.2em;
}

h4 
{
    font-size: 1.1em;
}

h5, h6 
{
    font-size: 1em;
}

/* Standard-Kalender-Klassen für Legende und Hintergrund für PHP UND Kendo-Kalender
----------------------------------------------------------*/

.calendarArrivalFree
{
    background-color: green;
}

.calendarDepartureFree
{
    background-color: green;
}

.calendarNone
{
    background-color:white;
}
.calendarFree
{
    background-color: green;
}
.calendarPartiallyBooked
{
    background-color: orange;
}
.calendarBooked
{
    background-color: red
}
.calendarBlocked
{
    background-color: yellow;
}

#legendTable
{
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    text-align: center;
}

/* Standard-Kalender-Klassen für Legende und Hintergrund im PHP-Kalender 
----------------------------------------------------------*/

/* Der Monatskalender, der Umbruch wird in der View umgesetzt (clear:both) */
.monthCalendar
{
    float: left;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 15px;
    margin-bottom: 10px;
    color: black;
}

.monthCalendar > tbody > tr > td
{
    text-align: center;
}

.monthHeader
{
    font-weight: bold;
    background-color: #e8eef4;
    border-bottom: 1px solid black;
    padding-top: 2px;
    padding-bottom: 2px;
}

#calendarBack
{
    float: left;
}

#calendarForward
{
    float: right;
}

#calendarNavigation
{
    margin: 10px 0px 10px 0px;
    font-weight: bold;
}

/* Standard-Kalender-Klassen für Legende und Hintergrund im Kendo-Kalender 
----------------------------------------------------------*/

/** Die GridCell des Kalendars so verändern, dass für die Färbung background-color benutzt werden kann */
td[role="gridcell"]
{
    padding: 0;
}

/* Die Klassen für die Legende des Kendo-Kalenders */
#backgroundLegendWhite
{
    background-color:white;
    width: 10%;
}
#backgroundLegendGreen
{
    background-color: green;
    width: 10%;
}
#backgroundLegendOrange
{
    background-color: orange;
    width: 10%;
}
#backgroundLegendPink
{
    background-color: pink;
    width: 10%;
}
#backgroundLegendViolet
{
    background-color: violet;
    width: 10%;
}
#backgroundLegendRed
{
    background-color: red;
    width: 10%;
}
#backgroundLegendYellow
{
    background-color: yellow;
    width: 10%;
}
#legendTable
{
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    text-align: center;
}

/* Das Fieldset für Legende und Belegungskalender */
#calendarTable
{
    width: 100%;
    border: none;
}

#calendarTable > tbody > tr,
#calendarTable > tbody > tr > td
{
    border: none;
}

#calendarCell 
{
    width: 45%;
}

.k-calendar .k-content .k-link
{
    padding: 0;
    text-align: center;
    color:black;
    border-radius: 0;
}
.k-calendar .k-today
{
    -webkit-box-shadow: none;
    box-shadow: none;
}
.k-content,
.k-panelbar > li.k-item,
.k-panel > li.k-item,
.k-tiles {
  background-color: #fff;
}

/* Standard-Tabellen-Klassen
----------------------------------------------------------*/

/* Die Übersicht der FreeDates auf 100% skalieren. */
#grid {
    width: 100%;
}

table {
    border: solid 1px #e8eef4;
    border-collapse: collapse;
}

table td {
    padding: 5px;
    border: solid 1px #e8eef4;
}

table th {
    padding: 6px 5px;
    text-align: left;
    background-color: #e8eef4;
    border: solid 1px #e8eef4;
}

/* Formular-Layout-Elemente   
----------------------------------------------------------*/

fieldset 
{
    list-style-type: none;
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend 
{
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom:5px;
    margin-top:5px;
}

textarea 
{
    width:250px;
    height:auto;
    max-width:250px;
    max-height: 500px;
    min-width: 250px;
    min-height: 75px;
    display: inline-block;
    border: 1px solid #ccc;
    font-size: 1.2em;
    color: #444;
    margin: 5px 0px;
    padding-left: 5px;
    font-family: inherit;
}

textarea:disabled, textarea:disabled:hover, input:disabled, input:disabled:hover, select:disabled
{
    background-color: rgb(235, 235, 228);
}

input[type="text"], 
input[type="password"],
input[type="number"],
input[type="email"],
input[type="time"], 
input[type="date"] 
{
    width: 250px;
    display: inline-block;
    border: 1px solid #ccc;
    font-size: 1.2em;
    color: #444;
    margin: 5px 0px;
    padding-left: 5px;
    font-family: inherit;
}

input[type="button"] 
{
    font-size: 1.2em;
}

select 
{
    display: inline-block;
    border: 1px solid #ccc;
    font-size: 1.2em;
    color: #444;
    margin: 5px 0px;
    max-width: 250px;
}

#continue 
{
    font-size: 1.2em;
    float:right;
}

/* Kendo-Elemente   
----------------------------------------------------------*/

/* Den Pfeil auf die richtige Position bringen */
.k-icon.k-i-arrow-60-left,
.k-icon.k-i-arrow-60-right
{
    top: 4px;
}

.k-panelbar-expand, .k-panelbar-collapse
{
    margin-right: 8px;
}

.k-calendar .k-content .k-link
{
    padding: 0;
    text-align: center;
    color:black;
    border-radius: 0;
}

.k-calendar .k-today
{
    -webkit-box-shadow: none;
    box-shadow: none;
}

.k-i-calendar
{
    padding-top: 10px;
}

/* Sidebar   
----------------------------------------------------------*/

#sidebar > .monthCalendar > caption,
#sidebar > .monthCalendar > tbody > tr > th
{
    background-color: #273852;
    color: white;
}
#sidebar > .monthCalendar
{
    float: none;
    background-color: white;
}