/*****************************/
/*** GrundTemplate         ***/
/*****************************/


html, body {
	height: 96%;
}

a:link, a:visited {
	text-decoration: none;
	font-weight: normal;
	color: #000000;
}

a:hover {
	text-decoration: underline;
	font-weight: bold;
	color: #000000;
}


body 	{
	margin:0px;
	padding:0px;
	text-align: left;
	font-size: 8px;
	font-family: verdana, arial, sans-serif;
	background: none repeat scroll 0 0 #F2F2F2;
	color: #000000;
}


input{
	cursor:pointer;
	padding: 2px;
	font-size: 11px;
	border-radius:3px;
	background: #EBEBEB;
	border: 1px solid #A1A1A1;
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #BFBFBF;
	-moz-box-shadow: 0px 3px 0px #BFBFBF;
	box-shadow: 3px 3px 6px #BFBFBF;
}


select{
	border: 1px solid #A4A4A4;
	cursor:pointer;
	padding: 2px;
	font-size: 11px;
	border-radius:3px;
	background:#d8d8d8;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 6px #aaaaaa;
}

input[type="checkbox"] {
	width: 50px !important;
	background: #d8d8d8;
	border: 1px solid #A4A4A4;
	cursor:pointer;
	padding: 2px;
	
	border-radius:3px;
	background:#d8d8d8;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 6px #aaaaaa;
}

input[type="checkbox"]::before {
  width: 15px;
  height: 15px;
  border-radius: 5px;
  border: 2px solid #8cad2d;
  background-color: #fff;
  display: block;
  content: "";
  float: left;
  margin-right: 5px;
}

input[type="checkbox"]:checked::before {
  box-shadow: inset 0px 0px 0px 3px #fff;
  background-color: #8cad2d;
}

input[type="button"] {
	padding: 5px;
}

input[type="submit"] {
	padding: 5px;
}

img{
	cursor:pointer;
}


#loading	{
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 99;
}

#login_div{ 
position: relative;
width: 240px;
height: 125px;
margin: 0 auto;
top: 100px;

	padding: 2px;
	
	border-radius:3px;
	background: #EBEBEB;
	border: 1px solid #A1A1A1;
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #BFBFBF;
	-moz-box-shadow: 0px 3px 0px #BFBFBF;
	box-shadow: 3px 3px 6px #BFBFBF;
}

.icon{
	width: 50px;
	border: 0;
	background: transparent;
}

.icon_d{
	width: 50px;
	border: 0;
	background: transparent;
	
	-webkit-box-shadow: 0px 3px 0px red;
	-moz-box-shadow: 0px 3px 0px red;
	box-shadow: 3px 3px 6px red;
}

.icon_sm{
	position: relative;
	top: 7px;
	width: 25px;
}

.icon_sm{
	position: relative;
	top: 7px;
	width: 20px;
}

textarea{
	width: 40%;
	cursor:pointer;
	border: 1px solid #A4A4A4;
	padding: 2px;
	font-size: 11px;
	border-radius:3px;
	background:#d8d8d8;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 6px #aaaaaa;
}

/*****************************/

#cminfo	{
	position: relative;
	margin: auto;
	height: 40px;
	width: 500px;
	overflow-y: scroll;
}

/*****************************/

#logo	{
	position: absolute;
	top: 0px;
	left: 0px;
	height: 50px;
	width: 50px;
}

/*****************************/

#f_menu	{
	position: absolute;
	top: 0px;
	left: 25px;
	height: 25px;
	width: 25px;
}

/*****************************/

#kopf	{
	position: absolute;
	top: 0px;
	left: 45px;
	right: 1px;
	height: 45px;
	width: auto;
	padding-top: 5px;
	padding-left: 5px;
	font-size: 30px;
}

/*****************************/

#message	{
	position: absolute;
	top: 10px;
	left: 700px;
	right: 400px;
	height: 30px;
	width: auto;
	padding-top: 5px;
	padding-left: 5px;
	font-size: 12px;
	color: red;
	font-weight: bold;

}

/*****************************/
#menu	{
	position: absolute;
	top: 50px;
	left: 0px;
	bottom: 1px;
	height: auto;
	width: 40px;
	padding-top: 5px;
	padding-left: 0px;
}

#menu ul{
padding:0px;
}

#menu li{
padding-bottom: 15px;
display: block;
}

/*****************************/

#main	{
	position: absolute;
	top: 45px;
	left: 45px;
	right: 1px;
	height: auto;
	min-height: 94%;
	width: auto;
	border: 0px solid black;	
	text-align: center;
}

/*****************************/

