/**
 * CSS-Datei TERMIN.CSS.PHP
 * überarbeitet für Portierung nach SLP als termin_v2
 * @author  Michael Ziemke, Koeln (Germany)
 * @version 2018-11, 2015-07,2008-07
 * 2018-11: HTML5-konforme Angaben
 */

/* Normalisierung von box-sizing: (https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/box-sizing) */ 
*, ::before, ::after { box-sizing: border-box; } 

body { 
  font: 0.9em Verdana,Arial,Biolinum,Libertine,Ubuntu,sans-serif; 
  background-size: cover;
  }
body.start {
  background: url('img/start_bg.jpg') no-repeat 50% 50% fixed #FFFFA7;
 }
body.anzeige {
  background: url('img/anzeige_bg.jpg') no-repeat 50% 50% fixed #FEDFFF;
 }
body.eingabe {
  background: url('img/eingabe_bg.jpg') no-repeat 50% 50% fixed #FFED8A;
 }
body.liste {
  background: url('img/liste_bg.jpg') no-repeat 50% 50% fixed #E2C792;
 }
body.klausur {
  background: url('img/klausur2_bg.jpg') no-repeat 50% 50% fixed #E0DC92;
 }
body.abgabe {
  background: url('img/eingabe_bg.jpg') no-repeat 50% 50% fixed #FFED8A;
 }
body.tabelle {
  background: url('img/tabelle_bg.jpg') no-repeat 50% 50% fixed #F1DC43;
 }

h1,h2,h3 { 
  margin: 0px 0px 2px; 
  font-size: 1.1em;
 }

div,p { margin: 2px 0px 2px; }

input, label, select { margin: 0.1em 0em; } 
img.small { width: 1.0em; height: 1.0em; }
img.xmas-cap {
  width: 2em; height: auto; position: relative; margin: -0.2em -1.6em -0.2em -1em;   
  }


/* wegen History-Listen-Items: */
li.history { margin-left: -1.5em; } 
 
table {
  width:100%; font:1.0em Verdana,Arial,Biolinum,Libertine,Ubuntu,sans-serif; border-style:none;
  padding:1px; border-collapse:collapse; empty-cells:show;
 }  
table.tabelle {
  border: 1px solid black;
 }
 
table.kw-tabelle {
  border: 2px solid black;
  font: 0.65em Tahoma,Verdana,Arial,Biolinum,Libertine,Ubuntu,sans-serif; 
 }
 
tr.liste { border-top: 1px solid black; }

.tag-spalte {
  border: 1px solid black;
  font-size: 1.5em;
  padding: 0.3em;
  width: 8em; 
 }  
.kw-spalte {
  border: 1px solid black;
  font-size: 1.5em;
  padding: 0.3em;
  width: 3em; 
 }  
.kw-zelle {
  border: 1px solid black;
  padding: 0.3em;
  vertical-align:top; height:12em;
  width: 8em; 
 }  
.kw-druckdatum {
  padding: 0,2em; text-align: right;
 } 

div.klausur { margin: 0em; text-align: center; }
 
table.klausur { /* wegen IE-Problemen so ausführlich! */
  font: 0.65em Tahoma,Verdana,Arial,Biolinum,Libertine,Ubuntu,sans-serif; 
  border-style: solid; border-width: 2px;
 }
 
tr.klausur { 
  page-break-inside: avoid;
  }
 
th.klausur {
  vertical-align:middle; margin:0px; border: 2px solid black;
 }
th.klausur-kw {
  max-width: 5em;
 }
th.klausur-tag {
  width: 15%;
 }
td.klausur {
  vertical-align:middle; margin:0px; 
  border: solid 1px black;
  border-width: 2px 1px;  
 }

/* Spacer als Trennlinie */
img.klausur {
  margin: 0px; padding: 0.05em 0em; width: 95%; height: 1px; display: block;
 }
/* Spacer als Trennlinie */
hr.klausur {
  color: lightgray;
  margin: 0px; width: 95%; height: 1px;
}  
 
.small-width { width:6em; } 
.medium-width { width:9em; } 
.big-width { width:12em; }
.bigger-width { width:14em; }
.large-width { width:18em; }
.huge-width { width:24em; }
 
hr { margin:0px 2px 0px; padding:0px; }
select.liste, option.liste { font-size: 1.0em; width: 12em; }

