/* CSS Document */
@import url("//netdna.bootstrapcdn.com/bootstrap/3.0.0-rc2/css/bootstrap-glyphicons.css");
@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('/kellerproject/fonts/glyphicons-halflings-regular.eot');
  src: url('/kellerproject/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/kellerproject/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/kellerproject/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/kellerproject/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

html { height: 100%;}
body { background-color: #f8f8f8; height: 100%; font-size: 9pt !important;}
label { font-size: 1rem; padding-top:8px;}
a { color: #e3001b; font-weight: 600;}
a:hover { color: #a87112; }
hr { border:solid #00ffff 0px; background-color:#999; height:1px; text-align:left; width: 97%;}


table { width: 100%; max-width: 100%; }
.tablescrollable {   width: 100%;  overflow-y: auto;  margin: 0 0 1em;}
.tablescrollable::-webkit-scrollbar {   -webkit-appearance: none;  width: 14px;  height: 14px;}
.tablescrollable::-webkit-scrollbar-thumb {   border-radius: 8px;  border: 3px solid #fff;  background-color: rgba(0, 0, 0, .3);}


textarea {height: 200px;}
td {padding: 2px; padding-left: 10px; padding-right: 10px; width: auto; vertical-align: top;}
.tdfunktion {background-color: red; color: white; border:1px solid white; font-size:12px; font-weight: 300;}
.tdfunktiongreen {background-color: #105205; color: white; border:1px solid white; font-size:12px; font-weight: 300;}
.tdfunktionorange {background-color: #d54100; color: white; border:1px solid white; font-size:12px; font-weight: 300;}
.tdfunktionyellow {background-color: #d54100; color: white; border:1px solid white; font-size:12px; font-weight: 300;}
.tdsumme {background-color: #666; color: white; border:1px solid white; border-top: 10px solid white;}
.tdsummetelematik {background-color: #666; color: white; border:1px solid white; border-top: 1px solid white;}
.tduserzeile { height: 120px;}
.hrsumme {width: 100%; height:3px; line-height: 3px !important; margin-top: -5px !important;}
.linebreak { border:solid #00ffff 0px; background-color:#999; height:1px; text-align:left; width: 100%;margin-top: 5px; margin-bottom: 10px;
}
/* FORMS */
.form-control { font-size: 1.2rem; height: 25px; margin: 4px; padding: 2px; border: 1px solid #444; box-shadow: 2px 2px 2px #666;}
.betweenforms { font-size: 1.2rem; color: white; font-weight: 600; margin-top: 7px;}
.btn { font-size: 1.5rem; height: 28px; margin: 4px; padding: 4px;}
.formbutton { background-color: #666; color: #fff; box-shadow: 4px 4px 4px 1px #666; margin-right: 15px;}
.formbutton:hover { background-color: #666; color: #fff; box-shadow: 2px 2px 2px 1px #333;}
.buttonlistfunktionen {padding: 2px; border-radius: 5px; font-size: 9pt; border: 1px solid #999;}
.buttonlistfunktionen:hover {padding: 2px; border-radius: 5px; font-size: 9pt;box-shadow: 2px 2px 2px 1px #999; border: 1px solid #666;}

.formularfehler{ background: red; color: white; font-size: 16pt; font-weight: 300; width: 100%; padding: 5px; border-radius: 8px; margin-bottom: 5px; box-shadow: 2px 2px 2px #444;}
.formularerfolg{ background: green; color: white; font-size: 16pt; font-weight: 300; width: 100%; padding: 5px; border-radius: 8px;}
.formularfehler1{ background: red; color: white; font-size: 13pt; font-weight: 300; width: 100%; padding: 5px; border-radius: 8px; margin-bottom: 5px; box-shadow: 2px 2px 2px #444;}
.formularerfolg1{ background: green; color: white; font-size: 13pt; font-weight: 300; width: 100%; padding: 5px; border-radius: 8px;}



#infosfahrer {visibility: hidden;}

h1 {font-size: 16pt;}
.navbar h2 { color: #e3001b; padding-top: 0px; text-shadow: 2px 1px 2px #666;}
h2 { color: #fff;  text-shadow: 2px 1px 2px #666; font-size: 15pt;}
.HeadContent {color: #333;}
h3 { margin: 0px; padding: 6px; font-size: 1.5rem; color: #333;  text-shadow: 2px 1px 2px #666;}
h4 { margin: 0px; padding: 6px; font-size: 1.7rem; color: #e3001b;  text-shadow: 1px 1px 1px #666;}
p { padding: 10px;}
.h3left {text-align: left !important; padding-left: 0px !important; }
.h3leftpadding {text-align: left !important; padding-left: 10px !important; }
.h3right {text-align: right !important; padding-right: 0px !important; }
.h3statistik {font-size: 26pt; background: #CCC;}
.headoverview { color: #444; font-size: 12pt;text-shadow: none; font-weight: 600; padding: 0px; padding-top: 5px;}
.headsidebar { color: #444;}

.navbar { min-height: 22px;  margin-bottom: 0px;  border: 1px solid transparent; padding: 0px; }
.navbar-default { background-color: #fff; border-color: #e7e7e7; }
.navbar-side {min-height: 30px;}
.navbar-collapse {padding-left: 0px; padding-right: 0px;}
.nav-item a {padding-left: 15px !important;padding-right: 15px !important;}
.navisymbols { font-size: 3.5rem; color: #fff !important; padding: 15px; }
.navisymbols:hover { background: #7e7e7e !important; height: 90px; padding: 15px;}
.navloginblock {color: #e3001b; background-color: #5c5c5c; height: 90px;}
.contentsymbols { font-size: 9.5rem; color: #e3001b !important; padding: 15px; float: left; margin-right: 10px;}
.contentsymbols:hover { background: #7e7e7e !important; text-decoration:  none;}
.pmnavi {width: 100%;}

.pmnavibutton {padding: 8px; background-color: #ececec; margin: 2px; box-shadow: 1px 1px 1px 1px #999; width: 19%;}
.pmnavibutton:hover{padding: 8px; background-color: #ececec; margin: 2px; box-shadow: 0px 0px 0px 0px #999; width: 19%; color: #fff;}
.linkbutton { padding: 8px; background-color: #ececec; margin: 2px; box-shadow: 1px 1px 1px 1px #999; margin-top: 10px; clear: both;}

.sidemenunavi span {background-color: red; padding: 10px; color: white; font-weight: 500;}

.nav > li > a:focus, .nav > .pmnavibutton > a:hover {     text-decoration: none;    background-color: #777;    color: #fff;    padding: 0px;    margin: 0px;}
.nav > li > a:focus, .nav > .pmnavibutton > a {    text-decoration: none;    padding: 0px;    margin: 0px;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover { background: #5c5c5c !important; height: 30px;}


.sidemenu { width: 220px; background: #fff; margin-bottom: 1px;}
.sidebar-navbar-collapse { padding-left: 0px; padding-right: 0px;}
 .mysidebar { background-color: ; }
.sidemenu a { color: #e3001b !important;}
.sidemenu a:hover { color: #fff !important;}

.sidemenunavi { width: 100%; padding: 5px; font-size: 12pt; font-weight: 400;list-style-type: none;}
.sidemenunavi:hover {background-color: #333; color: white; border-bottom: 1px solid white; border-top: 1px solid white;}
.sidemenusubnavi { width: 100%; padding-left: 20px; font-size: 11pt; font-weight: 200; list-style: none;}
.sidemenusubnavi:hover {background-color: #333; color: white; border-bottom: 1px solid white; border-top: 1px solid white; padding-left: 20px;}
.aktiv {background-color: #333; color: white;}
.sidebar { background: #f8f8f8; box-shadow: 3px 3px 3px 1px #666; padding: 0px !important; margin: 0px !important;}
.mysidebar { background: transparent; border: 0px; border-radius: 0px;}
.navbar-form { position: absolute; bottom: 85px;}
.navbar-nav > li > a {     padding-top: 5px;     padding-bottom: 5px;}
.navbar-nav > li:hover { background-color: #777;}

/*BOXEN */
.container50 { box-shadow: 2px 2px 2px 0px #666;}
.container { border: 1px solid #f8f8f8; box-shadow: 2px 2px 2px 1px #666; background-color: #f3f3f3;}
.containerbox { border: 1px solid #fff; box-shadow: 2px 2px 2px 1px #666; background-color: #fff; margin-bottom: 8px;z-index: 10;}
.containerbox_neu { border: 1px solid #fff; box-shadow: 1px 1px 1px 1px #666; background-color: #eee; margin: 5px; border-radius: 7px; }
.containerbox h3 {text-align: center; margin-top:5px;}
.container-fluid, .container {  padding: 0px; }
.boxpadding {padding: 10px;}
.nopadding{ padding: 0px !important;}
.incontent { border: 0px solid #f8f8f8; box-shadow: 2px 2px 2px 1px #666; background-color: #f3f3f3; border-top-right-radius: 15px;}
.darkblock, .pagination { height: 35px; background: #5c5c5c; border-top-left-radius: 0px; box-shadow: 2px 2px 2px 1px #666; padding-top: 2px; padding-bottom: 2px; margin-bottom: 5px;
  background-image: -webkit-linear-gradient(top, #777, #222);
  background-image: -moz-linear-gradient(top, #777, #222);
  background-image: -ms-linear-gradient(top, #777, #222);
  background-image: -o-linear-gradient(top, #777, #222);
  background-image: linear-gradient(to bottom, #777, #222);}


.darkblock h2 {margin-top: 5px; margin-bottom: 5px; text-shadow: 2px 2px 2px #000 !important; color: #fff; }

.darkblocknavi { height: 35px; background: #5c5c5c; border-top-left-radius: 0px; box-shadow: 2px 2px 2px 1px #666; padding-top: 2px; padding-bottom: 2px; margin-bottom: 5px;
  background-image: -webkit-linear-gradient(top, #999, #555);
  background-image: -moz-linear-gradient(top, #999, #555);
  background-image: -ms-linear-gradient(top, #999, #555);
  background-image: -o-linear-gradient(top, #999, #555);
  background-image: linear-gradient(to bottom, #999, #555);}

.tabellespaltenheadline {background: #444; color: #fff; font-size: 12pt; font-weight: 600;}

.boxhead    { background: #5c5c5c; border-top-right-radius: 15px; box-shadow: 2px 2px 2px 1px #666;}
.boxcontent { border: 0px solid #f8f8f8; box-shadow: 2px 2px 2px 1px #666; background-color: #f3f3f3; margin-bottom: 10px;}
.boxheadline{ margin: 0px; padding: 5px;}
.gallery { height: 800px !important;}
/* MAIN GRID */
.grid {   display: flex;   border: 0px solid black;}
.grid-cellsidebarleft {   flex: 2;  }
.grid-cellcontent {   flex: 10;   padding: 0px; padding-right: 0px;  }
.grid-cellsidebarleft {   flex: 1; }

#popupbackgroung {position: fixed; width: 100%; height: 100vh; opacity: 0.5; background: #000; visibility: hidden; z-index: 10; top: 1px;}

#popupboxRegister { position: fixed; top: 0px; left: 50%; transform: translateX(-50%);  width: 30%; height: 885px;  overflow: auto; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000;  visibility: hidden; z-index: 250;  }
.popupcontent { text-align: center; width: 100%; height: 515px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}
#popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 30%; height: 220px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
#popupboxLogin{ position: absolute; top: 20%; left: 50%; transform: translate(-50%); width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1053;}
#popupboxPWRestore  { position: absolute; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
#popupUrlaubseingabe  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
#popupKrankschreibung { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 55;}
#popupChangeUrlaub  { position: absolute; top: 20%; left: 50%; transform: translate(-50%);   width: 90%; height: 245px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 54;}
.popupcontentchangeurlaub { text-align: center; width: 100%; height: 225px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}

#popupLoader  { position: fixed; top: 50%; left: 50%; transform: translate(-50%);   width: auto; height: auto; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 54;}
.popupcontentLoader { text-align: center; width: auto; height: auto;  border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}

#popupDeleteUrlaub  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 90%; height: 145px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 54;}
.popupcontentdeleteurlaub { text-align: center; width: 100%; height: 125px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}

#stundenkontoform { width: 100%; height: 1px; visibility: hidden;}
#popupDeleteZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 90%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1540;}
#popupUngueltigZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 90%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
#popupFahrerStundenKorrektur { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 90%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1542;}
#popupFahrerStundenAbzug { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 90%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1543;}
#infomeldung  { position: fixed; top: 80px; left: 50%; transform: translateX(-50%);  width: 530px; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 50;}
#infofeldneuekacke { position: absolute; top 1px; visibility: hidden; background-color: #eee; z-index: 100; min-height: 142px; box-shadow: 2px 2px 2px 2px #999; border-radius: 10px; padding: 10px;}
#problemmanager  { position: fixed; top: 90px; left: 0%;   width: 99.5vw; height: 86vh; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1000;}
#popupboxRegisterReady, #popupLogoupload { position: fixed; top: 0px; left: 50%; transform: translateX(-50%);  width: 460px; height: 220px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 40;}
#protokollcontent {visibility: visible; height: 115px; overflow: hidden;}
#zahlencontent {visibility: visible; height: 115px; overflow: hidden;}
#problemcontent {visibility: visible; height: 115px; overflow: hidden;}
#uploadpictures{visibility: hidden; height: 1px;}
#uploadfiles{visibility: hidden; height: 1px;}
#statuscontentcontainer {height: 225px;}
#problemcontentcontainer{height: 225px;}
#bestellcontentcontainer{height: 225px; display: block;}
#terminecontentcontainer{height: 225px;}
#zahlencontentcontainer{height: 225px;}
#functionencontentcontainer{height: 225px;}
#problemdokucontent {visibility: hidden; height: 1px;}
#buttonstatusprotolloff{visibility: hidden;}
#buttonproblemprotolloff{visibility: hidden;}
#buttonbestellprotolloff{visibility: hidden;}
#buttonuploadpicturesoff{visibility: hidden;}
#buttonuploadfilesoff{visibility: hidden;}
#buttonzahlenoff{visibility: hidden;}

#project2, #project3, #project4, #project5, #project6, #project7, #project8, #project9, #project10, #project11, #project12, #project13 { visibility: visible; height: 1px; overflow: hidden; border: 0px solid black; width: 100%; }
#fahrzeitenproject4 { visibility: hidden; height: 1px;}

.diemeldung {font-size: 18pt; color: black;}
.popupcontentLogin, .popupcontentproblem { text-align: center; width: 530px; height: 515px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}
.popupcontentdelete { text-align: center; width: 530px; height: 515px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}
.popupcontentdelete { widtH: 460px; height: 180px; padding-right: 20px;}
.popupcontentProjekt { text-align: center; width: 460px; min-height: 120px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}
.editcontent{ width: 100%; height: auto; padding: 5px; color: #333; }
.popupcontentLogin { height: 185px;}
#AddLoginButton { width: 100%; box-shadow: 3px 3px 3px #333; }
.popupcontentproblem {height: 82vh; width: 99.5vw;}
#stundenformular {border: 0px solid red;}





.problemanzahl {background-color: #a60a0a; padding: 7px; color: white; font-weight: 500;}



.glyphicon-remove{ float: right; color: #e3001b; }
.glyphbig { font-size: 9rem;}
.alert { padding: 6px;}
.filelist {list-style-type: none; background: #999; width: auto; padding: 3px; border-radius: 5px; box-shadow: 2px 2px 2px 1px #333; text-align: center !important; float: left; margin-right: 2px; margin-bottom: 2px;}
.filelist:hover { box-shadow: 1px 1px 1px 0px #333; text-align: center !important;}
.filelist > a { color: white !important; text-shadow: 1px 1px 1px #000;}
/* FOOTER */
.footer{ background: #fff; color: #5c5c5c; margin-top: 15px; box-shadow: 1px -1px 2px 2px #666; padding-top: 5px; padding-bottom: 8px !important; font-size: 10px; bottom: 0px !important; position: fixed; width: 100% !important;}
.footerinner{ background: #fff !important; color: #5c5c5c; margin: 0px;  font-size: 10px; box-shadow: 0px 0px 0px 0px #111; display: block;    margin-right: auto;   margin-left: auto}
.footernav { background: #fff !important; clear: left; margin-top: 15px; padding-top: 15px;}
.footernav > li > a {color: #333; padding-top: 0px; padding-bottom: 0px; }
 .footernav li:hover{box-shadow: 2px 2px 2px 1px #666;}
 .footernav li { float: left; margin: 0px; border-radius: 5px; margin: 2px; box-shadow: 5px 5px 5px 1px #666; background: #ccc;}
.footernav > li > a:hover { background: #eee; color: #333; padding-top: 0px; padding-bottom: 0px; border-radius: 5px; }
.footerdivs{ border: 0px solid white; }
.footerdivs > h5 { margin: 0px;}
.container-full {clear: left;}
#resultresponse {background: red;}
#resultresponse_start { position: fixed; top: 150px; right: 10px; height: 200px; width: 350px; z-index: 500; box-shadow: 2px 2px 2px 0px #999; border-radius: 8px; background-color: #ccc; visibility: hidden;}
#resultresponse_master{ min-height: 200px; height: auto; width: 100%; z-index: 500; box-shadow: 2px 2px 2px 0px #999; border-radius: 8px; background-color: #ccc; visibility: visible; padding: 10px;}
#resultresponse_master1{ min-height: 200px; height: auto; width: 100%; z-index: 500; box-shadow: 2px 2px 2px 0px #999; border-radius: 8px; background-color: #ccc; visibility: visible; padding: 10px;}
#resultresponse_user{  height: 60px; width: 100%; box-shadow: 2px 2px 2px 0px #999; border-radius: 8px; background-color: #ccc; visibility: visible; padding: 10px; clear: both;}
#resultresponser { position: fixed; top: 150px; right: 10px; height: 200px; width: 350px; z-index: 500; box-shadow: 2px 2px 2px 0px #999; border-radius: 8px; background-color: #ccc; visibility: hidden;padding: 10px;}



.zeile1 {background-color: #fefefe; min-height: 200px;}
.zeile2 {background-color: #ececec; min-height: 200px;}
.zeilefunktion1 {background-color: #fefefe; min-height: 20px;}
.zeilefunktion2 {background-color: #ececec; min-height: 20px;}
.zeile40_1 {background-color: #fefefe; min-height: 40px; padding: 5px;}
.zeile40_2 {background-color: #ececec; min-height: 40px; padding: 5px;}
.zeile60_1 {background-color: #fefefe; min-height: 60px; padding: 5px;}
.zeile60_2 {background-color: #ececec; min-height: 60px; padding: 5px;}
.zeile90_1 {background-color: #fefefe; min-height: 90px; padding: 5px;}
.zeile90_2 {background-color: #ececec; min-height: 90px; padding: 5px;}
.zeile240_1 {background-color: #fefefe; min-height: 240px; padding: 5px; box-shadow: 2px 2px 2px #666;}
.zeile240_2 {background-color: #ececec; min-height: 240px; padding: 5px; box-shadow: 2px 2px 2px #666;}
.smallzeile1 {background-color: #fefefe; min-height: 142px; padding: 10px;}
.smallzeile2 {background-color: #ececec; min-height: 142px; padding: 10px;}
.zeilekalender1{background-color: #fefefe; min-height: 280px;}
.zeilekalender2{background-color: #ececec; min-height: 280px;}


.cleanbg {background: rgba(220,160,140,0.0);}


.smallsubtext {font-size: 10pt;}
/* NEWLSETTERDESIGNER */
.headerhead { visibility: visible;  float: left;}
.headercontentblock, .footercontentblock, .contentcontentblock   { position: absolute; top: 145px; left: 355px; z-index: 20; visibility: visible; display: inline-block; height: 0vh; overflow-x: hidden; overflow-y: auto; background: #CCC; width: 0px; box-shadow: 3px 3px 3px 0px #666;}
.headerhead {visibility: hidden;  box-shadow: 3px 3px 3px 0px #666; padding: 9px; margin-top: -2px; background: #EEE;}
#addBlock{ box-shadow: 3px 3px 3px 0px #666; padding: 9px; margin: 0px; background: #EEE;}
.contentcontentblock   {margin-left: -4px; }
.footercontentblock   {margin-left: -4px; }
.headerthumb, .contentthumb, .footerthumb {margin: 10px;}
.headlineHeaderSelection { text-align: center;}
.letterDesign { background: #fab846; width: 100%;  height: auto; min-height: 70vh; box-shadow: 3px 3px 3px 0px #666; padding: 15px;}
.headerLetterBlock, .headerLetterBlockLeft, .headerLetterBlockRight { margin: 0 auto; min-height: 50px; height: auto; background: #fff; width: 800px; text-align:center; vertical-align: middle; padding: 20px;}
.headerLetterBlockLeft { text-align: left;}
.headerLetterBlockRight { text-align: right;}


.setheadline {  display: block;  margin-right: auto; margin-left: auto; padding-top: 150px; width: 90%; text-align:center;}

.sectionNews7 {width: 800px; background: #bcbcbc;  color: #333; margin: 0 auto; padding-top: 25px; padding-bottom: 10px;}
.sectionNews7 p  { text-align: justify !important;  color: #333;}
.sectionNews7 h4  {text-align: center;  color: #333;}

.sectionNews8 , .sectionNews9, .sectionNews10 {width: 800px; background: #dbdbdb;  color: #333; margin: 0 auto; padding-top: 15px; padding-bottom: 10px;}
.sectionNews8 p, .sectionNews9 p, .sectionNews10 p   { text-align: justify !important;  color: #333;}
.sectionNews8 h4, .sectionNews9 h4, .sectionNews10 h4   {text-align: center;  color: #333;}

.footer1 { width: 800px; background: #000; margin: 0 auto;}
.footer1 h6 { color: #578eea; font-size: 12pt; text-align: center;}
.footer1 h4 { color: #acc0e3; font-size: 20pt; text-align: center;}
.footer1 p { color: #acc0e3; font-size: 12pt; text-align: justify;;}
.footerline {color: #fff; font-size: 9.5pt; text-align: center; background: #141414; padding:3px;}
.footer2line { text-align:right; margin-bottom: 15px; color: #acc0e3;}

.setcolor1 {background: #578fea; }
.modulnavi { margin: 0 auto; width: 800px; background: #333; color: #fff; text-align: center;}
.modulnavi a { font-size: 8pt; letter-spacing: 1px;}
.blockNav { width:auto; margin: 0 auto;}
.letterNav { margin-left: 8px; margin-right: 8px; }
#logoupload { width: 300px; height: 200px; box-shadow: 4px 4px 4px 0px #666; position: absolute; top: 30%; left: 50%; transform: translate(-50%); border-radius: 8px; background: #fff; padding: 15px; visibility: hidden;}
#formneukunde {visibility: hidden;}
#editterminkghform, #editterminksohlehform, #editbaustellengespraechform {visibility: hidden; height: 1px;}


#spaltelinks_md2 { position: fixed; top: 90px; left: 0px; overflow-y: scroll; height: 90%;}
#topheader {position: relative; width: 100%;z-index: 1;}
#infolayer {background: #AAA; border-radius: 10px; border-bottom-left-radius: 0px; border-top-left-radius: 0px; border-bottom-right-radius: 0px; margin-top: -10px; padding: 5px; padding-left: 15px;}
.infolayeranschrift {font-weight: 600; font-size: 13pt; padding-left: 10px;}


.problem {background: #ff9a9a; border-radius: 5px; box-shadow: 2px 2px 2px 2px #666;}
.status {background: #a1dcf4; border-radius: 5px; box-shadow: 2px 2px 2px 2px #666;}
.files {background: #f9cb90; border-radius: 5px; box-shadow: 2px 2px 2px 2px #666;}
.files a { color: #444;}
.files a:hover { color: #000; text-decoration: none;}
.status {background: #a1dcf4; border-radius: 5px; box-shadow: 2px 2px 2px 2px #666;}
.filesupload {background: #c4f990; border-radius: 5px; box-shadow: 2px 2px 2px 2px #666;}
.filesupload a { color: #444;}
.filesupload a:hover { color: #000; text-decoration: none;}


  .dropzone {       min-height: 150px;       border: 2px solid rgba(0, 0, 0, 0.3);       background: white;       padding: 20px 20px;       border-radius: 10px;       box-shadow: 4px 4px 4px 1px #666; }
  .bg-success {   background-color: green !important;  }
  .progress {     height: 40px; background-color:  #CCC;}

.BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 100%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
.ZahlCircle {border-radius: 50%; border: 5px solid red; margin: 0 auto; width: 110px; height: 110px; text-align: center; font-size: 46pt;}

.lineprojectlist{ width: 100% !important; border: 0px solid red;height: 42px;}
.linkprojectlist{ width: 70% !important; float: left; }
.linkprojectlist small, .linkprojectlist1 small {font-size: 7pt; color: #666;}

.linkprojectlist1{ width: 10% !important; float: left; }
.progressprojectlist{ width: 50% !important; float: left; }
.infoprojectlist {width: 25% !important; float: left;}
.stepnumber{ padding: 5px; padding-top: 2px; padding-bottom: 2px; background-color: #ccc; border: 1px solid #777; box-shadow: 4px 4px 4px 1px #666; margin: 0px; border-radius: 6px; font-size: 13pt; color: #fff; text-shadow: 2px 2px 2px #666; float: right; padding-top: -3px;}
.stepnumberlist { padding: 12px; background-color: #ccc; border: 1px solid #777; box-shadow: 4px 4px 4px 1px #666; margin: 0px; border-radius: 6px; font-size: 15pt; color: #fff; text-shadow: 2px 2px 2px #666; float: right; padding-top: -3px; width: 100%;}
.projectlist, .projectdetail { float: left; width: 17%;}
.projectfunction {float: left; width: 32%;}


/* URLAUBSKALENDER */

.jahr {background-color: red; color: white;}
.tag {width: 0.9%; border: 1px solid green; padding: 1px; font-size: 10px;}
.Mo, .Di, .Mi, .Do, .Fr { background-color: #efefef; border: 1px solid #666; border-bottom: 2px solid#333;}
.Sa, .So, .feiertag { background-color: #CDCDCD; border: 1px solid #666; border-bottom: 2px solid#333;}
.abgelehnt {background-color:  red;}
.verboten {background-color:  #ff8888;}
.beantragt {background-color:  orange;}
.freigegeben {background-color:  green;}
.erlaubt {background-color:  #a9da50;}
.geplant { background-color: orange;}
.mitarbeiterliste {width: 120px !important; border-bottom: 2px solid#333;}

/*STUNDENTABELLE KALENDER */
.weekendtable  {background-color: #EEE; border-bottom: 1px solid #CDCDCD;}
.feiertag  {background-color: #EEE;}
.weekdaytable  {border-bottom: 1px solid #CDCDCD;}
.stundenabrechnungkopf, .tagessummen {background-color: red; color: white;}

/* CALENDAR */
.calender { width:280px; border:0px solid black; z-index: 2; }
.calender, .calender {   width:100% !important; }

.weekdays{ 	width: 8%;	float: left;	}
.dayheadline{ 	float: left; 	width: 50%;    height:80px;    line-height: 20px; background: #eee;	}
.kalenderweek{	height: 560px;	width: 50%;	float: left; vertical-align: middle; text-align: center; font-size: 18pt; background: #CECECE; padding: 5px;}
.calender div.after, .calender div.before{    color:silver;}
.dayheadline{ 	float: left; 	width: 50%;    height:80px;    line-height: 20px; background: #eee;	}
.day {    float:left;    width:91%;    height:80px;    line-height: 20px;    text-align: left; padding: 5px; padding-left: 10px; border-bottom: 1px solid #666; position:relative;}
.day.headline {    background:silver;}
.day.current {    font-weight:bold;}

.dayheadlinelog{ 	float: left; 	width: 50%;    height:160px;    line-height: 20px; background: #eee;	}
.kalenderweeklog{	height: 1120px;	width: 50%;	float: left; vertical-align: middle; text-align: center; font-size: 18pt; background: #CECECE; padding: 5px;}
.dayheadlinelog{ 	float: left; 	width: 50%;    height:160px;    line-height: 20px; background: #eee;	}
.daylog {    float:left;    width:91%;    height:160px;    line-height: 20px;    text-align: left; padding: 5px; padding-left: 10px; border-bottom: 1px solid #666; position:relative;}
.daylog.headline {    background:silver;}
.daylog.current {    font-weight:bold;}
.tagnummerlog {height:20px; margin-right: 0px; width: 15px; float: left;}
.timelinelog { position: absolute; top: 140px; left: 25px; width: 100%; height: 20px; border: 0px solid red;  font-size: 10px; font-weight: 100; visibility: visible;}


.clear {    clear:left;}
.pagination {     text-align: center;    height:45px;    line-height:20px;  bold; width: 100%; margin-bottom: 0px;}
.pagihead {    display:inline-block;   background: none;   width: 80%;   height: 45px; padding: 10px; font-size: 18pt;  color: white;}
.pagination a {    width:20px;    height:20px;}
.calenderheadline {width: 65%;  text-align: left; float: left;}
.calenderheadeingabe { text-align: right; padding-top: 5px; height: 45px; width: 35%; float: right; color: white; padding-right: 15px;}
.weekend {background-color: #aaa; color: white;}
.blocktermin {width: 7.0%; height: 70px; background: #AAA; float: right; margin-left: 2px; border-radius: 5px; font-size: 8pt;}
.blockterminwerk {width: 20%; height: 70px; background: #AAA; float: right; margin-left: 2px; border-radius: 5px; font-size: 8pt;}
.termintyp {width: 100%; height: 25px;}
.termintextlabel {font-size: 11pt; font-weight: 900; color: white; text-shadow: 1px 1px 1px black;}
.terminnamelist {font-size: 9.5pt;font-weight: 100; letter-spacing: -1px;}
.terminnamelist a { color: #000; text-shadow: 1px 0px 0px #fff;}
.timeline { position: absolute; top: 60px; left: 25px; width: 100%; height: 20px; border: 0px solid red;  font-size: 10px; font-weight: 100; visibility: visible;}

.stundeskale { float: left; height: 20px; border-left: 1px solid #000; width: 6%; padding-left: 5px;}
.projektblock{ padding: 2px; background-color: #b4a5e2;}
.arbeitszeit {background-color: #40c640;  margin: 2px; float: left; box-shadow: 1px 1px 1px #333; height: 40px; margin-top: 10px; font-size: 10px; padding-left: 5px;}
.fahrerzeit {background-color: #58eeec;  margin: 2px;  float: left; box-shadow: 1px 1px 1px #333; height: 40px; margin-top: 10px; font-size: 10px;}
.beifahrerzeit {background-color: #eec958;  margin: 2px; float: left;  box-shadow: 1px 1px 1px #333; height: 40px; margin-top: 10px; font-size: 10px;}
.DOPPELT { color: #fff; background-color: red;}
.pause { background-color: #eb924b;  margin: 2px;  float: left; box-shadow: 1px 1px 1px #333; height: 40px; margin-top: 10px; font-size: 10px;}
.krank {background-color: #ff7c1c;}
.ueberstunden {background-color: #77b900;}
.urlaub {background-color: #c887f6;}
.feiertag {background-color: #87a9f6;}
.tagnummer {float: left;}

.stunde000 { width: 0.0%;}
.stunde025 { width: 1.5%;}
.stunde050 { width: 3%;}
.stunde075 { width: 4.5%;}
.stunde100 { width: 6%;}
.stunde125 { width: 7.5%;}
.stunde150 { width: 9%;}
.stunde175 { width: 10.5%;}
.stunde200 { width: 12%;}
.stunde225 { width: 13.5%;}
.stunde250 { width: 15%;}
.stunde275 { width: 16.5%;}
.stunde300 { width: 18%;}
.stunde325 { width: 19.5%;}
.stunde350 { width: 21.0%;}
.stunde375 { width: 22.5%;}
.stunde400 { width: 24%;}
.stunde425 { width: 25.5%;}
.stunde450 { width: 27%;}
.stunde475 { width: 28.5%;}
.stunde500 { width: 30%;}
.stunde525 { width: 31.5%;}
.stunde550 { width: 33%;}
.stunde575 { width: 34.5%;}
.stunde600 { width: 36%;}
.stunde625 { width: 37.5%;}
.stunde650 { width: 39%;}
.stunde675 { width: 40.5%;}
.stunde700 { width: 42%;}
.stunde725 { width: 43.5%;}
.stunde750 { width: 45%;}
.stunde775 { width: 46.5%;}
.stunde800 { width: 48%;}
.stunde825 { width: 49.5%;}
.stunde850 { width: 51%;}
.stunde875 { width: 52.5%;}
.stunde900 { width: 54%;}
.stunde925 { width: 55.5%;}
.stunde950 { width: 57%;}
.stunde975 { width: 58.5%;}
.stunde1000 { width: 60%;}
.stunde1025 { width: 61.5%;}
.stunde1050 { width: 63%;}
.stunde1075 { width: 64.5%;}
.stunde1100 { width: 66%;}
.stunde1125 { width: 67.5%;}
.stunde1150 { width: 69%;}
.stunde1175 { width: 71.5%;}
.stunde1200 { width: 73%;}
.stunde1225 { width: 74.5%;}
.stunde1250 { width: 76%;}
.stunde1275 { width: 77.5%;}
.stunde1300 { width: 79%;}
.stunde1325 { width: 80.5%;}
.stunde1350 { width: 82%;}
.stunde1375 { width: 83.5%;}
.stunde1400 { width: 85%;}
.stunde1425 { width: 86.5%;}
.stunde1450 { width: 88%;}
.stunde1475 { width: 89.5%;}


.zeit0600 {position: absolute; left: 0%; margin-top: -20px;}
.zeit0615 {position: absolute; left: 2%; margin-top: -20px;}
.zeit0630 {position: absolute; left: 4.1%; margin-top: -20px;}
.zeit0645 {position: absolute; left: 6.2%; margin-top: -20px;}
.zeit0700 {position: absolute; left: 8.3%; margin-top: -20px;}
.zeit0715 {position: absolute; left: 10.3%; margin-top: -20px;}
.zeit0730 {position: absolute; left: 12.4%; margin-top: -20px;}
.zeit0745 {position: absolute; left: 14.5%; margin-top: -20px;}
.zeit0800 {position: absolute; left: 16.6%; margin-top: -20px;}
.zeit0815 {position: absolute; left: 18.6%; margin-top: -20px;}
.zeit0830 {position: absolute; left: 20.7%; margin-top: -20px;}
.zeit0845 {position: absolute; left: 22.8%; margin-top: -20px;}
.zeit0900 {position: absolute; left: 24.9%; margin-top: -20px;}
.zeit0915 {position: absolute; left: 26.9%; margin-top: -20px;}
.zeit0930 {position: absolute; left: 29.0%; margin-top: -20px;}
.zeit0945 {position: absolute; left: 31.1%; margin-top: -20px;}
.zeit1000 {position: absolute; left: 33.2%; margin-top: -20px;}
.zeit1015 {position: absolute; left: 35.2%; margin-top: -20px;}
.zeit1030 {position: absolute; left: 37.3%; margin-top: -20px;}
.zeit1045 {position: absolute; left: 39.4%; margin-top: -20px;}
.zeit1100 {position: absolute; left: 41.5%; margin-top: -20px;}
.zeit1115 {position: absolute; left: 43.5%; margin-top: -20px;}
.zeit1130 {position: absolute; left: 45.6%; margin-top: -20px;}
.zeit1145 {position: absolute; left: 47.7%; margin-top: -20px;}
.zeit1200 {position: absolute; left: 49.8%; margin-top: -20px;}
.zeit1215 {position: absolute; left: 51.8%; margin-top: -20px;}
.zeit1230 {position: absolute; left: 53.9%; margin-top: -20px;}
.zeit1245 {position: absolute; left: 56.0%; margin-top: -20px;}
.zeit1300 {position: absolute; left: 58.1%; margin-top: -20px;}
.zeit1315 {position: absolute; left: 60.1%; margin-top: -20px;}
.zeit1330 {position: absolute; left: 62.2%; margin-top: -20px;}
.zeit1345 {position: absolute; left: 64.3%; margin-top: -20px;}
.zeit1400 {position: absolute; left: 66.4%; margin-top: -20px;}
.zeit1415 {position: absolute; left: 68.4%; margin-top: -20px;}
.zeit1430 {position: absolute; left: 70.5%; margin-top: -20px;}
.zeit1445 {position: absolute; left: 72.6%; margin-top: -20px;}
.zeit1500 {position: absolute; left: 74.7%; margin-top: -20px;}
.zeit1515 {position: absolute; left: 76.7%; margin-top: -20px;}
.zeit1530 {position: absolute; left: 78.8%; margin-top: -20px;}
.zeit1545 {position: absolute; left: 80.9%; margin-top: -20px;}
.zeit1600 {position: absolute; left: 83.0%; margin-top: -20px;}
.zeit1615 {position: absolute; left: 85.0%; margin-top: -20px;}
.zeit1630 {position: absolute; left: 87.1%; margin-top: -20px;}
.zeit1645 {position: absolute; left: 89.2%; margin-top: -20px;}
.zeit1700 {position: absolute; left: 91.3%; margin-top: -20px;}
.zeit1715 {position: absolute; left: 93.3%; margin-top: -20px;}
.zeit1730 {position: absolute; left: 95.4%; margin-top: -20px;}
.zeit1745 {position: absolute; left: 97.5%; margin-top: -20px;}



.timeskale24_00 {width: 4.1%; float: left;}
.timeskale24_01 {width: 4.1%; float: left;}
.timeskale24_02 {width: 4.1%; float: left;}
.timeskale24_03 {width: 4.1%; float: left;}
.timeskale24_04 {width: 4.1%; float: left;}
.timeskale24_05 {width: 4.1%; float: left;}
.timeskale24_06 {width: 4.1%; float: left;}
.timeskale24_07 {width: 4.1%; float: left;}
.timeskale24_08 {width: 4.1%; float: left;}
.timeskale24_09 {width: 4.1%; float: left;}
.timeskale24_10 {width: 4.1%; float: left;}
.timeskale24_11 {width: 4.1%; float: left;}
.timeskale24_12 {width: 4.1%; float: left;}
.timeskale24_13 {width: 4.1%; float: left;}
.timeskale24_14 {width: 4.1%; float: left;}
.timeskale24_15 {width: 4.1%; float: left;}
.timeskale24_16 {width: 4.1%; float: left;}
.timeskale24_17 {width: 4.1%; float: left;}
.timeskale24_18 {width: 4.1%; float: left;}
.timeskale24_19 {width: 4.1%; float: left;}
.timeskale24_20 {width: 4.1%; float: left;}
.timeskale24_21 {width: 4.1%; float: left;}
.timeskale24_22 {width: 4.1%; float: left;}
.timeskale24_23 {width: 4.1%; float: left;}
.timeskale24_24 {width: 3.96%; float: left;}


#stepinfo_1, #stepinfo_2, #stepinfo_3, #stepinfo_4, #stepinfo_5, #stepinfo_6, #stepinfo_7, #stepinfo_8, #stepinfo_9, #stepinfo_10, #stepinfo_11, #stepinfo_12 { position: fixed; top: 410px; left: 0%; z-index: 150; visibility: hidden;}
#stepinfo_1 li, #stepinfo_2 li, #stepinfo_3 li, #stepinfo_4 li, #stepinfo_5 li, #stepinfo_6 li, #stepinfo_7 li, #stepinfo_8 li, #stepinfo_9 li, #stepinfo_10 li, #stepinfo_11 li, #stepinfo_12 li { list-style-type: none; border-bottom: 1px solid #333; }


.form-group{  border: 0px solid black; padding: 10px; width: 100%; padding-top: 0px; padding-bottom: 0px; margin-bottom: 0px;}
#stundenzetteltag, #stundenzettelmonat, #stundenzetteljahr, #urlaubvontag, #urlaubvonmonat, #urlaubvonjahr, #urlaubbistag, #urlaubbismonat, #urlaubbisjahr { width: 31.9%; float: left;}

#krankpopvontag, #krankpopvonmonat, #krankpopvonjahr, #krankpopbistag, #krankpopbismonat, #krankpopbisjahr { width: 31.9%; float: left;}
.form50{ width: 43.8%; float: left; margin: 5px;}
.form30{ width: 31%; float: left; margin: 5px;}
.form10{ width: 10%; float: left; margin: 5px;}
.form15{ width: 15%; float: left; margin: 5px;}
.form30right{ width: 31%; float: right; margin: 5px;}
.labelleft {float: left; width: 30%;}

.textfeld {width: 90%;}
.textfeld10 {width: 14%; margin: 5px; float: left;}
.formlabel {width: 25%; float: left; margin-right: 15px;}
.formfeldfull { width: 67%; float: left;}
.popupcontentRestore {padding: 10px; background-color: #ddd; color: black; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; height: 160px;}
#popupgetProjektnummer { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 460px; height: 220px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1540;}
.schnellzugriff {visibility: hidden; height: 1px; overflow: hidden;}
.buttontop { width: 50%; float: left;}
.stundenzeiten { border: 1px solid #666;}











@media screen and (max-width: 599px) {
      #popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 90%; height: 270px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
      #popupboxRegister { position: fixed; top: 0px; left: 50%; transform: translateX(-50%);  width: 100%; height: 515px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000;  visibility: hidden; z-index: 250;  }
      #popupboxPWRestore  { position: absolute; top: 20%; left: 50%; transform: translate(-50%);   width: 90%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
      #popupUrlaubseingabe  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 90%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
      #showJahreskalender {visibility: hidden;}
      .popupcontent { text-align: center; width: 100%; height: 475px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 2px; color: #333;}
      .myhead{  position: relative; width: 100%; text-align: center; border-top: 1px solid red; margin-left: 0px; }
      .footer { visibility: hidden;}
      .zeile240_1 {background-color: #fefefe; min-height: 20px; padding: 5px; box-shadow: 2px 2px 2px #666;}
      .zeile240_2 {background-color: #ececec; min-height: 20px; padding: 5px; box-shadow: 2px 2px 2px #666;}

      #popupboxLogin { top: 100px;  width: 300px !important;        height: 205px;    }
      #stundenzetteltag, #stundenzettelmonat, #stundenzetteljahr, #urlaubvontag, #urlaubvonmonat, #urlaubvonjahr { width: 30.1%; float: left;}
      #krankpopvontag, #krankpopvonmonat, #krankpopvonjahr, #krankpopbistag, #krankpopbismonat, #krankpopbisjahr { width: 30.1%; float: left;}
      #popupgetProjektnummer { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 330px; height: 220px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1540;}
      .popupcontentProjekt {width: 330px;}
      .schnellzugriff {visibility: visible;; height: auto; overflow: hidden;}
      .buttontop { width: 50%; float: left;}
      #popupboxLogin {  width: 300px !important;        height: 155px;   }
      .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
      .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 90%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
      }

@media only screen and (min-width:600px){
      #popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 70%; height: 270px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
      #popupboxRegister { position: fixed; top: 0px; left: 50%; transform: translateX(-50%);  width: 90%; height: 515px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000;  visibility: hidden; z-index: 250;  }
      #popupboxPWRestore  { position: absolute; top: 20%; left: 50%; transform: translate(-50%);   width: 70%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
      #popupUrlaubseingabe  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 70%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
      #showJahreskalender {visibility: hidden;}
      .popupcontent { text-align: center; width: 100%; height: 475px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}
      .myhead{  position: relative; width: 100vw; text-align: center; border-top: 1px solid red; margin-left: 10px; clear: both;}

      #stundenzetteltag, #stundenzettelmonat, #stundenzetteljahr, #urlaubvontag,, #urlaubvonmonat, #urlaubvonjahr { width: 30.1%; float: left;}
      #krankpopvontag, #krankpopvonmonat, #krankpopvonjahr, #krankpopbistag, #krankpopbismonat, #krankpopbisjahr { width: 30.1%; float: left;}
      .schnellzugriff {visibility: visible;; height: auto; overflow: hidden;}
      .buttontop { width: 50%; float: left;}
      #popupboxLogin {  width: 300px !important;        height: 155px;   }
      .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
      .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 100%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
}
@media screen and (min-width: 1024px) {
      #popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 50%; height: 270px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
  #popupboxRegister { position: fixed; top: 0px; left: 50%; transform: translateX(-50%);  width: 60%;  height: 885px;  overflow: auto; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000;  visibility: hidden; z-index: 250;  }
  #popupboxPWRestore  { position: absolute; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
  #popupUrlaubseingabe  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 50%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
  #popupDeleteUrlaub  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 145px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 54;}
  #popupDeleteZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 50%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1540;}

  #popupUngueltigZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 50%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
  #popupFahrerStundenKorrektur { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 50%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1542;}
  #popupFahrerStundenAbzug { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 50%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1543;}
  #showJahreskalender {visibility: visible;}
  .popupcontent { text-align: center; width: 100%; height: 835px; background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333;}

    .myhead{  position: absolute; right: 20px; top: 0px; width: 300px; text-align: right;}
    .schnellzugriff {visibility: hidden;; height: auto; overflow: hidden;}
    #popupboxLogin {  width: 300px !important;        height: 155px;   }
    .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
    .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 48%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
    h2 {font-size: 13pt;}

}

@media only screen
   and (min-width : 1440px) {
         #popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 30%; height: 270px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
         #popupUrlaubseingabe  { position: fixed; top: 20%; left: 50%; transform: translate(-50%);   width: 30%; height: 205px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 51;}
         #popupDeleteZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 30%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1540;}
         #popupUngueltigZeiterfassung { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 30%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
         #popupFahrerStundenKorrektur { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 30%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1542;}
         #popupFahrerStundenAbzug { position: fixed; top: 30%; left: 50%; transform: translateX(-50%);  width: 30%; height: 120px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1543;}
         #showJahreskalender {visibility: visible;}
         .myhead{ position: absolute; top: 0px; right: 20px; width: 300px; text-align: right; border-top: 1px solid red; margin-left: 10px; }
       #popupboxLogin {  width: 300px !important;        height: 155px;   }
       .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
      .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 31%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
      h2 {font-size: 13pt;}


}
@media screen and (min-width: 1920px) {
    #popupboxLogin {  margin-top -280px;   }
    #popupChangeTeam { position: fixed; top: 15%; left: 50%; transform: translateX(-50%);  width: 30%; height: 270px; background-color: #333; color: #eee;border-radius: 10px; padding: 0px; box-shadow: 5px 15px 20px -10px #000; visibility: hidden; z-index: 1541;}
    #popupboxLogin {  width: 300px !important;        height: 155px;   }
    .myhead{ position: absolute; top: 0px; right: 20px; width: 300px; text-align: right; border-top: 1px solid red; margin-left: 10px; }
    .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
    .myhead{  position: absolute; right: 20px; top: 0px; width: 300px; text-align: right;}
    .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 23%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
    h2 {font-size: 15pt;}

}


@media only screen
   and (min-width : 2560px) {
      .form-group{  border: 0px solid black; padding: 10px; padding-top: 0px; padding-bottom: 0px; margin-bottom: 0px; margin: 0px auto;}
      #stundenzetteltag, #stundenzettelmonat, #stundenzetteljahr, #urlaubvontag,, #urlaubvonmonat, , #urlaubvonjahr { width: 32.1%; float: left;}
      #krankpopvontag, #krankpopvonmonat, #krankpopvonjahr, #krankpopbistag, #krankpopbismonat, #krankpopbisjahr { width: 32.5%; float: left;}
      .form50{ width: 47.6%; float: left;}
      .BoxWidthCircle {box-shadow: 2px 2px 2px #333; width: 19%; border: 1px solid #CCC; text-align: center; color: red; padding: 10px; margin-top: 10px; float: left; margin-left: 10px;}
      #popupboxLogin {  width: 300px !important;        height: 155px;   }
      .popupcontentLogin { text-align: center; width: 300px !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}
}

.popupcontentLogin { text-align: center; width: 300px; !important;  background-color: #ddd; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; padding: 5px; color: #333; height: 120px!important;}