/* allgemein */
* {
	margin: 0px;
	padding: 0px;
	border: none;
	text-decoration: none;
	list-style: none;
	background: none;
}

button {
	cursor: pointer;
}

body {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: 12px;
}
body.development {
	background-image: url("../pics/test-bg.svg");
	background-color: #feb;
	background-size: contain;
}


h1, h3 {
	font-size: 15px;
	margin-top: 10px;
	margin-bottom: 5px;
}

h3 {
	margin-top: 0;
	margin-bottom: 10px;
}

h2 {
	color: black;
	font-size: 13px;
	font-weight: bold;
	margin-left: 10px;
	margin-top: 10px;
}

p{
	margin-bottom: 10px;
}

a{
	color: #D73233;
	padding-right: 8px;
}

.clear{
	clear: both;
}

.right{
	float:right;
}

.left{
	float:left;
}

/* main */
#container_main{
	position: relative;
	margin: auto;
	width: 100%;
	max-width: 1000px;
}

@media only screen and (max-width: 1000px) {
	#container_main {
		margin: 10px;
	}
}

#header {
	float:left;
	width: 100%;
	min-height: 38px;
	border-bottom: 1px #999 solid;
}

#header a{
	margin-top: 10px;
	margin-left: 0px;
	float:left;
}

#loader {
	float: left;
	margin-top: 5px;
}

#header .toolbar {
	float: right;
	margin-top: 5px;
	margin-right: 300px;
}
#header .toolbar a {
	margin: 0 5px;
}
#header .toolbar a[disabled] {
    cursor: not-allowed;
}
#header a#site_logo > img {
    max-width: 200px;
    max-height: 25px;
}

#logout{
	float: right;
	margin-top: 5px;
}

#logout a{
	margin: 0px;
}

/* login */
form#login{
	float:left;
	width: 100%;
	margin-top: 15px;
}

form#login label{
	display: block;
	font-weight: bold;
	margin-bottom: 1px;
}

form#login input{
	display: block;
	margin-bottom: 5px;
}

form#login input[type=submit]{
	padding: 1px;
	background: white;
	border: 1px solid #62BD2D;
	cursor: pointer;
}

/* overview */
table#overview_table{
	float:left;
	width: 100%;
	border-collapse: collapse;
}

table#overview_table td{
	padding: 5px;
	padding-left: 0px;
	padding-right: 0px;
	border-top: 1px dotted #333;
}

table#overview_table td.first_kunde{
	border-top: 2px solid #333;
}

table#overview_table tr{
	cursor: pointer;
}

table#overview_table tr:hover{
	background: #FAF5EC;
}

table#overview_table tr:active{
	background: #B9B9B9;
}

table#overview_table td.kunde{
	width: 200px;
	font-weight: bold;
}

table#overview_table td.stunden,
table#overview_table td.kosten{
	text-align: right;
}

table#overview_table td.datum{
	width: 150px;
}

table#overview_table a{
	color: #333;	
}

/* detail list table*/
table#detail_list_table{
	float:left;
	width: 100%;
	border-collapse: collapse;
	font-size: 11px;
}

table#detail_list_table th{
	text-align: left;
	font-weight: bold;
	padding-bottom: 10px;
	padding-top: 5px;
	padding-right: 10px;

}

table#detail_list_table td{
	border-top: 1px solid #333;
	padding: 5px;
	padding-left: 0px;
	padding-right: 10px;
	vertical-align: top;
}

table#detail_list_table td.visum,
table#detail_list_table th.visum{
	padding-right: 0px;	
}

table#detail_list_table tr.total_row td{
	border-top: 0px solid #333;
}

table#detail_list_table td.kosten{
	text-align: right;	
	padding-right: 0px;
}

table#detail_list_table th.kosten{
	width: 70px;
	text-align: right;	
	padding-right: 0px;
}

th.kunde{
	width: 100px;
}

th.projekt{
	width: 150px;
}

th.stunden{
	width: 60px;
}

table#detail_list_table .visum,
table#detail_list_table .ansatz{
	text-align: right;	
}

