/**
----------------------------------------------------
Farben
---------------------------------------------------- */
.kl .kl-inhalt,
.kl .kl-woche,
.kl tbody,
.kl td,
.kl th,
.kl thead{
  border-color: #ddd;
}
.kl .kl-heute span{
	background:cornflowerblue;
	color:#fff;
	padding:2px 7px;
	border-radius:50%;
}
.kl-markiert {
  background: #bce8f1;
  opacity: 0.3;
}
.kl-hgevent {
  background: #8fdf82;
  opacity: 0.3;
}
.kl-selektion{
  background:cornflowerblue;
}
.kl-selektion span{
  color:white;
  font-size:1.4em;
}
.kl-select{
	background-color:#dd62ee !important;
}
/**
----------------------------------------------------
Hover
---------------------------------------------------- */
.kl-tag-oben:hover{
	background-color:red !important;
	cursor:pointer;	
}

/**
----------------------------------------------------
Positionierung & Grösse
---------------------------------------------------- */
.kl{
  height:500px;
}
.kl-selektion{
  height:50px;
  padding:10px
}
.kl-selektion .kl-monatjahr{
  float:left;
}
.kl-selektion .kl-button{
  float:right;
  padding:4px;
}
.kl-selektion .kl-button i{
  margin-left:30px;
}
.kl-container{
  height:90%;
}
.kl-hg,
.kl-woche .kl-hgevent-raster{
  bottom: 0;
}
.kl-hg table,
.kl-woche .kl-hgevent-raster table{
  height: 100%;
}
.kl-clear {
  clear: both;
}
.kl-hg,
.kl-hgevent-raster{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.kl table {
  width: 100%;
  box-sizing: border-box;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
  font-size: 1em;
}
.kl td,
.kl th {
  border-style: solid;
  border-width: 1px;
  padding: 0;
  vertical-align: top;
}
.kl td.kl-heute {
  border-style: double;
}
.kl .kl-woche {
  border-style: solid;
  border-width: 0;
  height:100%;
}
.kl .kl-wochenzeilen{
	height:100%;
}
.kl-woche table {
  border-left: 0 hidden transparent;
  border-right: 0 hidden transparent;
  border-bottom: 0 hidden transparent;
  height:100%;
}
.kl-woche:first-child table {
  border-top: 0 hidden transparent;
}
.kl-woche {
  position: relative;
}
.kl-woche .kl-hg {
  z-index: 1;
}
.kl-woche .kl-hgevent-raster td{
  border-color: transparent;
}
.kl-woche .kl-hgevent-raster {
  z-index: 2;
}
.kl-woche .kl-inhalt-raster {
  position: relative;
  z-index: 4;
  padding-bottom: 2px;
}
.kl-woche .kl-inhalt-raster td{
  background: 0 0;
  border-color: transparent;
  border-bottom: 0;
}
.kl-woche .kl-inhalt-raster tbody td{
  border-top: 0;
}
.kl-event {
  position: relative;
  display: block;
  font-size: 0.85em;
  line-height: 1.3;
  border-radius: 3px;
  border: 1px solid #3a87ad;
  font-weight: 400;
}
.kl-event{
  background-color: #3a87ad;
}
.kl-event .kl-hg {
  z-index: 1;
  background: #fff;
  opacity: 0.25;
}
.kl-event .kl-inhalt {
  position: relative;
  z-index: 2;
  cursor: pointer;
}
.kl-h-event.kl-nichtstart,
.kl-h-event.kl-nichtende {
  margin-left: 0;
  border-left-width: 0;
  padding-left: 1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.kl-h-event.kl-nichtende,
.kl-h-event.kl-nichtstart {
  margin-right: 0;
  border-right-width: 0;
  padding-right: 1px;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.kl-tag-raster-event {
  margin: 1px 2px 0;
  padding: 0 1px;
}
tr:first-child > td > .kl-tag-raster-event {
  margin-top: 2px;
}
.kl-tag-raster-event .kl-inhalt {
  white-space: nowrap;
  overflow: hidden;
}

.kl-wochenzeilen .kl-woche {
  z-index: 1;
}
.kl-keinselect {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

.kl-container *,
.kl-container :after,
.kl-container :before {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.kl-haupt,
.kl-haupt > table {
  position: relative;
  z-index: 1;
  height:100%;
}
.kl-haupt .kl-body .kl-woche {
  min-height: 4em;
}
.kl-tag-oben.kl-vormonat,
.kl-tag-oben.kl-nexmonat {
  opacity: 0.3;
}
.kl-haupt .kl-tag-nr,
.kl-haupt .kl-woche-nr {
  padding: 2px;
}
.kl-woche-nr{
	width:30px !important;
}
.kl-haupt th.kl-tag-nr,
.kl-haupt th.kl-woche-nr {
  padding: 0 2px;
}
.kl-haupt .kl-tag-oben .kl-woche-nr {
  min-width: 1.5em;
  text-align: center;
  background-color: #f2f2f2;
  color: grey;
}
.kl-haupt td.kl-woche-nr > * {
  display: inline-block;
  min-width: 1.25em;
}