/* id mit #   , class mit . -----------------------------------------------  */
/* padding Vier Werte:   Abstand oben, rechts,  unten  links */


/*-------------------------------------------------------------------------------------------------------------------------------*/
/* Farben variable definieren */
:root {

  --colorlight1:  rgb(234, 234, 234 ) ;  /* hell grau var(--colorlight1)  */ 
  --colordark1:   rgb(119, 119, 119)   ;  /* dunkel grau  var(--colordark1)  */
  --colordark1:   black  ;  /* dunkel grau  var(--colordark1)  */
  --colorbackground1:  rgb(255,255,255) ; 
  
/*  alle Bereiche    */  
  
 /* hellgelb */
   --colorlightyellow:  rgb(255, 255, 144) ;    /* hell grau          var(--colorlightyellow)  */
  
 /* Grau    */ 
  --colorlightgrey:  #F5F5F5 ;  /* hell grau          var(--colorlightgrey)  */
  --colormiddlegrey: #E8E5E1 ;  /* mittel grau        var(--colormiddlegrey)   Buttons*/
  --colordarkgrey:   #808080 ;  /* dunkel grau        var(--colordarkgrey)  */

}


.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}

.drag_start {
 cursor: move;  
}

/* table  -------------------------------*/
table.termine {
width: 100%;
border-spacing: 5px 5px; /* cellspacing */
border-collapse: separate; /* muss gesetzt werden !!!*/
/* table-layout: fixed;  */
}


/* table header ------------------------------  */

.termine  th.th_werktag {
    width:14%;
	background-color: var(--colorlight1) ; 
	color: black;
	padding: 0px;
	text-align: center;
	font-weight: bold;
	font-size: 14pt; 
	border-bottom: 5px solid white;
	border: solid 1px var(--colordark1) ;
}

.termine  th.th_saso {
    width:14%;
	background-color: var(--colorlight1) ; 
	color : rgb(235, 73, 73); /* rot */ 
	padding:0px;
	text-align: center;
	font-weight: bold;
	font-size: 14pt; 
	border-bottom: 5px solid white;
	border: solid 1px var(--colordark1) ;
}


/* td -----------------------------------------------------*/
.termine td {
    width:14%;
	padding: 0px;  
	text-align: left;
	vertical-align: top;
	font-size: 12pt; 
	border: 1px solid black;   /* Farbe  Rahmen*/
	border: 1px solid rgb(180,180,180) ;
}

.termine td.td_stunden {
    width:0%;
    position:relative;
	background-color:  var(--colorbackground1) ; 
	border-top: solid 1px var(--colordark1) ;
	border-bottom: solid 1px var(--colordark1);
	border-left: solid 1px var(--colordark1);
	border-right: solid 1px var(--colorlight1);
 /*	background-color: yellow ; */
}

.termine td.td_tag {
    width: 14%;
   position:relative;
 /*   background-color:   var(--colorbackground1) ; */
	border: solid 1px var(--colordark1);
}

.termine td.td_werktag {
  color : black;
}

.termine td.td_saso {
 color : rgb(235, 73, 73); /* rot */ 
}

.termine td.td_heute {
 background-color: rgb(255,255,203) ; /* hell gelb */ 

}

.termine td.td_leer {
 background-color: white ; 
 border: 1px solid white;   /* Farbe  Rahmen*/
}


/* -------------------------------------------------*/
div.termin_sprechstunde {
  /* position: absolute; 
	left:0px;
	right:0px;
	height: 40px;
	display:block;  */
	margin-top: 6px;
	border: 1px solid rgb(212,234,168);   /* Rand wegen hover */
	border-top: 2px solid green;   /* Rand wegen hover */
	background-color: rgb(212,234,168) ; /* hell grün */ 
	z-index: 100;
}

div.termin_sprechstunde:hover{
border: 1px solid red;   /* Farbe  */
border-top: 2px solid red;   /* Rand wegen hover */
background-color: rgb(242,254,208) ; /* hell grün */ 
cursor: pointer;
}

div.termin_urlaub {
margin-top: 6px;
background-color: rgb(212,212,212) ; /* hell grau */ 
}

/* -------------------------------------------------*/
.stunden_zahl {
    position:absolute; 
    text-align: center;
	/* font-weight: bold; */
	font-size: 8pt; 
	color: var(--colordarkgrey);
}


.stunden_linie {
  position: absolute;   
  border-top: 1px solid var(--colorlight1);
  height: 1px;
  width: 100%;
  left:0;
  z-index: 10;
}


/* Kalender Zahl */
.kalender_zahl {
 text-align: right;
 float: right;
 font-weight: bold;
 font-size: 14pt;
}

/* Schrift fuer Minuten  hochgesetzt*/
sup.sup_font {
 font-size: 10pt;
}


.termine_data_icon {
width: 20px;
float:right;
}

/* -------------------------------------------------*/
a.navigation  {
	border: 1px solid var(--colordark6);   /* Farbe  Rahmen*/
	padding: 3px 7px 3px 7px;
	text-decoration: none;
	/* font-weight: bold;  */
	color: var(--colordark6);    /* Farbe Schrift */  
	display: inline;
}

a.navigation:hover {
	background-color: var(--colorlight6);) ; /* hell grau */ 
	color: var(--colordark6);   /* Farbe Schrift */
	cursor: pointer;
}

span.navigation_active  {
    padding: 3px 7px 3px 7px;
    background-color: var(--colordark6);  
	border: 1px solid var(--colordark6);   /* Farbe  Rahmen*/
	text-decoration: none;
	/* font-weight: bold;   */
	color: white;    /* Farbe Schrift */  
}

/* ---- navigation_therapeut ------------------------------*/
a.navigation_therapeut  {
	border: 1px solid var(--colordark4);   /* Farbe  Rahmen*/
	padding: 3px 7px 3px 7px;
	text-decoration: none;
	/* font-weight: bold;  */
	color: var(--colordark4);    /* Farbe Schrift */  
	display: inline;
}

a.navigation_therapeut:hover {
	background-color: var(--colorlight4);) ; /* hell grau */ 
	color: var(--colordark4);   /* Farbe Schrift */
	cursor: pointer;
}

span.navigation_therapeut_active  {
    padding: 3px 7px 3px 7px;
    background-color: var(--colordark4);  
	border: 1px solid var(--colordark4);   /* Farbe  Rahmen*/
	text-decoration: none;
	/* font-weight: bold;   */
	color: white;    /* Farbe Schrift */  
}



/* ---- navigation_patient ------------------------------*/
a.navigation_patient  {
	border: 1px solid var(--colordark5);   /* Farbe  Rahmen*/
	padding: 3px 7px 3px 7px;
	text-decoration: none;
	/* font-weight: bold;  */
	color: var(--colordark5);    /* Farbe Schrift */  
	display: inline;
}

a.navigation_patient:hover {
	background-color: var(--colorlight5);) ; /* hell grau */ 
	color: var(--colordark5);   /* Farbe Schrift */
	cursor: pointer;
}

span.navigation_patient_active  {
    padding: 3px 7px 3px 7px;
    background-color: var(--colordark5);  
	border: 1px solid var(--colordark5);   /* Farbe  Rahmen*/
	text-decoration: none;
	/* font-weight: bold;   */
	color: white;    /* Farbe Schrift */  
}