#msg	{
	position: absolute;
	top: auto;
	left: 300px;
	bottom: 1px;
	right: 300px;
	height: 20px;
	width: auto;
	min-width: 250px;
	border: 1px dotted red;
	
	font-size: 14px;
	text-align: center;
}

#dl{
	text-align: left !important;
	font-size: 8px;
}

#dr{
	text-align: right;
	font-size: 8px;
}

#worktime {
	position: absolute;
	top: 3px;
	width: 150px;
	right: 310px;
	height: 20px;
	font-size: 10px;
}

#worktime1 {
	position: absolute;
	top: -10px;
	width: 30px;
	right: 450px;
	height: 20px;
}


#masterdiv	{
	position: relative;
	top: 12px;
	left: 20px;
	right: 20px;
	width: 97%;
	height: auto;
	min-height: 700px;
	bottom: 10px;
	overflow: scroll;
	border: 1px solid darkgray;
	
	padding: 2px;
	padding-left: 5px;
	
	border-radius:5px;
	background:#F2F2F2;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 10px #aaaaaa;
}

#stat_tab{
	text-align: center;
	width: 100%;
	font-size: 8px;
	color: gray;
	border-collapse: collapse;
}

#stat_tab th{
	font-weight: bold;	
}

#stammtab{
	font-size: 9px;	
	border-collapse: collapse;
}

#stammtab tr:hover{
	background: none repeat scroll 0 0 #aaaaaa;
	cursor: pointer;
}

#gg_kopf{
	font-size: 12px;
	text-align: center;
	order: 0;
	flex-basis: 100%;
	min-height: 150px;
}


#st_ein_a1{
	font-size: 12px;
	text-align: center;
	order: 0;
	flex-basis: 100%;
	min-height: 525px;
}


#st_ein_b1{
	font-size: 12px;
	text-align: center;
	order: 1;
	flex-basis: 8%;
	flex-shrink: 0;
}
#st_ein_b2{
	font-size: 12px;
	text-align: center;
	order: 2;
	flex-basis: 100%;
	min-height: 525px;
}
#st_ein_b3{
	font-size: 12px;
	text-align: center;
	order: 1;
	flex-basis: 100%;
	min-height: 525px;
}
#st_ein_b4{
	font-size: 12px;
	text-align: center;
	order: 4;
	flex-basis: 20%;
	flex-shrink: 0;
}

#mat_bo	{
	border: 1px solid darkgray;
}

#editdiv	{
	position: absolute;
	top: -7px;
	left: -7px;
	right: -5px;
	min-height: 900px;
	bottom: 0px;
	overflow-x: scroll;
	overflow: auto;
	padding: 3px;
	margin: 6px 6px 6px;
	border: 1px solid #848484;

	
	border-radius:5px;
	background:#F2F2F2;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 10px #aaaaaa;
}

#editdiv table{
	width: 100%;
}

#editdiv td{
	text-align: right;
	font-size: 10px;
}

#editdiv th{
	text-align: left;
	font-size: 10px;
}

#editdiv input{
	width: 250px;
}

#editdiv select{
	width: 480px;
}

#mengendiv	{
	position: absolute;
	top: 0px;
	left: 20px;
	right: 20px;
	bottom: 50px;
	border: 2px solid red;
	background-color: lightgray;
	overflow-x: scroll;
}

#mengendiv table{
	width: 100%;
}

#mengendiv td{
	text-align: right;
	font-size: 10px;
}

#mengendiv th{
	text-align: left;
	font-size: 10px;
}

#mengendiv input{
	width: 250px;
}

#mengendiv select{
	width: 480px;
}


#E_duesenwechsel {
	width: 250px !important;
}

#E_customMaterialMenge1 {
	width: 50px !important;
}
#E_customMaterialMenge2 {
	width: 50px !important;
}
#E_customMaterialMenge3 {
	width: 50px !important;
}

#E_customMaterialKommentar1 {
	width: 480px !important;
}
#E_customMaterialKommentar2 {
	width: 480px !important;
}
#E_customMaterialKommentar3 {
	width: 480px !important;
}

#R_duesenwechsel {
	width: 250px !important;
}

#R_customMaterialMenge1 {
	width: 50px !important;
}
#R_customMaterialMenge2 {
	width: 50px !important;
}
#R_customMaterialMenge3 {
	width: 50px !important;
}

#R_customMaterialKommentar1 {
	width: 480px !important;
}
#R_customMaterialKommentar2 {
	width: 480px !important;
}
#R_customMaterialKommentar3 {
	width: 480px !important;
}

#scustomMaterialMenge1 {
	width: 50px !important;
}
#scustomMaterialMenge2 {
	width: 50px !important;
}
#scustomMaterialMenge3 {
	width: 50px !important;
}

