html, body, div, span, input, applet, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img,
ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead,
tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary, time, mark, audio, video {
    border: none;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}

body {
	font-family: arial;
}

#logout-button {
	float: right;
	margin: 10px 10px 0px 0px;
}

#reportoverview-button {
	float: right;
	margin: 10px 20px 0px 0px;
}

.content > p:first-child,
p.menu {
	margin-bottom: 10px;
}

.msgbox {
    box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1);
    border-left: 6px solid #FFF;
    background: none repeat scroll 0% 0% #FFF;
    margin: 5px 0px 15px;
    padding: 13px 8px;
    
}

.errro-msg {
    border-color: #DB140C;
}

.success-msg {
    border-color: #7AD03A;
}

.info-msg {
    border-color: #110CDB;
}

.clear::after,
.clear::before {
    content: ' ';
    display: block;
}

.clear::after {
    clear: both;
}

.form-label {
	float: left;
	min-width: 130px;
}

.form-input,
.form-label {
	padding: 8px;
}

div.form-controll {
	padding: 8px 0px;
}

div.form-controll button {
	margin-right: 5px;
}

.text-right {
    text-align: right;
}

.text-italic {
    font-style: italic;
}

.text-bold {
    font-weight: bold;
}

div.table h2 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.table .header-row,
.table .row,
.table .footer-row {
    display: table-row;
}

.table .cell {
    display: table-cell;
    min-width: 200px;
}

.table .header-row .cell,
.table .footer-row .cell {
    padding: 10px;
}

.table .row .cell {
    padding: 5px 10px;
    vertical-align: middle;
}

.table .header-row {
    background-color: #1C68B2;
    color: #ffffff;
}

.table .row:nth-child(2n) {
    background-color: #f9f9f9;
}

.table .row:nth-child(2n+1) {
    background-color: #eaeaea;
}

.table .control-row > button,
.table .control-row > form {
    float: right;
    margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
    display: inline-block;
}

.table .footer-row {
    background-color: #6E7174;
    color: #ffffff;
}


#main {
    width: 100%;
    background-color: #f1f1f1;
}

div.header,
div.title,
div.controls {
    padding-left: 10px;
}

div.header {
    background-color: #d5d5d5;
    height: 65px;
    border-bottom: 1px solid #B9B9B9;
}

div.title {
    background-color: #d9dadc;
    padding-top: 5px;
    padding-bottom: 5px;
    border-bottom: 1px solid #c3c3c8;
}