/* overview toolbar */
#container_toolbar{
	width: 100%;
	float:left;
	background: #333;
	margin-bottom: 30px;
	color: white;
}

#toolbar_admin{
	float:left;
	width: 300px;
}

#toolbar_admin select {
	margin: 4px;
	color: black !important;
}
#toolbar_user input {
	color: black !important;
}

#toolbar_admin select,
#stundenliste_header .top .right select{
	border: 1px solid #D73233;
	width: 80px;
	background: white;
}

#toolbar_admin select#overview_customer{
	border: 1px solid #62BD2D;
}

#toolbar_user{
	float:right;
	width: 450px;
}

#toolbar_user .left{
	margin-top: 5px;
}

#toolbar_user .right{
	margin-top: 3px;
	margin-right: 4px;
}

#container_toolbar button, 
#container_toolbar img{
	display: inline;
	float:left;
	margin: 1px;
	cursor: pointer;
}

input,
textarea{
	border: 1px solid #666;
	font-size: 12px;
	font-family: arial;
	background: white;
}

input[type=button]{
	background: white;
	border: 1px solid #62BD2D;
	color: #333;
	cursor: pointer;
	padding: 1px;
	width: auto;
}

#toolbar_user input[type=button]{
	width: 30px;
}

#toolbar_user select{
	background: white;
	border: 1px solid #62BD2D;
	color: #333;
	width: 50px;
}

#toolbar_user input{
	width: 70px;
	font-size: 12px;
}

/* stundenliste header*/
#stundenliste_header{
	float:left;
	width: 100%;
	line-height: 150%;
	margin-bottom: 20px;
}

#stundenliste_header .top{
	float:left;
	width: 100%;
	margin-bottom: 10px;
	font-size: 15px;
	line-height: 160%;
}

#stundenliste_header .left{
	width: 250px;
}

#stundenliste_header div.total_einheiten span{
	margin-right: 10px;
}

#stundenliste_header .right{
	width: 550px;
}

.stundenliste_summary {
	clear: both;
	float: none;
	border-top: 1px solid black;
	border-bottom: 2px solid black;
	margin: 10px 0 30px 0;
	padding: 10px 0;
}

.stundenliste_summary .row {
	display: block;
	clear: both;
	float: none;
	width: 100%;
	padding: 2px 0;
	height: 1em;
}

.stundenliste_summary .row.head {
	font-weight: bold;
}

.stundenliste_summary .row:nth-of-type(2n) {
	background: rgba(0, 0, 0, 0.2);
}

.stundenliste_summary .row div {
	display: inline-block;
}

.stundenliste_summary .row div:nth-of-type(1) {
	float: left;
	width: 180px;
	padding: 0 10px;
}

.stundenliste_summary .row div:nth-of-type(2) {
	float: left;
	width: 120px;
	padding: 0 10px;
	text-align: right;
}

.stundenliste_summary .row div:nth-of-type(3) {
	float: left;
	width: 100px;
	padding-left: 10px;
	text-align: right;
}

#status_dropdowns div{
	float: left;	
}

#status_dropdowns div#selected_edit_tools{
	right: 0px;
	font-size: 12px;
	background: url(../pics/mark_blue.png) 0px 6px no-repeat;
	padding-left: 15px;
	margin-right: 13px;
	position: absolute;
} 

#status_dropdowns div#selected_edit_tools select{
	width: auto;	
	max-width: 150px;
}

#status_dropdowns img#verrechnet_icon{
	display: block;	
	margin-left: -20px;
	margin-top: 5px;
}

#selected_edit_tools option{
	margin-left: 10px;	
}

.admin{
	color: #D73233;
}
/* stundenliste */
table#stundenliste_table,
table#stundenliste_table_admin{
	float:left;
	width: 100%;
	max-width: 900px;
	border-collapse: collapse;
}

table#stundenliste_table th,
table#stundenliste_table_admin th{
	text-align: left;
	font-weight: bold;
	padding-bottom: 10px;
	padding-top: 5px;
}

