.antispam{	display: none;}

body {margin:0;padding: 18px 2% 0px 2%;font-family: 'Open Sans', sans-serif;font-size: 10pt;line-height: 12pt;	color: #404040; font-weight: normal;width: 96%;background-color:#ffffff; }
p {	font-size: 10pt;	color: #404040;	padding-bottom: 0pt;}

input, textarea{	font-size: 10pt;	color: #404040;}
input[type="submit"]{padding:2px 4px;border:solid 1px; #333333;margin-top:4px;border-radius:5px;font-size:9pt;}
input[type="submit"]:hover{background-color:#dddddd;}
/* STYLING ---------------------------*/ 
h1 {font-size: 10pt;	font-weight: bold;	line-height: 13pt;	color: #404040;	margin-top: 0;	padding-bottom:8px;}
	
h2{	font-size: 10pt;font-weight: bold;line-height: 15pt;color: #404040;}
h3 {}
h4 {font-size: 8pt;}
h5 {font-size: 10pt;color: #757c12;	font-weight: bold;}
blockquote {font-size: 1.2em; color:#909090;padding: 15px 10px 15px 50px;	background: url(../images/jv-quote.gif) no-repeat;}
hr {border-top: 1px solid #ccc; border-right: 0;	border-left: 0;	border-bottom: 0; height: 1px;}
	
.clr{clear:both;}



/* LINKS 
--------------------------------------*/ 
a:link, a:visited {	color:#404040; text-decoration:underline;}
a:hover {color:#306268; text-decoration:underline;}

div.buchstabe a{text-decoration:none;padding:4px;display:inline-block;margin:2px;border:solid 1px #cecece;border-radius:4px;background-color:#ffffff;}

a img { border:0px solid #FFFFFF;}
	
.j_button a{display:block;width: 200px;text-align:center;text-decoration:none;border: solid 1px #a0a8ad;padding:14px 4px;}

#navig1 ul{ margin:0; padding:0;}
#navig1 ul li{display:inline;padding-left:6px;padding-right:6px;border-left:solid 1px #a7a7a7;}

/* Positionen **/
#header{background-color:#4c80a5; padding:6px 2%;color:#ffffff;}
#logo{padding:6px 2%;border-top:solid 1px #cccccc;}
#logo img{width:100px!important;height:auto!important;}
#logo_wrap{float:left;}
#progname{float:left;font-weight:bold;}
#version{float:right;}

.inner_wrap{width:96%;margin:auto;min-height:80vh;}
.inner_wrap_center{width:96%;margin:auto;min-height:60vh;padding-top:20vh;text-align:center;}
.inner_wrap_center .j_button a{display:inline-block;}

.spalte1{position:relative;width:96%;float:left;padding:10px 2%;background-color:#efefef;margin-bottom:20px;}
.spalte2{width:96%;padding:10px 2%;background-color:#efefef;margin-left:2%;	margin-bottom:20px;}
.spalte3{width:96%;padding:10px 2%;	background-color:#efefef;margin-left:2%;margin-bottom:20px;}
.spalte4{position:relative;float:right;	padding:10px;background-color:#efefef;margin-left:30px;}
.feld4{	background-color:#efefef;padding:4px;height:auto;}
.feld_left{float:left;width:62%;}

.reiter{line-height:28px;float:left;}
.reiter a{	line-height:20px;	border-top:solid 1px #cccccc;	border-left:solid 1px #cccccc;	border-right:solid 1px #cccccc;	border-bottom:solid 1px #cccccc;	background-color:#eee;	text-decoration:none;padding:3px;margin-right:0px;margin-left:0px;border-top-left-radius:4px;border-top-right-radius:4px;}
.reiter a.active{border-bottom:solid 1px #fff;background-color:#fff;}

.reiter2 a{line-height:20px;border-top:solid 1px #cccccc;border-left:solid 1px #cccccc;border-right:solid 1px #cccccc;border-bottom:solid 1px #cccccc;background-color:#eee;text-decoration:none;	padding:2px;margin-right:0px;margin-left:0px;font-size:8pt;}
.reiter2 a.active{	border-bottom:solid 1px #fff;background-color:#fff;font-size:8pt;}

.u_reiter a{line-height:20px;border-top:solid 1px #cccccc;	border-left:solid 1px #cccccc;	border-right:solid 1px #cccccc;border-bottom:solid 1px #cccccc;background-color:#eee;text-decoration:none;	padding:3px;margin-right:0px;margin-left:0px;}
.u_reiter a.active{border-bottom:solid 1px #fff;background-color:#fff;}

.u_reiter2{line-height:26px;}
.u_reiter2 a{line-height:20px;border-top:solid 1px #cccccc;border-left:solid 1px #cccccc;border-right:solid 1px #cccccc;	border-bottom:solid 1px #cccccc;background-color:#eee;	text-decoration:none;	padding:2px;margin-right:0px;margin-left:0px;font-size:8pt;}
.u_reiter2 a.active{border-bottom:solid 1px #fff;background-color:#fff;font-size:8pt;}

div p{margin:0px;padding-top:3px;padding-bottom:3px;padding-left:0px;padding-right:0px;}

.r_artikel{	height:300px;overflow:auto;	font-size:8pt;}
.r_artikel input, .r_artikel textarea{font-size:8pt;padding:1px;margin:0;}

.ungerade{background-color:#eee;}
.gerade{background-color:#fff;}

.mahnung{width:3px;	background-color:red;border:solid 1px #fff;}
.offen{	width:3px;background-color:yellow;border:solid 1px #fff;}
.abgeschlossen{	width:3px;background-color:green;border:solid 1px #fff;}

.inner_bg{background-color:#efefef; padding:4px 8px;margin:10px 4px;border:solid 1px #cccccc;}
.inner{padding:4px 8px;margin:10px 4px;border:solid 1px #cccccc;}


.gridwrap-x {grid-gap: 2em; display: grid; grid-auto-flow: row; grid-template-columns: 1fr; margin: 0 0 1em; }
.gridwrap-4 {grid-gap: 2em; display: grid; grid-auto-flow: row; grid-template-columns: 1fr; margin: 0 0 1em; }
.gridwrap-4.bg-grey div{padding:10px;background-color:#eeeeee;border:solid 1px #cecece;border-radius:4px;}
.gridwrap-x div:hover{background-color:#eeeeee;}


/*Haupt - Navigation*/
a.btn_contact:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f2bb';}
a.btn_invoice:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f2b6';}
a.btn_car:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f1b9';}
a.btn_calendar:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f073';}
a.btn_service:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f0ad';}
a.btn_time:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f1da';}
a.btn_usersettings:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f0c0';}
a.btn_logout:before{font-family: FontAwesome;top: 0px;margin-bottom:8px;position: relative;text-align: center; color: #4c80a5;font-size:24px;display:block;content: '\f011';}


li a.contact:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f2bb';}
li a.invoice:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f2b6';}
li a.time:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f1da';}
li a.car:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f1b9';}
li a.calen:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f073';}
li a.service:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f0ad';}
li a.usersettings:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f0c0';font-weight:normal!important;}
li a.logout:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f011';}
li a.article:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f1b3';}
li a.home:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:24px;content: '\f015';}

body.con li a.contact{color:#4c80a5;font-weight:bold;}
body.us li a.usersettings{color:#4c80a5;font-weight:bold;}
body.inv li a.invoice{color:#4c80a5;font-weight:bold;}
body.tm li a.time{color:#4c80a5;font-weight:bold;}
body.invserv li a.car{color:#fb3099;font-weight:bold;}
body.cal li a.calen{color:#fb3099;font-weight:bold;}
body.service li a.service{color:#fb3099;font-weight:bold;}


/*Haupt-Navigation *********************************************/

#menu_top{ width:96%;border-bottom:solid 0px;padding:6px 2% 0 2%;}
/* Navigation */

/*Top 1. Ebene */

#menu_top a{text-decoration:none;}
#menu_top ul {margin:2px 0px;padding:0;border:solid 0px;position:relative;}
#menu_top ul li{display:inline;	position: relative;	padding:5px 10px;margin:0;border:solid 0px green;line-height:20px;float:left;}
#menu_top ul li a{}
#menu_top ul li:hover{background-color:#ddd;border-radius:4px;}

/*Top 2. Ebene */
#menu_top ul li ul { display:none;  position: absolute;  top: 14px;   left: -10px;  background-color:#ddd;  opacity:0.9;  margin:14px 0 0 10px;  padding:0;  }
#menu_top ul li:hover ul { display:block;  z-index:500;}
#menu_top ul li ul li{  display:block;  padding:5px 0px 5px 15px;  line-height:20px;  width:170px; }
#menu_top ul li ul li a{border-bottom: solid 0px #d4d2b9;font-size:13px;padding-top:0px;}#menu_top ul li ul li:hover{background-color:#eee;}

/*Top 3. Ebene */
#menu_top ul li:hover ul li ul{ display:none; position: absolute; top: 0em;  left: 4px; background-color:#eee; opacity:0.95;}
#menu_top ul li ul li:hover ul  { display:block; z-index:500;}
#menu_top ul li ul li ul{ margin:0 0 0 180px; padding:0; border:solid 0px;}
#menu_top ul li ul li ul li{padding-left:15px;}


/*Vorgangs-Navigation *********************************************/


#navig_vorgang{float:right; width:75%;}
#navig_vorgang a{text-decoration:none;}
#navig_vorgang ul {margin:0 0 0 20px;padding:0;border:solid 0px;position:relative;}
#navig_vorgang ul li{display:inline;position: relative;	padding:5px 10px;margin:0 2px;border-top:solid 1px #666;border-left:solid 1px #666;border-right:solid 1px #666;	border-bottom:solid 0px #666;	line-height:20px;float:left;background-color:#eee;}
#navig_vorgang ul li.erst a{color:#016D91;}
#navig_vorgang ul li.v_an,#navig_vorgang ul li.v_auf, #navig_vorgang ul li.v_liefer,#navig_vorgang ul li.v_gut,#navig_vorgang ul li.v_rech,#navig_vorgang ul li.v_ret{background-color:#fff;}
#navig_vorgang ul li a{}
#navig_vorgang ul li:hover{background-color:#ddd;}

/*Top 2. Ebene */
#navig_vorgang ul li ul { display:none;  position: absolute;  top: 16px;   left: -10px;  background-color:#ddd;  opacity:0.9;  margin:14px 0 0 9px;  padding:0;  }
#navig_vorgang ul li:hover ul { display:block; z-index:500;}
#navig_vorgang ul li ul li{ display:block; padding:5px 0px 5px 8px; line-height:20px; width:250px; border:none; background-color:none;  }
#navig_vorgang ul li ul li a{border-bottom: solid 0px #d4d2b9;font-size:13px;padding-top:0px;}
#navig_vorgang ul li ul li:hover{background-color:#eee;}

/*Top 3. Ebene */
#navig_vorgang ul li:hover ul li ul{ display:none; position: absolute; top: 0em;  left: 4px; background-color:#eee; opacity:0.95;}
#navig_vorgang ul li ul li:hover ul  { display:block; z-index:500;}
#navig_vorgang ul li ul li ul{ margin:0 0 0 180px; padding:0; border:solid 0px;}
#navig_vorgang ul li ul li ul li{padding-left:15px;}

#kundenfenster{clear:both;}
table{border-collapse:collapse;}
.tbl_border {margin:20px 0;border-top:solid 1px #333333;border-bottom:solid 1px #333333;padding-left:20px;}
.tbl_border td{padding:10px;border-bottom:solid 1px #cccccc;vertical-align:top;}
.tbl_border tr{}

a.neu, a.back, a.edit, a.vor, a.calvor,a.heute, a.del, a.lock, a.see, a.custumer, a.down, a.money, a.clock, a.calendar, a.forward, a.service{text-decoration:none;color:#4c80a5;margin:8px 0;}
a.neu:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f0fe';text-decoration:none;}
a.back:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f104';text-decoration:none;}
a.edit:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f044';text-decoration:none;}
a.vor:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f105';text-decoration:none;}
a.forward:after{font-family: FontAwesome;top: 3px;margin:0 4px 0 4px;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f105';text-decoration:none;}
a.calvor:after{font-family: FontAwesome;top: 3px;margin:0 0 0 4px;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f105';text-decoration:none;}
a.del:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f1f8';text-decoration:none;}
a.lock:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f023';text-decoration:none;}
a.see:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f06e';text-decoration:none;}
a.custumer:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f2c1';text-decoration:none;}
a.down:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f0d7';text-decoration:none;}
a.money:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f153';text-decoration:none;}
a.clock:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f1da';text-decoration:none;}
a.calendar:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f073';text-decoration:none;}
a.service:before{font-family: FontAwesome;top: 3px;margin:0 4px 0 0;position: relative;text-align: center; color: #4c80a5;font-size:20px;content: '\f0ad';text-decoration:none;}

.tbl_border td a.edit:before,.tbl_border td a.vor:before,.tbl_border td a.del:before,.tbl_border td a.lock:before{font-size:16px;top: 0px;}

a.btn_storno{text-decoration:none;display:inline-block;border:solid 1px #cccccc;padding:5px;background-color:#dddddd;}
span.storno{color:red;font-weight:bold;}

.leftmenu a{text-decoration:none;display:block;padding:4px;border-bottom:solid 1px #ccc;}
.leftmenu a:hover{background-color:#f0f0f0;}

table a{text-decoration:none!important;color:#4c80a5!important;font-weight:600;}
table td{padding:6px!important;}

.frame{border:solid 1px #cccccc;}
.frame-r{}
.col6{width:96%;padding:20px 2%;}
.col12{width:96%;padding:20px 2%;}
span.first{width:50%;display:inline-block;}

/* Kalender */

.tbcellhide_wrap{min-height:10px;position:relative}
.tbcellhide{display:none;}
.tbcellhide_wrap:hover .tbcellhide{display:block;position:absolute;width:200px;top:0;left:0;background-color:#ffffff;border:solid 1px #ccc;padding:10px;z-index:10;text-align:left;}

@media (min-width: 1024px) {
	.spalte1 {width: 46%;float: left;}
	.spalte2 {width:46%;float:left;padding-left:4%;}
	.feld_left{float:left;width:50%;}

	.col6{width:46%;padding:20px 2%;float:left;}
	.col-md-6{width:50%;float:left;}

	.gridwrap-2 {grid-gap: 2em 2%; display: grid; grid-auto-flow: row; grid-template-columns: 18% 80%; margin: 0 0 1em; }
	.gridwrap-3 {grid-gap: 2em; display: grid; grid-auto-flow: row; grid-template-columns: 1fr 1fr 1fr; margin: 0 0 1em; }
	.gridwrap-4 {grid-gap: 2em; display: grid; grid-auto-flow: row; grid-template-columns: 1fr 1fr 1fr 1fr; margin: 0 0 1em; }
	.gridwrap-x {grid-gap: 2em; display: grid; grid-auto-flow: row; grid-template-columns: 1fr 1fr 1fr 1fr; margin: 0 0 1em; }
}

@media (min-width: 1400px) {
	.spalte1 {width: 31%;float: left;}
	.spalte2 {width:31%;float:left;padding-left:2%;}
	.spalte3 {width:31%;float:left;padding-left:2%;}
	.feld_left{float:left;width:62%;}
	.feld_left .spalte2{float:left;width:62%;padding:4px 2%;margin-left:2%;}
	.feld_left .spalte3{float:left;width:26%;padding:4px 2%;margin-left:2%;}
	.gridwrap-2 {grid-gap: 2em 2%; display: grid; grid-auto-flow: row; grid-template-columns: 13% 85%; margin: 0 0 1em; }
	.col-lg-4{width:33.333%;float:left;}
	.col-lg-8{width:66.666%;float:left;}
	.col-lg-6{width:50%;float:left;}
	.col-lg-12{width:100%;float:none;clear:both;}
}