#scustomMaterialKommentar1 {
	width: 480px !important;
}
#scustomMaterialKommentar2 {
	width: 480px !important;
}
#scustomMaterialKommentar3 {
	width: 480px !important;
}
#sduesenwechsel {
	width: 250px !important;
}

#materialdiv {
	position: relative;
	top: 20px;
	left: 20px;
	right: 20px;
	height: 500px;
	width: 45%;
	border: 1px solid black;
	font-size: 8px;
	overflow-x: scroll;
	order: 2;
}

#mTab{
	width: 100%;
	font-size: 7px;
	border: 0px solid gray;
	border-collapse: collapse;
}

#mTab th{
	font-size: 8px;
	border: 1px solid gray;
	text-align: center;
	font-weight: bold;
	color: black;
}

#mTab td{
	font-size: 7px;
	border: 1px solid gray;
	text-align: center;
	color: black;
}


#importdiv	{
	position: relative;
	left: 20px;
	right: 20px;
	top: 15px;
	height: 400px;
	width: 97%;
	font-size: 8px;
	border: 1px solid gray;
}

#stddiv	{
	position: relative;
	left: 20px;
	right: 20px;
	top: 15px;
	height: 400px;
	width: 97%;
	font-size: 8px;
	border: 1px solid gray;
}

#filterdiv	{
	position: relative;
	left: 20px;
	right: 20px;
	top: 15px;
	height: 47px;
	width: 97%;
	font-size: 8px;
	border: 1px solid darkgray;
	
	padding: 2px;
	
	border-radius:5px;
	background:#F2F2F2;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 10px #aaaaaa;
}

#filterdiv input {
        width: 60px;
}

#s_typ {
        width: 120px !important;
}

#s_serie {
        width: 100px !important;
}

#s_mat1 {
        width: 100px !important;
}

#s_mat2 {
        width: 100px !important;
}

#dup {
    width: 20px !important;
}

#MC {
    width: 20px !important;
}

#TC {
    width: 20px !important;
}

#MC1 {
    width: 20px !important;
}

#TC1 {
    width: 20px !important;
}

#s_vollJA {
    width: 20px !important;
}

#s_vollNEIN { 
    width: 20px !important;
}

#s_vollUPDATE { 
    width: 20px !important;
}


#filterdiv td {
text-align: center;
font-size: 10px;
}

#filterdiv label {
	font-size: 8px;
}

#progress_bar	{
	position: absolute;
	top: 5px;
	left: 5px;
	height: 3px;
	width: 99%;
	border: 1px dotted black;
	background-color: gray;
}

#my_progress	{
	width: 1%;
	height: 3px; 
	background-color: #81f781;

}

#exporttab {
	font-size: 8px;
	text-align: center;
	border: 1px dotted black;
	width: 95%;
}
#worktab {
	font-size: 8px;
	text-align: center;
}
#ajax_kal{
	position: absolute;
	right: 10px;
	top: 19px;
	border: 0px solid black;
	width: 300px;
	height: 30px;
	font-size: 14px;
	text-align: right;
}

#ajax_kal1{
	position: absolute;
	right: 0px;
	top: 49px;
	border: 0px solid black;
	width: 224px;
	height: auto;
	min-height: auto;
	background: none repeat scroll 0 0 #F2F2F2;
	z-index: 20;
}

#st_kopf{
	height: 25px;
	font-size: 20px;
	text-align: center;
}
#st_wartungen{
	position: relative;
	font-size: 12px;
	text-align: center;
	order: 1;
	flex-basis: 49%;
}

#bildersuche{
	position: relative;
	font-size: 12px;
	text-align: center;
	order: 3;
	flex-basis: 49%;
}

#bildersuche_sub{
	position: relative;
	font-size: 10px;
	text-align: center;
}

#bilderupload{
	position: relative;
	font-size: 12px;
	text-align: center;
	order: 2;
	flex-basis: 49%;
}

#showPic{
	position: absolute;
	font-size: 12px;
	top: 50px;
	right: 50px;
	left: 50px;
	bottom: 50px;
	width: auto;
	height: auto;
	border: 0px solid black;
	z-index: 99;
}

#showPicBig {
	position: relative;
	height: 80%;
	border: 0px solid black;
}

#msg_st_wart{
	position: absolute;
	top: 28px;
	right: 1px;
	left: 1px;
	width: auto;
	height: 20px;
	font-size: 12px;
	color: red;
	text-align: center;
	border: 0px solid black;
}

