*, *:before, *:after                { -webkit-box-sizing: border-box;
                                      -moz-box-sizing: border-box;
                                      box-sizing: border-box; }

body                                { height: 97%;
                                      font-family: Jost,Helvetia,Arial,sans-serif;
                                      font-size: 10pt; 
                                      margin-top: 0px;
                                      background-color: #FFFFFF;
                                      background-image: url('background.jpg');
                                      background-repeat:repeat;
                                      background-position:center center;
                                      background-size:auto;
                                      background-attachment:fixed; }

input                               { font-family: Jost,Helvetia,Arial,sans-serif; }

a                                   { text-decoration: none; 
                                      color: black; }

a:link                              { text-decoration: none;
                                      color: black; }

a:visited                           { text-decoration: none; 
                                      color: black; }
 
a:hover                             { text-decoration: none; }
                                      
a.blue                              { color: #1E73BE; } 

a.blue:hover                        { text-decoration: underline; }

a.blue:visited                      { color: #1E73BE; }
                                      
h1                                  { font-size: 14pt; 
                                      background-color: #E0E0E0; 
                                      margin-top: 0px; 
                                      border-bottom: 2px solid black; }   

h3                                  { margin-top: 2px; }

.tabactive                          { border-top: 3px solid green;
                                      border-radius: 5px 5px 0px 0px;
                                      background-color: #FFFFFF; 
                                      opacity: 0.8;
                                      font-size: 16pt; 
                                      width: auto;
                                      padding-left: 10px;
                                      padding-right: 10px; }

.tabinactive                        { border-top: 3px solid red;
                                      border-radius: 5px 5px 0px 0px;
                                      background-color: #E0E0E0; 
                                      opacity: 0.8;
                                      font-size: 16pt; 
                                      width: auto;
                                      padding-left: 10px;
                                      padding-right: 10px; }

.top                                { font-size: 18pt; 
                                      color: #1E73BE; }

.button                             { width: 190px; 
                                      font-family: Jost,Helvetia,Arial,sans-serif;
                                      display: inline-block;
                                      border: 1px solid #C0C0C0; 
                                      text-align: center; 
                                      font-weight: bold; 
                                      padding-top: 5px; 
                                      padding-bottom: 5px; 
                                      background-image: linear-gradient(white, #CFCFCF); }

.postbutton                         { width: 190px; 
                                      font-family: Jost,Helvetia,Arial,sans-serif;
                                      display: inline-block;
                                      border: 1px solid #C0C0C0; 
                                      text-align: center; 
                                      font-weight: bold; 
                                      padding-top: 5px; 
                                      padding-bottom: 5px; 
                                      background-image: linear-gradient(white, #CFCFCF); }

.flexbutton                         { font-size: 9pt;
                                      padding: 2px;
                                      border-radius: 2px;
                                      width: auto; }

.vollbutton                         { color: #555555; }

.smallbutton                        { margin-left: 4px;
                                      width: 35px; 
                                      display: inline-block;
                                      border: 1px solid #C0C0C0; 
                                      text-align: center; 
                                      font-weight: bold; 
                                      padding-top: 5px; 
                                      padding-bottom: 5px; 
                                      background-image: linear-gradient(white, #CFCFCF); }

.button:active                      { border: 1px solid #333333;
                                      background-color: white;
                                      background-image: none; 
                                      background-image: linear-gradient(#CFCFCF, white); }

.button:hover                       { border: 1px solid #333333; }
 
.flexbutton:active                  { border: 1px solid #333333;
                                      background-color: white;
                                      background-image: none; 
                                      background-image: linear-gradient(#CFCFCF, white); }
 
.flexbutton:hover                   { border: 1px solid #333333; }

.smallbutton:active                 { border: 1px solid #333333;
                                      background-color: white;
                                      background-image: none; 
                                      background-image: linear-gradient(#CFCFCF, white); }

.smallbutton:hover                  { border: 1px solid #333333; }

.inputfield                         { width: 200px; 
                                      height: 25px; 
                                      border: 1px solid black; }

.inputfield_short                   { width: 20px; 
                                      height: 18px; 
                                      border: 1px solid black; }

.redbox                             { border: 1px solid red;
                                      background-color: #FFD9D9;
                                      margin-bottom: 5px; 
                                      padding: 4px; }
                                      
.greenbox                           { border: 1px solid green;
                                      background-color: #DFFFDF;
                                      margin-bottom: 5px; 
                                      padding: 4px; }
                                      
.yellowbox                          { border: 1px solid yellow;
                                      background-color: #FFFFBF;
                                      margin-bottom: 5px; 
                                      padding: 4px; }

.error                              { border: 1px solid red;
                                      background-color: #FFD9D9; }                                      

.redtext                            { color: red; }

.checkboxerror                      { outline: 2px solid red; }
                                      
.dropdown                           { font-size: 10pt; 
                                      width: auto;
                                      height: 30px; }
                                      

.thema_grund                        { font-size: 8pt; 
                                      background-color: #80FF80; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_a                            { font-size: 8pt; 
                                      background-color: #B0D8FF; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_b                            { font-size: 8pt; 
                                      background-color: #FF9393; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_c                            { font-size: 8pt; 
                                      background-color: #FFFFBF; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_t                            { font-size: 8pt; 
                                      background-color: #FF8800; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_bkf                          { font-size: 8pt; 
                                      background-color: #FFAE88; 
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.thema_test                         { font-size: 8pt; 
                                      background-color: #FF0000; 
                                      color: #FFFFFF;
                                      font-weight: bold; 
                                      padding-left: 5px; 
                                      padding-right: 5px; } 

.sessions                           { width: 100%; }

::placeholder 											{ font-size: 14pt; }

#wrapper                            { width: 1200px; 
                                      margin: auto; }

#header                             { background-color: #FFFFFF;
                                      padding-top: 15px;
                                      padding-left: 20px;
                                      height: 96px;
                                      margin-bottom: 20px; }
                                      
#footer                             { background-color: #333333;
																		  padding-left: 20px;
                                      margin-top: 20px;
                                      padding-top: 10px;
                                      height: 50px;
                                      opacity: 0.9;
                                      line-height: 1.5;
                                      color: #FFFFFF; }
                                      
#header .fslogo                     { float: right; 
                                      margin-right: 50px; } 

#main                               { background-color: #FFFFFF; 
                                      opacity: 0.8;
                                      padding: 5px; }

#login                              { border: 1px solid #1E73BE;
                                      text-align: center;
                                      padding: 5px;
                                      width: 60%;
                                      margin: 0 auto;
                                      background-color: #FFFFFF;
                                      display: flex;
  																		justify-content: center;
  																		align-items: center; 
  																		padding-bottom: 25px; }
                                      
#login .inputfield                  { height: 35px; 
																			width: 385px; 
																			margin-bottom: 3px; }
																			
#login .loginbutton                 { width: 385px; 
                                      font-family: Jost,Helvetia,Arial,sans-serif;
                                      display: inline-block;
                                      border: 1px solid #C0C0C0; 
                                      text-align: center; 
                                      font-weight: bold; 
                                      padding-top: 5px; 
                                      color: white;
                                      padding-bottom: 5px; 
                                      margin-bottom: 6px;
                                      background-color: #1E73BE; }

#login .loginbutton:active          { border: 1px solid #333333;
                                      background-color: white;
                                      background-image: none; 
                                      background-image: linear-gradient(#CFCFCF, white); }

#login .loginbutton:hover           { border: 1px solid #333333; }

#login .label 											{ display: none; }

#sessions                           { border-spacing: 0px;
                                      width: 100%;
                                      margin: auto; }

#sessions .mobil                    { display: none; }    /* Blendet mobile Spalte in Web-Ansicht aus */

#sessions tr.head                   { background-color: #FFFFFF;
                                      font-weight: bold; }
 
#sessions tr.head td                { border-bottom: 1px solid black; background-color: #C0C0C0; }

#sessions tr.line                   { height: 45px; }

#sessions tr.line td                { border-bottom: 1px solid #C0C0C0; }

#sessions tr:last-child td          { border-bottom: none; }


#sessions td.teilnehmer             { text-align: left;
                                      width: 80px; }

#sessions td.datum                  { width: 150px;
                                      color: black;
                                      text-align: center; }

#sessions td.filiale                { width: 150px;
                                      color: black; }

#sessions td.thema                  { width: auto; }

#sessions td.aktionen               { width: 200px; 
                                      text-align: right; }

#sessions_admin                     { border-spacing: 0px;
                                      width: 100%;
                                      margin: auto; }

#sessions_admin tr.head             { background-color: #FFFFFF;
                                      font-weight: bold; }
 
#sessions_admin tr.head td          { border-bottom: 1px solid black; background-color: #C0C0C0; }

#sessions_admin tr.line             { height: 45px; }

#sessions_admin tr.line td          { border-bottom: 1px solid #C0C0C0; }

#sessions_admin td.teilnehmer       { text-align: left;
                                      width: 80px; }

#sessions_admin td.datum            { width: 120px;
                                      color: black;
                                      text-align: center; }

#sessions_admin td.filiale          { width: 150px;
                                      color: black; }

#sessions_admin td.thema            { width: auto; }

#sessions_admin td.aktionen         { width: 200px; 
                                      text-align: right; }

#user                               { border-spacing: 0px;
                                      width: 100%;
                                      margin: auto; }
                            
#user tr.head                       { background-color: #FFFFFF;
                                      font-weight: bold; }
                            
#user tr.head td                    { border-bottom: 1px solid black; 
                                      background-color: #C0C0C0; }

#user tr.line                       { height: 45px; }

#user tr.line td                    { border-bottom: 1px solid #C0C0C0; }

#user tr.unlock                     { height: 45px; }
                            
#user tr.unlock td                  { border-bottom: 1px solid #C0C0C0; 
                                      background-color: #FFFFBF; }
                            
#user td.vorname                    { width: 300px; }

#user td.nachname                   { width: 300px; }

#user td.aktionen                   { width: 180px;;
                                      text-align: right; }

#warnmeldung 												{ display: none; 
                                      width: 385px; }                                    
                                      
