/* Plan.css Stundenplanprogramm */
/* Klein- Großschreibung der id und class einhalten! */
/* Refresh des Cache im Browser durch direktes Anzeigen der Plan.css und dann Reload möglich*/
body { /*Hintergrund*/
    background-color:#FFFFFF; /*#FFFFFF*/
    font-family:calibri,verdana,sans-serif;
    font-size:80%;
    color:#888;
    padding: 0px;
    margin: 0px;  /*Randlos*/
}
p {margin: 0px;}

h1 { font-size:2em; font-style:italic; background-color: #009EE3; color:#FFFFFF ;padding-left: 0.5rem;padding-right:0.5rem; margin:0px; } /*Ueberschrift: Stundenplan*/
h2 { font-size:1.3em;color:black;padding-left: 0.5rem;padding-right:0.5rem; margin: 0px; } /*Ueberschrift Typ z.B. Seminargruppe*/
h3 { font-size:1em;color:black;padding-left: 0.5rem; padding-right:0.5rem; margin: 0px; } /*Ueberschrift: Legende*/

@media screen and (min-width:940px) {
  #plaene {
    display:grid; 
    grid-template-columns: repeat(auto-fit, minmax(470px, 1fr));
  } 
}
#plaene {
  margin :0px;
}
/*table.Plan {
    page-break-inside: avoid;  
    align-self: stretch;
}  */ 

table,td,th,tr {border-collapse: collapse;} 

/*Smartphone hoch und quer*/
@media only screen and
(min-device-width:320px) and
(max-device-width:480px){
    body {
    /*wenn aus Intranetseite gestartet wird bei 2rem der Text viel zu groß*/
        font-size: 12pt;
    }  
    nav li .burger, .submenu{
        font-size: 4rem;  
    }
    nav .homepage img {
        height: 4rem;
        width: auto;
    }
 #sicp button,
 #sicp label,
 #sicp input,
 #sicp select {
        font-size: 2rem;
    }
 #sicp button,
 #sicp input {
        min-width: 12rem;
        min-height: 2rem;
    }
}

@media screen and (max-device-width: 480px) and (orientation:portrait),(max-width:30rem){
  th.Montag::after {
    content: "Mo";
  } 
  span.Montag {
    display:none;
  } 
  th.Dienstag::after {
    content: "Di";
  } 
  span.Dienstag {
    display:none;
  } 
  th.Mittwoch::after {
    content: "Mi";
  } 
  span.Mittwoch {
    display:none;
  } 
  th.Donnerstag::after {
    content: "Do";
  } 
  span.Donnerstag {
    display:none;
  } 
  th.Freitag::after {
    content: "Fr";
  } 
  span.Freitag {
    display:none;
  } 
  th.Sonnabend::after {
    content: "Sa";
  } 
  span.Sonnabend {
    display:none;
  } 
  th.Sonntag::after {
    content: "So";
  } 
  span.Sonntag {
    display:none;
  }
}
.Vorlesung,
.Feiertag,
.Anwesend,
.Abwesend,
.stand,
.zeit,
.LegendeLang
{ /*Silbentrennung*/
  word-wrap: break-word;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto; 
}
div {
    margin:3px;
}

nav > ul {
    list-style:none;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
} 
nav li{
    /*font-size: 1em; */ 
    float:left;
}
#kopf, nav, nav a {
    background-color: #009EE3;
    color:#FFFFFF;
    margin: 0px;
    display: block;
    /*padding: 0.2em;*/
    text-decoration: none; 
    text-align: left;
    transition: all .25s ease-in;	  
}
nav li[aria-current] a {
    background-color: firebrick; 
    color: gold;
}
nav .submenu a  {
    background-color: blue;    
}    
nav a:focus,
nav a:hover,
nav li[aria-current] a:focus,
nav li[aria-current] a:hover {    
    color: blue; 
    background-color: gold;
}	
/*     submenu navigation links      */
nav .submenu { 
    display:none;
    height: 0;
    z-index: 100; 
    position: absolute;
}
nav .submenu li { 
    display: block; 
    clear:both;
    width: 9em;
}
ul.submenu {
    padding: 0px;
} 
/**     Show the submenu on hover, focus     **/
nav li:hover .submenu,
nav li:active .submenu, 
nav li:focus .submenu
{ 
    display:block;
    height: auto;
}
.burger a{
    font-size:   1.3em;
    padding-left:  0.4em;
    padding-right: 0.4em;
    text-align: center;
}