div.controls {
    background: -moz-linear-gradient(top, #d5d5d5 0%, #a9a9a9 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d5d5d5), color-stop(100%,#a9a9a9));
    background: -webkit-linear-gradient(top, #d5d5d5 0%,#a9a9a9 100%);
    background: -o-linear-gradient(top, #d5d5d5 0%,#a9a9a9 100%);
    background: -ms-linear-gradient(top, #d5d5d5 0%,#a9a9a9 100%);
    background: linear-gradient(top, #d5d5d5 0%,#a9a9a9 100%);
    padding: 8px;
}

div.content {
	border-top: 1px solid #c9c9c9;
	padding: 1%;
	padding-right: 1%;
	
}

/*Events*/

div.event:nth-child(2n),
div.personal:nth-child(2n),
div.personalkosten:nth-child(2n) {
	background-color: #f9f9f9;
}

div.event:nth-child(2n+1),
div.personal:nth-child(2n+1),
div.personalkosten:nth-child(2n+1) {
	background-color: #eaeaea;
}

.event-header,
.personal-header,
.personalkosten-header {
	background-color: #1C68B2;
	color: #ffffff;
}

.personalkosten-footer {
    background-color: #6E7174;
    color: #ffffff;
}

.event,
.event-header,
.personal,
.personal-header,
.personalkosten,
.personalkosten-header,
.personalkosten-footer {
    display: table-row;
}

.event > div,
.event-header > div,
.personal > div,
.personal-header > div,
.personalkosten > div,
.personalkosten-header > div,
.personalkosten-footer > div {
    display: table-cell;
    width: 33.3333%;
    min-width: 200px;
}

.event > div,
.personal > div,
.personalkosten > div {
	vertical-align: middle;
	padding: 5px 10px;
}

.event-header > div,
.personal-header > div,
.personalkosten-header > div,
.personalkosten-footer > div {
	padding: 10px;
}

.event-controls > form,
.event-controls > button,
.personal-controls > form,
.personal-controls > button,
.personalkosten-controls > form,
.personalkosten-controls > button {
	float: right;
	margin-left: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

.event-controls form,
.personal-controls form,
.personalkosten-controls form {
	display: inline-block;	
}

.edit-event-container,
.edit-personal-container,
.edit-personalkosten-container,
.edit-zahlung-container {
	background-color: #ffffff;
	padding: 15px;
}

.edit-event-container input,
div.edit-kassen-container input,
.edit-personal-container input,
.edit-personalkosten-container input,
.edit-zahlung-container input {
	border: 1px solid #ddd;
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.07);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.07);
	background-color: #fff;
	color: #32373c;
	outline: 0;
	-webkit-transition: 50ms border-color ease-in-out;
	transition: 50ms border-color ease-in-out;
}

/*Event*/
.new-kasse-container div.form-label {
	min-width: 175px;
}

.new-kasse-container div.form-input input,
.new-kasse-container div.form-input select {
	width: 140px;
	
}

/*Bereich*/
.bereiche-container {
	margin-top: 10px;
}

.bereiche-container h3 {
	font-size: 15px;
	padding: 5px;	
}

/*Kasse*/

div.header-kasse {
	background-color: #1C68B2;
	color: #ffffff;
}

div.footer-kasse {
    background-color: #6E7174;
    color: #ffffff;
}

div.header-kasse,
div.footer-kasse,
div.kasse,
div.edit-kassen-container {
	margin-left: 30px;
}

div.header-kasse > div,
div.footer-kasse > div,
div.kasse > div {
	float: left;
	min-width: 130px;
	padding: 5px;
}

div.kasse:nth-child(2n) {
	background-color: #f9f9f9;
}

div.kasse:nth-child(2n+1) {
	background-color: #eaeaea;
}

div.header-kasse-col3,
div.header-kasse-col4,
div.header-kasse-col5,
div.footer-kasse-col3,
div.footer-kasse-col4,
div.footer-kasse-col5,
div.kasse-anfangsbetrag,
div.kasse-endbetrag,
div.kasse-umsatz {
	text-align: right;
}

div.edit-kassen-container {
	background-color: #ffffff;
	padding: 3px 10px 0px;
}

div.edit-kassen-container input {
	text-align: right;
}

div.titel {
	font-weight: 600;
	margin-top: 10px;
}

div.calculator-container {
	margin-bottom: 20px;
}

div.calculator-container label.caption {
	min-width: 130px;
	display: inline-block;
}

div.calculator-container label.summe {
	margin-left: 10px;
	display: inline-block;
	text-align: right;
	min-width: 60px;
}

div.calculator-container input {
	width: 40px;
	text-align: right;
	padding-right: 3px;
}

div.edit-kassen-container div.form-label,
div.calculator-container {
	margin-left: 20px;
}

div.calculator-container .calc {
	padding-left: 8px;
}

.personalkosten > div,
.personalkosten-header > div,
.personalkosten-footer > div {
	min-width: 150px;
	width: auto;
}

.zahlung-betrag-header,
.zahlung-betrag-footer,
.zahlung-betrag,
.personalkosten-stundensatz-header,
.personalkosten-gesamt-header,
.personalkosten-ausgezahlt-header,
.personalkosten-stundensatz,
.personalkosten-gesamt,
.personalkosten-ausgezahlt,
.personalkosten-gesamt-footer,
.personalkosten-ausgezahlt-footer {
    text-align: right;
}

/*Personalkosten*/
#personalkosten-gesamt {
	display: inline-block;
	width: 143px;
	text-align: right;
}


/*Event overview*/
.overview-container .table {
    float: left;
    margin-right: 50px;
}

.chart-container .chart {
    float: left;
}