table#stundenliste_table td,
table#stundenliste_table_admin td{
	border-top: 1px solid #333;
	padding: 5px;
	padding-left: 0px;
	padding-right: 0px;
	vertical-align: top;
}

#stundenliste_insert_buttons{
	float: right;
	width: 95px;
	margin-top: 30px;
}

#stundenliste_insert_activity {
	background: white;
}

table#stundenliste_table textarea,
table#stundenliste_table_admin textarea{
	width: 100%;
	max-width: 500px;
	height: 30px;
}

input.date{
	width: 70px;
}

table#stundenliste_table input.hours,
table#stundenliste_table_admin input.hours{
	width: 40px;
}

table#stundenliste_table input.type,
table#stundenliste_table_admin input.type{
	width: 40px;
}

table#stundenliste_table input.ansatz,
table#stundenliste_table_admin input.ansatz{
	width: 50px;
	border: 1px solid #D73233;
}

input.stundenliste_nr{
	width: 50px;
}

textarea.bemerkung{
	width: 450px;
	height: 30px;
	float: left;
}

#label_bemerkung{
	float:left;
	margin-right: 4px;
}

table#stundenliste_table_admin tr.total_row td{
	border-top: 2px solid #333;
}

table#stundenliste_table_admin tr.total_row{
	display: none;
}

/*spaltenbreite nicht admin*/
table#stundenliste_table tr:hover,
table#stundenliste_table_admin tr:hover{
	background: #FAF5EC;
}

table#stundenliste_table tr.first_row:hover,
table#stundenliste_table_admin tr.first_row:hover{
	background: white;
}


table#stundenliste_table th.date{
	width: 100px;
}

table#stundenliste_table th.hours{
	width: 60px;
}

table#stundenliste_table div.hours,
tr.total_row td.hours{
	text-align: right;
	padding-right: 5px;
}

table#stundenliste_table th.type{
	width: 60px;
}

table#stundenliste_table th.work{
	width: 430px;
	padding-right: 10px;
}

table#stundenliste_table th.visum{
	width: 50px;
}

/*spaltenbreite admin*/
table#stundenliste_table_admin th.date{
	width: 140px;
}

table#stundenliste_table_admin th.hours{
	width: 50px;
}

table#stundenliste_table_admin div.hours{
	text-align: right;
	padding-right: 5px;
}

table#stundenliste_table_admin th.type{
	width: 60px;
}

table#stundenliste_table_admin th.work{
	width: 280px;
}

table#stundenliste_table_admin textarea{
	width: 100%;
	max-width: 370px;
}

table#stundenliste_table_admin th.visum{
	width: 50px;
}

table#stundenliste_table_admin th.ansatz{
	width: 50px;
	color: #D73233;
}

table#stundenliste_table_admin .kosten{
	width: 70px;
	color: #D73233;
	text-align: right;
}

/* edit button */
.ajax_edit_button, 
.ajax_delete_button{
	position: absolute;
	margin-top: -14px;
	margin-left: -10px;
	display: none;
	width: 50px;
	text-align: right;
	padding-top: 10px;
	z-index: 170;
}

#stundenliste_header .ajax_edit_button{
	margin-left: -50px;
}

.ajax_delete_button{
	right: 0px;
	width: 100px;
	text-align: left;
	
}

#stundenliste_header .ajax_edit_button{
	margin-top: -12px;
}

img.button{
	border: none;
	cursor: pointer;
}

.ajax_mark_row{
	position: absolute;
	margin-left: 75px;
	margin-top: 1px;	
}

.ajax_verrechnet{
	position: absolute;
	margin-left: 100px;
	margin-top: 1px;	
}

table#stundenliste_table .ajax_verrechnet{
	margin-left: 75px;
}

.ajax_notiz{
	position: absolute;
	margin-left: 120px;
	margin-top: 1px;
	z-index: 150;
}

/* admin navigation (projekte, kunden, benutzer) */
#admin_navigation{
	width: 100%;
	top: 70px;
	font-size: 10px;
	z-index: 210;
	position: absolute;
	left: 20px;
}