#st_kunden{
	font-size: 14px;
	text-align: center;
	order: 2;
	flex-basis: 23%;
}
#st_kunden td{
	font-size: 10px;
}
#st_kunden th{
	text-align: left;
	font-size: 12px;
}
#msg_st_kd{
	position: relative;
	right: 1px;
	left: 1px;
	width: auto;
	height: auto;
	min-height: 25px;
	font-size: 10px;
	text-align: left;
	border: 0px solid black;
}
#st_kunden input{
	background: #ededed;
	border: 1px solid #f2f2f2;
	width: 200px;
}

#st_kunden tr:hover{
	background: none repeat scroll 0 0 #aaaaaa;
}


#st_kalender{
	font-size: 14px;
	text-align: left;
	order: 4;
	flex-basis: 15%;
	height: auto;
}

#st_kalender p{
	font-size: 10px;
}

#st_todo{
	font-size: 14px;
	text-align: center;
	order: 3;
	flex-basis: 18%;
}

#st_todo td{
	font-size: 10px;
}
#st_todo th{
	text-align: left;
	font-size: 12px;
}

#st_todo tr:hover{
	background: none repeat scroll 0 0 #aaaaaa;
}
.button-3d{
	overflow: auto;
	padding: 3px;
	margin: 6px 6px 6px;
	border: 1px solid darkgray;

	
	border-radius:5px;
	background:#F2F2F2;		
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	transition: all 0.1s;

	-webkit-box-shadow: 0px 3px 0px #d8d8d8;
	-moz-box-shadow: 0px 3px 0px #D8D8D8;
	box-shadow: 3px 3px 10px #aaaaaa;
}

.todo_and {
	opacity: 0.90;
	position: fixed;
	top: 100px;
	left: 100px;
	height: 400px;
	width: 500px;
	background: lightgray;
	border: 2px solid black;
}

.todo_and table{
	width: 100%;
}
.todo_and td {
	border: 0px solid black;
	text-align: center;
	font-size: 10px;
	color: black;
}

.todo_and fieldset {
	border: 0px solid black;
}

.flex_container_hor {
	display: flex;
	flex-direction: column;
	flex-basis: 50%;
}

.flex_container_vert {
	display: flex;
	flex-direction: row;
	flex-basis: 50%;
}

#kd_kontakt_kopf{
	font-size: 14px;
	font-weight: bold;
}
#kd_kontakt_kopf table{
	width: 100%;
}
#kd_kontakt_kopf td{
	text-align: center;

}

#kd_kontakt{
	font-size: 14px;
	text-align: left;
	flex-basis: 45%;
}

#kd_kontakt table{
	width: 100%;
}

#kd_kontakt td{
	font-size: 12px;
	padding: 2px;
}

#kd_kontakt_knopf{
	font-size: 14px;
	text-align: left;
	flex-basis: 10%;
}

#kd_kontakt_messorte{
	font-size: 14px;
	text-align: left;
}

#kd_kontakt_messorte td{
	font-size: 12px;
}

#KD_and{
	opacity: 0.90;
	position: fixed;
	top: 100px;
	left: 100px;
	min-height: 400px;
	width: 80%;
	font-size: 14px;
}

#KD_and table{
	width: 100%;
}
#KD_and td {
	font-size: 10px;
	color: black;
}

#mo_kontakt_kopf{
	font-size: 14px;
	font-weight: bold;	
}

#mo_kontakt_kd td{
	font-size: 12px;
	font-weight: bold;
	width: 33%;
}

#mo_kontakt_kd{
	font-size: 12px;
	text-align: left;
}

#std_liste th{
	font-size: 8px;
	font-weight: bold;
}

#std_liste td{
	font-size: 8px;
	border-right: 1px solid #000000;
}

#st_liste{
	font-size: 8px;
	text-align: left;
}



#tab_verschieben{
	opacity: 0.90;
	position: fixed;
	top: 100px;
	left: 100px;
	min-height: 400px;
	width: 80%;
	font-size: 14px;
	z-index: 1;
}

#tab_verschieben table{
	width: 100%;
}
#tab_verschieben td{
	font-size: 10px;
	color: black;
}

 /* Style the tab */
.sage_tabs {
  overflow: hidden;
  border: 1px solid #ccc;
  background-color: #f1f1f1;
}

/* Style the buttons that are used to open the tab content */
.sage_tabs button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  border-radius:3px;
}

/* Change background color of buttons on hover */
.sage_tabs button:hover {
  background-color: #ddd;
}

/* Create an active/current tablink class */
.sage_tabs button.active {
  background-color: #ccc;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  border: 1px solid #ccc;
  border-top: none;
} 

.dvgw {
  display: none;
  color: #a1a1a1;
}