/* --------------------------------------------------------------------------------------------------------- */
/* - ANPASSUNGEN FÜR RESPONSIVE DESIGN --------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------------------- */

@media all and (max-width: 710px) {
  
body                                { background-image: none; 
                                      height: 100%; 
                                      width: 100%; 
                                      margin-left: 0px; 
                                      margin-right: 0px; }

.button                             { width: 100%; }  
                                    
.flexbutton                         { width: 85px; }                                      

.inputfield                         { width: 100%; 
                                      border: 1px Solid black; 
                                      margin-bottom: 3px; }

::placeholder 											{ font-size: 10pt; }

#main                               { padding-left: 1px; 
                                      margin-left: 0px; 
                                      padding-right: 1px; }

#wrapper                            { width: 100%; }

#header                             { margin-bottom: 0px;  
                                      padding-left: 0px;
                                      padding-top: 0px; 
                                      padding-bottom: 1px;
                                      background-color: #C0C0C0; 
                                      height: auto; }

#header .fslogo                     { display: none; }        

#header .logoutbutton               { float: right; 
                                      margin-top: 5px; 
                                      margin-right: 1px; }

#footer                             { display: none; }

#register                           { width: 100%; 
                                      margin: 0px; 
                                      padding: 0px; 
                                      border-spacing: 0px;}
                                      