#admin_navigation li{
	float: left;
	width: 65px;
}

#admin_navigation a{
	color: #333;
	height: 11px;
	float: left;
	padding: 5px;
	padding-top: 0px;
	border-top: 1px solid white;

}

#admin_navigation a.active{
	border: 1px solid #333;
	padding-top: 2px;
	border-bottom: 1px solid #FAF5EC;
	background: #FAF5EC;
	height: 9px;

}

.edit_layer{
	background: #FAF5EC;
	border: 1px solid #333;
	position: absolute;
	top: 87px;
	z-index: 200;
	display: none;
	padding: 10px;
	font-size: 11px;
}

#projekt_layer{
	left: 10px;
}

#kunde_layer{
	left: 75px;
}

#benutzer_layer{
	left: 140px;
}

#back_layer{
	position: fixed;
	left: 0px;
	top: 0px;
	height: 100%;
	width: 100%;
}
/*
.edit_layer img{
	float:right;
}
*/
.edit_layer ul{
	margin-top: 20px;
}

.edit_layer li{
	margin-top: 5px;
	margin-left: 5px;
}

.edit_layer li div.clickable{
	display: inline;
}

.edit_layer li.title{
	font-weight: bold;
	margin-left: 0px;
	margin-top: 10px;
}

.edit_layer label{
	display: block;
	font-weight: bold;
	margin-bottom: 2px;
}

.edit_layer input, 
.edit_layer select{
	font-size: 11px;
	border: 1px solid #62BD2D;
	margin-bottom: 3px;
}

#projekt_layer input[type=text]{
	width: 200px;
}

.edit_layer input[type=button]{
	width: 60px;
}

.edit_layer select{
	width: 138px;
}

#projekt_layer input.list{
	width: 150px;
}

#benutzer_layer input[type=text]{
	width: 70px;
}

#benutzer_layer li div.clickable{
	width: 50px;
	float:left;
	display: block;
	height: 15px;
}

.ajax_mark_user{
	float: left;
	margin-right: 5px;
	display: inline;	
}

.customer_box{
	float: right;
	width: 100%;
}

.edit_layer .customer_box ul{
	margin: 0px;
	margin-bottom: 20px;	
	margin-left: 12px;
}

/* stundenliste toolbar */
#ajax_container_stundenliste_anzeige{
	float: left;
	width: 100%;
	background: #333;
	margin-bottom: 20px;
}

#ajax_container_stundenliste_anzeige .content{
	float: left;
	margin: 5px;
	color: white;	
}

#ajax_container_stundenliste_anzeige select{
	background: white;	
	color: #333;
	border: 1px solid #D73233;
	margin-left: 40px;
}

#ajax_container_stundenliste_anzeige div{
	display: inline;
}

#ajax_container_stundenliste_anzeige button{
	position: absolute;
	margin-top: -1px;
}


/* notiz box */
.notiz_box{
	position: absolute; 
	background: url(../pics/notiz_box_pfeil.png) 0px 0px no-repeat;
	margin-left: 125px;
	margin-top: -12px;
	z-index: 160;	
}

.notiz_box .content{
	background: yellow;
	margin-left: 15px;
	width: 200px;
	padding: 10px;
	padding-right: 12px;
	padding-bottom: 8px;
	background: #FAF5EC;
	border: 1px solid #333;
	border-left: none;
	min-height: 20px;
}

table#stundenliste_table_admin .notiz_box textarea{
	width: 100%;	
	padding: 0px;
	margin: 0px;
	border: none;
	background: none;
	font-size: 11px;
	height: 150px;
}

#overall_layer{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: none;
	z-index: 155;	
}


span.spacer {
	display: inline-block;
	width: 10px;
}

#filter_date_from,
#filter_date_to {
	width: 80px;
}

/*verbrauchte zeit */
span.red { color: #D73233; }
span.orange { color: #fa6305; }
span.green { color: #4aab0e; }