.stand { /*Stand: Datum Zeit*/
  color:#FFFFFF;
  font-size:0.8em;
  text-align: right;
  float:right;
  padding-right:0.3em;
}
.homepage {
    float:right;
    padding:  0.2em;
    margin-left: 0.4em;
}
#kopf {
  background-color: #009EE3;
}

#kiosk #kopf{
  height: 65px;
}

#kiosk body {
  font-size:100%;
}
#kiosk #plaene {
  display:inline; /*grid deaktivieren */
}

#kiosk {
  /*font-size:100% !important; da id auf html geht es nicht*/
  overflow: hidden; /*Scrollbars ausblenden*/
  background-color: #009EE3;
}

#kiosk .seiten, #kiosk .nodata{
  margin-left: 10px;
/*  color: #fff;*/
}

#kiosk .bemerkung{
  font-size:90%;
}
#kiosk address {
  display:none;
}
#kiosk h1 {
  font-size:300%;
}
#kiosk .stand {
  font-size:150% !important;
}
#kiosk th.Plankopf {
  height: 40px;
}

#kiosk table.Plan { 
  height:542px;
  width: 100%;
  font-size: 130%;
  margin-left: 0px;
  margin-right: 0px; 
}
#kiosk #zeiten {
  width:140px;
}

#abheute body {
 font-size:100% !important
}
#abheute #plaene {
 display:inline; /*grid aufheben*/  
}

#abheute {
  font-size:100% !important; /*geht nicht mehr da id bei html-Tag*/
  overflow: hidden;
}
#abheute table.Plan {
  height:752px; /*Phillips Display hat 1280x800px*/
  /*min-height:500px;*/
  /*line-height: 2.5em;*/
  margin-left: 0px;
  margin-right:0px;
  width:100%;
}

#abheute address {
  display:none;
}
#abheute h1 {
  font-size:300%;
}
#abheute #zeiten {
  width:150px;
}
#abheute .jetzt { /*aktuelle Zeit*/
    color:red;
}
#abheute .zeit {
  font-size:150% !important;
}
#abheute .Plankopf {
  font-size:150%;
}
#abheute .Plankopf.jetzt::after {
  content:" (Heute)";
}
#abheute .stand {
  font-size:150% !important;
}
#abheute h2 {
  display:none;
}

#sicp,#sharp body {
  font-size: 120%;
}

#sicp,#sharp {
  font-size: 120%;
  color: black;
}
#sicp form,
#sicp label,
#sicp input,
#sicp button,
#sharp form,
#sharp label,
#sharp input,
#sharp button {
  float: left;
  margin: 3px;
  padding: 0px;
  box-sizing: border-box;
}
#sicp div,#sharp div {
  float: none;
  clear: both;
}

#sicp .raum,#sharp .raum,#sharp .ip {
  font-size: 200%;
}

#sicp .on,#sharp .on {
  color:green;
}
#sicp .off,#sharp .off {
  color:red;
}
#sicp address,#sharp address {
  display:none;
}
#sicp fieldset,#sharp fieldset {
 margin:0px;
 padding: 2px;
}
#AlleDisplays {
  border-top: 2px solid gray;
}
.error {
  color:red;
}
.hinweis {
 clear:both;
}