#register td.label                  { width: 150px; 
                                      text-align: right; }

#register td.input                  { width: auto; }

#sessions tr.head                   { display: none; }

#sessions td.datum                  { display: none; }

#sessions td.filiale                { display: none; }

#sessions td.thema                  { display: none; }

#sessions td.mobil                  { display: table-cell; }

#sessions td.aktionen               { width: 85px; }

#sessions .button                   { width: 85px; }

#sessions .vollbutton               { width: 85px; }                

#login                              { border: 0px;
																			text-align: left;
                                      width: 100%;
                                      background-color: green;
                                      padding: 1px;
                                      height: auto;
                                      margin: 0 auto;
                                      background-color: #FFFFFF;
                                      display: block;
  																		justify-content: left;
  																		align-items: left; }
                                                         
#login h2														{ font-size: 14pt; 
                                      background-color: #E0E0E0; 
                                      margin-top: 4px; 
                                      border-bottom: 2px solid black; }

#login .label 											{ display: block;
																			color: #0E0E0E; 
																			font-size: 8pt; }
                                                                  
#login .inputfield                  { height: 30px; 
																			width: 100%;
																			margin-bottom: 3px; }
																			
#login .loginbutton                 { width: 100%; 
                                      font-family: Jost,Helvetia,Arial,sans-serif;
                                      display: inline-block;
                                      border: 1px solid #C0C0C0; 
                                      text-align: center; 
                                      font-weight: bold; 
                                      padding-top: 5px; 
                                      color: white;
                                      padding-bottom: 5px; 
                                      margin-bottom: 6px;
                                      background-color: #1E73BE; }

#login .loginbutton:active          { border: 1px solid #333333;
                                      background-color: white;
                                      background-image: none; 
                                      background-image: linear-gradient(#CFCFCF, white); }

#login .loginbutton:hover           { border: 1px solid #333333; }
                                      

#warnmeldung 												{ display: none; 
                                      width: 100%; }                                    

}