.warning, .error, .alarm { color:red; margin: 0em; padding: 0em; }
.error, .bold, .alarm { font-weight:bold; }
.alarm { background-color: red; color: white; }

.javaDisabled { background-color: red; text-align: center; }
.vat { vertical-align: top; }
.vam { vertical-align: middle; }
.tal { text-align:left; }
.tac { text-align:center; }
.tar { text-align:right; }
.pad21 { padding: 0.2em 0.1em; }
.pad24 { padding: 0.2em 0.4em; }
.tacw20p { width:2em; text-align:center; }
.talw15 { width:15%; text-align:left; }
.tarw15 { width:15%; text-align:right; }
.talw34 { width:34%; text-align:left; }
.title  { font-size: 1.3rem; } /* entspricht h2 */
.eing-c { width:2em; text-align: center; }
.inaktiv { background-color: red; }
.info   { color: darkgreen; }
.legend { font-size: 0.7em; }
.mar-tb2 { margin: 0.1rem 0rem; }
.no-wrap { white-space: nowrap; }
.success   { color: black; background-color: lightgreen; padding: 0.1em 0.5em; }
.bor1sb {
  border: 1px solid black;
 } 

/* responsive Formate: */
.flex-container {
  display: flex;
  flex-direction: column;
}
.flex-item {
	flex: auto;
}
.flex-row {
    flex-direction: row;
}  

/* mittlere Viewports (z.B. Mobile quer) ab 30em; Schriftgrößen anpassen */
@media screen and (min-width: 30em) {
  body { 
    font-size:0.9em; 
   }
  h1 { font-size:1.4em; }  
  h2 { font-size:1.3em; }  
  h3 { font-size:1.2em; }  
  table.eingabe { font-size: 0.9em; }
  table.klausur { font-size: 0.8em; } 
  select.liste, option.liste { font-size: 1.0em; width: 13em; }
}

/* größere Viewports ab 45em: */
@media all and (min-width: 45em) {
  /* responsive Fließrichtung anpassen */
  .flex-container {
    flex-direction: row;
  }
  /* Tabellen-Anfangs-Breite maximieren
  table.klausur,
  table.kw-tabelle {
    font-size: 0.9em; width: 100%; margin: 1em; }
   */  
}  

/* sehr große Viewports (über 60em) */
@media screen and (min-width: 60em) {
  /* Anzeige-Maximal-Breite begrenzen */
  body { 
    max-width: 60em;
    margin: 1em auto;
   }
  body.tabelle {
    max-width: 100%; margin: 1em;
  }    
  table.kw-tabelle,table.klausur {
    font-size:1.0em;
    width: 100%;
  }  
}

/* Print- / Screen-Formate: */
@media print {
  body { font-size: 1em; }
  h1,h2,h3 { font-size: 0.8em; }
  h2.liste {  font-size: 1.3rem; } /* wegen Titel in Tabellen-Kopf */
  h2.kw-tabelle {  font-size: 1.0rem; } /* wegen Titel in Tabellen-Kopf */
  .noprint { visibility: hidden; display: none; }
  .legend { font-size: 0.6em; }
  table.klausur { font-size: 0.65em; }
  table.liste { font-size: 0.8em; }
  .bc-col-neg { 
    /* ist leider wirkungslos, sollte Tabellenköpfe beim Druck umfärben ... */
    color: white; background-color: gray; 
  }
  table tr.page-break {
    /* ist leider wirkungslos, weil tr kein Block-Element ist ... */
    page-break-after: avoid;
  } 
  .kw-zeile {
    page-break-inside: avoid;
  }  
}

@media screen {
  .printonly { visibility:hidden; display:none; }
 }
/**
kompensiert Fehler in IE 5,6,7,8 (disabled wird ignoriert)
Star-HTML und Star-plus-HTML verhindern Fehlermeldungen
zu behavior bei Mozilla, Firefox, Opera
*/
 /** wird nur von IE bis Version 6 akzeptiert */
* html #datenauswahl {
   behavior: url(ie-disabled-hack.htc);
   }
* html #zeitraum {
   behavior: url(ie-disabled-hack.htc);
   }
 /** wird nur von IE ab Version 7 akzeptiert */
*:first-child+html #datenauswahl {
   behavior: url(ie-disabled-hack.htc);
   }
*:first-child+html #zeitraum {
   behavior: url(ie-disabled-hack.htc);
   }