table.Plan { /*Stundenplan Tabelle*/
    background-color:#FFFFFF;
    font-size:80%;
   /* line-height: 1.5em;  nicht verwenden, sonst geht Hochstellen von Typ nicht*/
    border: #888 1px solid;
    margin-left: 1%;
    margin-right: 1%;
    margin-bottom: 0px;
    width: 98%; /*wegen margin kleiner als 100%*/
    /*min-width: 20em;*/
    table-layout:fixed;
}
#zeiten {
 width:7em;
}
/*#werte {
 width: 10%; 
}*/
th {   /*Zeiten*/
  border: #888 1px solid;
  background-color:#A0A0A0;  
  color:#FFFFFF;
}
table.Plan tbody tr td { /*leere Stunden*/
  border-bottom: 1px #808080 dotted;
  border-left: 1px #808080 dotted;
  border-right: 1px #808080 none; /*bessere Punktlinie in Kompatibilitsmodus*/
  border-top: 1px #808080 dotted;
  text-align: center;
}

table.Plan tbody tr:nth-child(odd) { /*ungerade Zeilen im Stundenplan*/
  background:#F5F5F5;
}

td.Plan {
 /*     border: #888 1px solid;*/  
}
th.Plankopf { /*Ueberschriften der Tabelle*/
    /*font-style:italic;*/
    background-color:#888;
    color:#FFFFFF;
}
.Plankopf[data-tooltip] {
    position: relative;
    cursor: pointer;
}

.Plankopf[data-tooltip]:hover:before {
   content: attr(data-tooltip); 
   /* Tooltip Form*/
    width: 4em;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    top: 2em;
    left: -0.2em;
}
/* ein Pfeil am Tooltip geht nicht, da before und after schon belegt sind*/

th.mindest { /*Zeiten ausserhalb Standardzeiten der Tabelle*/
    font-style:italic;
    background-color:#C0C0C0;
}
th.jetzt { /*aktuelle Zeit*/
    color:red;
}
th.vergangen { /*vergangene Zeitangaben*/
    color:#ddd;
}
td.Vorlesung { /*Vorlesungsstunden*/
    background-color:#FFFFc0; /*#FFFF00*/
    color:black;
}
td.Anwesend { /*Stunden mit Bemerkung bei Anwesenheit*/
    background-color:#cFcFcF; /*#FFFF00*/
    background-image: linear-gradient(to right, #C0C0C0 , #FFFFFF);
    color:black;
}
td.Abwesend {
    background-image: linear-gradient(to right, #00FFFF, #FFFFFF);
}
span.typ {
    text-align:right;
    vertical-align:30%; /*widerspricht float:right !!*/
    float:right;
    font-weight: bold;
    font-size: 70%;
}
.fach {
    font-weight: bold;
}
td.Feiertag { /*Feiertagsstunden*/
    background-color:#00FF00; 
    background-image: linear-gradient(to right, #00FF00, #FFFFFF);
   /* font-weight: bold;*/
    text-align: center;
    color:black;
}
td.LegendeKurz { /*Legende Abkuerzung*/
    /*font-weight: bold;*/
    color:black;
}
table.Legende { /*Legende*/
    font-size:80%;
    margin: 1em;
}

.Beschriftung { /*Beschriftung der Formularelemente in FrageServlet*/
    font-size: 10pt;
   /* color:black;*/
}
#icallink {  /*in Frage ausblenden*/
    border: 0px;
    padding:0px;
    margin: 0px;
    float:left;
}

body form { /*gemeinsame Fragen in FrageServlet*/
    margin: 0.2em;  
}

div.frage {
  padding:0px;
}  
div.frageCmd  {
 display:block;
 max-width:120px; /*für IE*/
 float:left;
}
div.frageWahl  {
  display:block;
  float:left;
  min-width:100px;
}
div.frageBlock {
 display:block;
 float:left;
  background-color:#DDD; /*#FFFF00*/
  border-bottom: #888 1px solid;
  border-top: #888 1px solid;
  margin:0px;  
}
div.frageGesamt {
  max-width: 350px;
  padding:0px;
  margin:0px;
}

input.frageButton{
   float: inherit;
}
input.frageButton, input.kabinettbutton {
    width:100px;
    color:#FFFFFF;
    background-color: #009EE3;
    border: 0px none;
    padding: 2px 6px;
    margin: 3px 0px;
    text-align: center;
    cursor: pointer;
}
input.frageButton:hover, input.Kabinettbutton:hover {
    background-color: #C4DD42;  
} 
input.frageButton:active, input.Kabinettbutton:active {
    background-color: #00FF00;  
}
 
input.Kabinettbutton {
   width: auto;
}
input.LegendeFach {
  margin-left:0px;
}

address {
    margin-left: 1em;
}
#bildort body {
  font-size: 120%;
}

/*Smartphone hoch und Desktop, ohne viewport Einstellung
muss nach #zeiten da letzter Eintrag Priorität hat*/
/*14.8.2020 metatag view-port und span class=vonbis eingefügt*/
/*13.01.2021 Zeit als Tooltip*/
@media screen and (max-device-width:480px) and (orientation:portrait),(max-width:30rem){
 /* span.vonbis {
    display:none;
  }*/
  #zeiten {
    width:2em;
  }
  /* Zeit als Tooltip*/
  span.vonbis {
    visibility: hidden;
    width: 6em;
    background-color: black;
    color: #fff;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    position: absolute;
   /* top: -5px; */
    left: 3em; 
    z-index: 1;
  }
  span.vonbis::after { /*Pfeil*/
  content: " ";
  position: absolute;
  top: 50%;
  right: 100%; /* To the left of the tooltip */
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent black transparent transparent;
}
  /* zeigt Zeit als Tooltip bei mouse over */
  .zeit:hover .vonbis {
    visibility: visible;
    user-select: none; /*damit nicht ausversehen markiert wird, was bei Smartphones passiert*/
  }
  .zeit {
    cursor: pointer;
  }
}

