html, body {height 100%;}
body {cursor: default; font-family: Arial; font-size: 90%;}
body.special {   
	background: #000
    url(../../graphics/vb.gif)
    no-repeat
    35% 220px
    fixed;
}
/* 

*/
a { text-decoration:none; font-weight:bold; color: #BD2C16; cursor: pointer;}
a.glossar { color:#000; font-weight:normal;}
a:hover {color: #838383;}
a.sub {font-size: 80%;}
a.search {font-weight:normal; font-size: 80%;} 

img {border-style: none;}

h1 {margin: 0px; padding: 0px; font-size: 150%; line-height: 125%;}
h2 {margin: 0px; padding: 0px; font-size: 120%; line-height: 125%;}
p {margin: 0px; padding: 20px 50px 0px 0px; font-size: 80%; line-height: 125%;}

li.details, p.detailsHead {padding: 0px; cursor: pointer; }
li.details {font-size: 100%;}
p.detailsHead {font-size: 120%; font-weight:bold; width: 95%; text-align: center; }

p.login, p.search {padding: 2px; }
p.error {padding: 2px; border: 3px groove #F00; font-size: 120%; line-height: 125%;}
p.radio, p.del, p.tip {padding: 0px; margin:0px; }
p.del {font-size: 90%; text-align: center;}
p.tip {white-space:nowrap; }

p.table {margin: 0px; padding: 0px; font-size: 80%; width: 100%; }
p.botton {vertical-align: bottom; }

span {font-size: 100%;}
.gr {font-size: 120%;}
.ab, .ob, .todo {padding: 0px;}
.ab, span.fn {font-size: 95%;}
.ob {font-size: 85%;}
span.todo, span.ub,  span.cal, span.reload, .submenu, span.lohn, span.abg, span.kl, spam.ks {font-size: 75%;}
.ob, .ab, span.ak, span.error, span.date, span.tip, span.lohn, span.abg {font-weight:bold;}
span.date, span.reload { padding-bottom: 10px;}
span.artikel { vertical-align: bottom;}
.ab, span.error, span.date, span.stcklDetail, span.lohn {color: #BD2C16;}
span.de, span.ak, span.ub {
	width: 150px;
	padding: 0px 2px 0px 2px;
	text-align: center;
}

.stcklDetail {}

span.stcklDetail_Green {color: #2aaa01; font-weight: bold;} /* Added By Reda */
.stcklDetail_Green {} 										/* Added By Reda */

span.stcklDetail_Red {color: #fe0f08; font-weight: bold;}   /* Added By Reda */
.stcklDetail_Red {} 										/* Added By Reda */

span.ks {font-style:italic;}
/* span.ab { padding: 4px;} */
span.ub { padding: 2px;}
span.lit {padding: 0px;}
span.lit {margin:0px;}
span.ak, span.abg, span.ub,
span.de:hover ,span.ak:hover {background-color: #ccf;}
span.cal {white-space:nowrap;}
span.clred {color: #F66;}
spam.ub, span.mg { border-bottom: 3px groove #ccf;}
span.reload { border: none;}

span.greenpx, span.greypx, span.darggreypx, span.yellowpx {width: 25%;}
span.greenpxx, span.greypxx, span.darggreypxx, span.yellowpxx {
		width: 100% !important;
		height: 100% !important;
		text-align: right; 
		font-size: 80%; 
}

span.search{ 
	position: absolute; 
	width: 100%;
}
span.pointer {text-decoration:underline;}
span.holiday, span.pointer{cursor: pointer;}

.redF {background-color: #FFF; color: #F66; font-size: 150%; border: 3px groove #ccf; font-weight:bold;}

ul { margin: 4px 0px 4px 18px; padding: 0px; list-style-image: url(../img/next.gif); }
li { margin: 0px 0px 2px 0px; padding: 0px; font-size: 80%; line-height: 125%; }
li.ob {padding: 2px; font-size: 120%; }
li.ub {font-size: 100%; }

.todo {font-size: 90%;}

/*
    tables
*/
table {border-collapse: collapse;}
table.kl {width: 800px;}
table.noborder {padding: 0px;}
table.projekt {background-color:#fdfdcb;}
table.newEntry, table.detailRech, table.newDay, table.projekt, table.todo  {width: 100%;}
table.workingTime {width: 90%;}
table.liste {font-size: 90%; }
table.newDay td, table.newDay th {border: none;}
table.search { z-index: 10; position:relative;}
td, th {
	border: 1px solid #000000;
	padding: 3px; 
	text-align: center; 
	font-size: 80%; 
}
td {background-color: #fff; vertical-align: top;}
 th {background-color: #ccf;} 
/* th {background-color: #04509b;} */
td.right, .nowrap, td.nowb, td.nowbl, th.check {white-space:nowrap; }

/*  borders */
td.underline, td.r_u_line, td.l_u_line {
	border-bottom: 1px solid #000;	
}

/* td th tr */
td.rest {width: 50%;}
tr.dn { visibility: collapse;}
tr.dnIE { display: none;}


th.nb {border:none; vertical-align: top;} 

/* 
	Planing Table 
*/
td.kl,td.kls,
td.klsbridgrey,td.klshaygrey  {height: 1px; font-size: 60%; padding: 0px; text-align: center;}

th.cal, td.five	{width: 50px;}
th.check 	{width: 100px;}
td.noface, td.redR {color: #fff;}

td.left, th.left, td.noborder, .aleft , .leftnob, td.bl, td.br, td.blr, td.l_u_line
 	{text-align: left;}
td.right, th.right, td.bgr, td.bgrr, td.rightnlb, .rightnob, td.bggrey, td.bgwhite, td.rbggreen, td.redR,
td.nbgreen, td.nbgrey, td.nbwhite, .aright, td.r_u_line, th.right
	{text-align: right;}
td.center, td.nowb, td.nopad  
	{text-align: center;}
td.aleft, td.under  
	{vertical-align: bottom; }
tr.top 
	{vertical-align: top;}

td.noborder, td.under, td.nowb, td.kstW, td.kstR, .rightnob, td.noface, .todo, .leftnob,
td.nbgreen, td.nbgrey, td.nbwhite
	{border:none;}
td.bl		 	{border-left:1px solid #000;}
td.br, td.blr 	{border-right:1px solid #000;}
td.nowbl 		{border-right: none;}
td.rightnlb 	{border-left: none;}
td.bb			{border-right: none; border-left: none;}

td.rightnob ,td.leftnob {white-space: nowrap;}

td.bgr, td.bgrr {color: #BD2C16; font-weight:bold;}
td.nopad {padding: 0px;}

td.stckl1 {width: 30px;}


table.detailRech td {font-size: 80%;}

table.workingTime td, table.workingTime th {
	font-size: 110%;
	border: none;  
	vertical-align: middle;
} 


table.noborder td {border: none; font-size: 75%; vertical-align: middle;}
table.noborder th {border: none; text-align: left;}
table.noborder td.underline, table.noborder td.r_u_line, table.noborder td.l_u_line {border-bottom:1px solid #000;}
table.noborder td.r_u_line, table.noborder th.r, table.noborder td.right  {text-align: right;}
table.noborder td.l_u_line, table.noborder td.left {text-align: left; }



table.newEntry tr { vertical-align: top;}
table.newEntry td.nb { border: none;}
table.newEntry td.nb { border: none; padding: 0px 2px 0px 2px;}
table.newEntry td.nbh { border: none; height: 100%;}

table.newDay td.t,table.newDay td.te, table.newDay td.underline {text-align: right;}
table.newDay td.t,table.newDay td.te {width: 50px; white-space: nowrap;}
table.newDay td.te {background-color: #F00;}
table.newDay td.underline {border-bottom:1px solid #000;}

table.monat { font-size: 110%;}
table.monat th,td {background-color: #fff; text-align: left; padding: 3px;white-space:nowrap;}
table.monat th.r,td.r {text-align: right;}
table.monat td.cent {background-color: #ccf; text-align: center; font-size: 110%; font-weight:bold;}


/* background color for Projekt State */
.red, .black, .blue, .magenta, .klshaygrey { color: #FFF; }
.cBlack {color: #000;}

td.white, option.white, input.white, span.white, td.kstW, td.bgwhite, div.white {background-color: #fff;}

td.darkgrey, option.darkgrey, input.darkgrey, span.darkgrey, span.darggreypx, span.darggreypxx, div.darkgrey, .darkgrey {background-color: #808080;}
td.grey, td.bgrr, option.grey, input.grey, input.grey, input.station, span.grey, td.bggrey, td.nbgrey, div.grey, .grey  {background-color: #C0C0C0;}
td.bridgrey, td.bgr, option.bridgrey, input.bridgrey, span.bridgrey, td.klsbridgrey, td.title, 
		input.NewEntryButton, span.greypx, span.greypxx, div.bridgrey, .bridgrey, .reload {background-color: #F0F0F0;}
td.klshaygrey, div.klshaygrey, .klshaygrey {background-color: #6E6E6E;}
.lightgrey {background-color: #e0e0e0;}

/*td.red, option.red, input.red, span.red, td.kstR, td.redR, div.red, */ 
.red, td.kstR, td.redR {background-color: #F66;} 
.redlight {background-color: #F78181;}

td.blue, option.blue, input.blue, span.blue, div.blue, .blue {background-color: #03F; color: #F0F0F0;}
td.bluelight, option.bluelight, input.bluelight, span.bluelight, div.bluelight, .bluelight {background-color: #69F; }

td.yellow, option.yellow, input.yellow, span.yellow, span.yellowpx, div.yellow, .yellow {background-color: #FF6;}

td.green, option.green, input.green, td.klsgreen, span.green, span.greenpx, span.greenpxx, td.rbggreen, td.nbgreen, div.green, .green
	{background-color: #0F0;}
/* td.greenlight, option.greenlight, input.greenlight, span.greenlight, td.kslgreenlight, div.greenlight, .greenlight {background-color: #0F8;} */
td.greenlight, option.greenlight, input.greenlight, span.greenlight, td.kslgreenlight, div.greenlight, .greenlight {background-color: #DDFADA;} 

td.magenta, span.magenta { background-color: #F0F; }

td.black, option.black, .black {background-color: #404040;}
/* --- */
.greenToLight{
	background-image:
       repeating-linear-gradient(45deg, 
                                white 0%, 
                                white 2%, green 2%, 
                                green 4%, white 4%);
}
.blueToLight{
	background-image:
       repeating-linear-gradient(45deg, 
                                white 0%, 
                                white 2%, blue 2%, 
                                blue 4%, white 4%);
}

/* --- */
th.ksts { width:2000px; white-space:nowrap; }


/* aufklappmenu */
td.title{cursor:pointer; white-space:nowrap;}
tr.FF, tr.CR {visibility:collapse;}
tr.IE {display:none;}

/*
	form felder
*/
/* ---- */
input {border: 1px solid #ccc; padding: 0px; width: 100%; cursor: pointer; border-radius: 5px; transition: all 1s ease;}
input:focus { background: #69F; color:#FFF; border: 3px groove #0F0;}

input.submit, input.left, input.submitA {font-size: 75%; padding: 2px; background: #FFF; }

input.busy1 	{background: #008000;}
input.busy2,input.submitA 	{background: #FF0;}
input.busy3 	{background: #F00;}
input.weekend 	{background: #ccf; }
input.regholday, input.th {background: #cff; }
input.material, input.liquid 	{background: #FFF; }
input.rechnen 	{background: #C0C0C0;}

select.aus {}
input.special {
	font-family: Arial,sans-serif;
	color: #BF0000;
	font-size: 18px;
	border: none;
	background-color: #C0C0C0;
	height: 24px;
	width: 100%;
	padding: 0px 0px 0px 5px;	
}

input.NewEntryButton { height: 40px; font-size: 150%;}

input.tf { cursor: default;}

input.noborder, input.detail,
input.checkbox, input.radio,
input.station, input.material, 
input.liquid, button.monat		{ border:none;}
/* -- */
input.k, input.mat, input.detail {width: 20px;}
input.name, input.def30			{ width: 30px;}
input.menge, input.pn, input.y	{ width: 40px;}
input.def,input.button			{ width: 50px;}
input.def60, input.mid60,
input.rechnen					{ width: 60px;}
input.datum, 					
input.NewButton					{ width: 80px;}
input.bill						{ width: 90px;}
input.text, input.submitA		{ width: 100px;}
input.zusatz, input.buttonGr	{ width: 120px;}
input.noborder 					{ width: 150px;}
input.street 					{ width: 200px;}
select.artikel 					{ width: 250px;}
input.search 					{ width: 350px;}
select.order,input.order 		{ width: 450px;}

input.material 					{ width: 50%;}
input.eight 					{ width: 80%;}
input.hundert, input.time, 
input.stcklst,input.liquid,
input.station					{ width: 100%;}

input.holiday					{ width: 11px;}
/* -- */
input.text, input.time, input.name, button.monat {background: buttonface; }
/* -- */
input.k, input.menge, input.rechnen, input.pn, input.y, input.button,
input.street, input.search, input.hundert, input.left, input.eight,
input.station, input.material, input.liquid, input.baugroup   
	{ text-align: left;}
input.mat, input.bill, input.def, input.def60, input.zusatz, input.def30	
	{ text-align: right;}

input.radio {vertical-align: middle; }
/* -- */
input.menge, input.rechnen, input.zusatz, input.bill, input.def, input.def60
	{ padding: 1px;}   

/* -- */
input.checkbox, input.radio 	{ font-size: 120%; width: 10%; }
input.noi						{ width: 0px; display:none}
input.station, input.stcklst	{color: #BD2C16; font-weight:bold; }
input.material,input.liquid		{padding: 0px;}

input.liquid, input.material  { text-decoration:underline; }
input.baugroup { padding: 2px 2px 2px 30px;}
/* --- */
input.button {font-size:80%} 
button { cursor: pointer; }

button.button {padding:0px; width:30px; height: 30px;}
button.monat {
	width:100%; 
	padding: 0px; 
	background-color: #ccf; 
	text-align: center; 
	text-decoration:underline;
	font-weight:bold; 
}
button.login, button.logout, button.dash {
  border: none;
  color: white;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

button.login { padding: 15px 32px; }
button.logout, button.dash { padding: 5px; }

button.logout{ background-color: #F66; }
button.login { background-color: #008CBA; }
button.dash { background-color: #BDBDBD; }

select.datum {font-size: 50%; width:10px;height: 10px;}

textarea { border: 1px solid #ccc; font-size: 80%; padding: 0px; width: 500px; height: 300px; border-radius: 5px; transition: all 1s ease;}
textarea.Bkalk {width: 100%; height: 80px; overflow:hidden; font-size: 135%; line-height: 125%; padding: 1px;}

textarea.responder {font-size: 100%; padding: 1px; width: 100%;}
input:focus { background: #69F; color: #FFF; border: 3px groove #0F0;}
/*
    tooltip
*/
.prototip {position:absolute; background-color:#fdfdcb; border:1px solid #7d7d7d;}
.prototip .glossar{ width:320px; }
.prototip .glossar { padding:3px 5px;  }
.prototip .tip{ width: 450px; }