@charset "UTF-8"; 


h1{

font-size: x-large;
color: #FF8300;
  
}

h2{
    font-size: 0.9em;
    padding-top: 0.3em;
    padding-bottom: 0.5em;
    color: #FF8300;
    font-style: italic; 
}

h3{
    font-size: 1.0em;
    color: #000080;
    padding-top: 0.3em;
    
}

h4{
   font-size: 1.3em;
   color: #FF8300;
}

div.table { 
      display: block; 
      border-collapse:collapse;
      margin: 0.8em;
      width: 100%;
 
}

div.th{
    display: table-header-group;
    font-weight: bold;
    font-size: 1.0em;
    padding-top: 2em;
}

div.tr { 
      display:table-row;
    
}
div.td { 
      display:table-cell; 
      padding-left:0.5em;
      padding-right:0.5em;
      padding-bottom:0.5em;
      font-size: 0.95em;

     
}
div.tdleft { 
      display:table-cell; 
      padding-left:0.5em;
      padding-right:0.5em;
      padding-bottom:0.5em;
      font-size: 0.95em;

}

p span.th {
    display:block;
    padding-top: 1.5em;
    padding-bottom: 0.5em;
}



a.linkButton {
    
  text-decoration: none;
    
}

a.cal {
 
  padding-left: 0.5em;

}

.autocomplete {
  /*the container must be positioned relative:*/
  position: relative;
  display: inline-block;
}

.autocomplete-items {
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
}
.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}

.autocomplete-items div:hover {
  /*when hovering an item:*/
  background-color: #e9e9e9;
}
.autocomplete-active {
  /*when navigating through the items using the arrow keys:*/
  background-color: DodgerBlue !important;
  color: #ffffff;
}

@media (min-width: 767px){

table.bib tr td, table.urkunde tr td, table.formular tr td {

padding: 0.3em;
font-size: 0.9em;

}

table tr td.button{

font-size: 1em;
padding: 0.3em;
color: #E20937;

}

div.table{   

}

div.td {      
     
}
div.tdleft { 

}

span.info{

font-weight:bold;

}


span.star{

color: #E20937;

}

span.important{

color: #E20937;
font-weight: bold;

}

optgroup{

font-size: 0.8em;

}

option {

font-size: 0.9em;
}

input.mail{
       width: 300px; 
}

input#nameSickPerson{
    width: 300px;
}

input.button{
       margin-top:3em;
       font-size: 1.0em;
       padding: 0.3em;
       font-weight: bold;
       color: #E20937;
       vertical-align: middle;

 
}

button.button{
       margin-top:2em;
       font-size: 1.0em;
       padding: 0.3em;
       color: #E20937;
       vertical-align: middle;

 
}

input.buttonSmall{
       margin-top:0em;
       font-size: 0.8em;
       color: #000;
        font-weight: bold;
       vertical-align: middle;

}



}


@media (max-width: 767px){

div#content {

width: 100%;

}


table.bib tr td, table.urkunde tr td, table.formular tr td {

padding: 0.3em;
font-size: 0.7em;

}

div.table{
    font-size: 0.7em;
}

table tr td.button{

font-size: 0.7em;
padding: 0.3em;
color: #E20937;

}

div.td {      
     
}
div.tdleft { 

}

input.mail{
       width: 90%; 
}

input#nameSickPerson{
       width: 90%; 
}

input.button{
       margin-top:3em;
       font-size: 0.7em;
       padding: 0.3em;
       font-weight: bold;
       color: #E20937;
       vertical-align: middle;

 
}

input.buttonSmall{
       margin-top:0em;
       font-size: 0.8em;
       color: #000;
        font-weight: bold;
       vertical-align: middle;

}

button.button{
       margin-top:2em;
       font-size: 0.7em;
       padding: 0.3em;
       color: #E20937;
       vertical-align: middle;

 
}


span.star{

color: #E20937;

}

span.info {

font-weight:bold;
font-size: 0.8em;

}

span.info1 {

font-size: 0.8em;

}



span.important{

color: #E20937;
font-weight: bold;
font-size: 0.8em;

}

select#stdg, select#stdg1, select#stdg2{

width: 90%;

}

select#sickreason{
    width: 78%
}

optgroup{

font-size: 0.8em;

}

option {

font-size: 0.9em;
}


textarea {

width: 90%;

}

textarea#comment{
    
   width: 78%; 
}

}



/*Backends*/

table.tablesorter tr th{
background-color: #e6EEEE;
border: 1px solid #FFF;
font-size: 9pt;
padding: 4px;
}

table#auswahl{

width: 100%;
font-family:arial;
margin:10px 0pt 15px;
border-collapse: collapse;
border: 3px solid #CDCDCD;

}

table#auswahl tr td {

background-color: #e6EEEE;
border: 2px solid #CDCDCD;
padding-left: 1.5em;
padding-right: 1.5em;
padding-top: 0.8em;
padding-bottom: 0.8em;
border-collapse: collapse;


}

table#auswahl tr td.search{

border-left:none;

}

table#auswahl tr td.subject{

border-right:none;

}



table#auswahl tr td.button {

width: 50%;
text-align: center;
vertical-align: middle;

}



table.select{

width: 100%;
}

table.select tr td{

  padding: 0.3em;

}


table.select tr td.column1 {
    	
    font-style: italic;
    width: 40%;
	
}

table.select tr.main td.column2 {
    
    font-weight: bold;
    text-align: left;
    width: 40%;	
}



table.select tr td.column3 {
    
    text-align:center;
    vertical-align:middle;
    width: 20%;
	
}


table.result, table.termin, tfood tr th{

	font-family:arial;
	background-color: #CDCDCD;
	margin:10px 0pt 15px;
	font-size: 9pt;
	width: 100%;
	text-align: left;

}

table.result thead tr th, table.termin thead tr th{

	background-color: #e6EEEE;
	border: 1px solid #FFF;
	font-size: 9pt;
	padding: 4px;

}

table.result tr td {

	color: #3D3D3D;
	padding: 4px;
	background-color: #FFF;
	vertical-align: top;

}


table.result tr#main td{    
    font-weight: bold;   
   
}



table.termin tr td{

	color: #3D3D3D;
	padding: 4px;
	vertical-align: top;

}


table.termin tr td.noBorder {
    
    background-color: white;
    text-align:center;
    vertical-align:middle;

}

table.termin tr td.hidden{
display: none;

}