@media print {
    @page {
       /*size:landscape;*/
       /*Seitenbeschriftung wird weder von Firefox noch Chrome unterstützt
       @top-left-corner { content: " "; border: solid green; }
  @top-right-corner { content: "Test"; border: solid green; }
  @bottom-right-corner { content: counter(page); border: solid green; }
  @bottom-left-corner { content: " "; border: solid green; }*/
    }
    html {
      font-size: 10pt;
    }
    /*#frage { geht, aber leerer Frame bleibt erhalten*/
    #f1 {
     /* width:0px;*/
      display:none;
    }
    body {
        background-color:#FFFFFF;
        color:black;
        font-size: 10pt;
    }
    img,.Kabinettbutton { 
        display:none;  /* Icons fuer Druck ausblenden*/
    } 
    hr, address {
        display:none;
    }
    #plaene {
      page-break-before: avoid;
      display:grid;
      grid-template-columns: repeat(auto-fit, minmax(9cm, 1fr));
    }
    #zeiten {
      width:2cm;
    }
    div.Plan {
      page-break-inside: avoid;  /*kein Seitenumbruch in Tabelle bei Druck*/
      break-inside: avoid-page; /*css 2*/
    }
    table.Plan { /*Stundenplan Tabelle*/
        font-size: 8pt;
        border: #000000 1px solid;
        page-break-inside: avoid;  /*kein Seitenumbruch in Tabelle bei Druck*/
        break-inside: avoid; /*css 2*/
        -webkit-region-break-inside: avoid;
    }
    h3 {
      /*page-break-before: always;*/
      page-break-after: avoid;
      break-after: avoid-page;
    }
    td.Vorlesung { /*Vorlesungsstunden*/
        border: #000000 1px solid;
    }
    th.jetzt{ /*Format löschen*/
        color:#FFFFFF;
    }
    th.vergangen{ /*Format löschen*/
        color:#FFFFFF;  
    }
    a:link,
    a:visited,
    a:hover,
    a:active,
    a:focus{
      font-weight:bold; color:#000000; text-decoration:none;
    }
      /* entfernt bei Druck Zeit als Tooltip bei mouse over */
  .zeit:hover .vonbis {
    visibility: hidden;
  }
  .Plankopf[data-tooltip]:hover:before {
   display:none; 
  }
}