@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700);


/* MISC */

html, body {
	margin: 0px;
	width: 100%;
	font-family: 'Open Sans', sans-serif, verdana;
	font-size: 9pt;
	color: #666666;
	background: #ffffff;
	-webkit-text-size-adjust: none;
	-webkit-overflow-scrolling: touch;
}

div, input {
	box-sizing: border-box;
}

a {
	color: #1ab394;
	text-decoration: none;
}

a:hover {
	color: #18a185;
}

label {
	user-select: none;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	-ms-user-select: none;
}

.form-input {
	font-family: 'Open Sans', verdana, sans-serif;
	font-size: 9pt;
	color: #666666;
	padding: 6px;
	margin: 0px;
	width: 100%;
	background: #ffffff;
	border: solid 1px #e7eaec;
	border-radius: 2px;
	outline: 0;
	resize: none;
	-webkit-appearance: none;
	box-sizing: border-box;
}

	.form-input.error {
		border-color: red;
	}

	.form-input:focus {
		border-color: #1ab394;
	}

	.form-input-icon {
		position: absolute;
		right: 5px;
		top: 24px;
		z-index: 100;
	}

		.form-input-icon i {
			padding: 7px;
		}

		.form-input-icon + .form-input {
			padding-right: 40px;
		}

		.form-input-icon img {
			height: 12px;
			width: auto;
			position: relative;
			top: 7px;
			right: 4px;
		}

	::-webkit-input-placeholder {
		color: #999999;
	}
	:-moz-placeholder {
		color: #999999;
		opacity: 1;
	}
	::-moz-placeholder {
		color: #999999;
		opacity: 1;
	}
	:-ms-input-placeholder {
		color: #999999;
	}

.form-button {
	font-family: 'Open Sans', verdana, sans-serif;
	font-size: 9pt;
	color: #ffffff;
	padding: 6px 10px 6px 10px;
	background: #1ab394;
	border-width: 0px;
	border-radius: 2px;
	outline: 0;
	cursor: pointer;
	-webkit-appearance: none;
	box-sizing: border-box;
}

	.form-button:hover {
		background: #18a185;
	}

	.form-button.fullwidth {
		width: 100%;
	}

	.form-button.simple {
		background: #ffffff;
		border: solid 1px #e7eaec;
		color: #666666;
	}

		.form-button.simple:hover {
			background: #f9f9f9;
		}

	input[type=checkbox]:not(old), input[type=radio]:not(old) {
		width: 2em;
		margin: 0;
		padding: 0;
		font-size: 1em;
		opacity: 0;
	}

	input[type=checkbox]:not(old) + label, input[type=radio]:not(old) + label {
		display: inline-block;
		margin-left: -2em;
		line-height: 1.2em;
		max-width: 100%;
	}

	input[type=checkbox]:not(old) + label > span, input[type=radio]:not(old) + label > span {
		display: inline-block;
		width: 1.15em;
		height: 1.15em;
		margin: 0em 0.5em 0em 0.25em;
		border-radius: 0.25em;
		background: #f3f3f3;
		vertical-align: bottom;
		overflow: hidden;
		border: solid 1px #e7eaec;
		box-sizing: border-box;
	}

		input.error[type=checkbox]:not(old) + label > span, input.error[type=radio]:not(old) + label > span {
			background: #fc5858;
			border-color: red;
		}

	input[type=radio]:not(old) + label > span {
		border-radius: 50%;
	}

	input[type=checkbox]:not(old):checked + label > span, input[type=radio]:not(old):checked + label > span {
		background: #1ab394;
		border-color: #1ab394;
	}

	input[type=checkbox]:not(old):checked + label > span:before, input[type=radio]:not(old):checked + label > span:before {
		content: '\2713';
		display: block;
		width: 1.1em;
		color: #ffffff;
		font-size: 0.9em;
		line-height: 1.3em;
		text-align: center;
		font-weight: bold;
	}

label {
}

.clear {
	float: none;
	clear: both;
	height: 1px;
	line-height: 1px;
}

.hidden {
	display: none;
}

.overlay {
	display: none;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background: transparent url('../images/blank.png');
	z-index: 1100;
}

.labeltext {
	color: #999999;
}

.errortext {
	color: red;
}

hr {
	color: #e7eaec;
	background-color: #e7eaec;
	height: 1px;
	border-width: 0px;
}

.statuslabel {
	display: inline-block;
	padding: 1px 3px 1px 3px;
	font-size: 8pt;
	margin: 0px 3px 0px 3px;
}

	.statuslabel.alert {
		background: red;
		color: #ffffff;
	}

	.statuslabel.note {
		background: orange;
		color: #ffffff;
	}

#listpreload {
	color: #999999;
	text-align: center;
	padding: 5px;
}


/* CONTEXT MENU */

#contextmenu-overlay {
	z-index: 1100;
}

#contextmenu {
	display: none;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 1200;
	width: 250px;
	max-width: 95%;
	background: #ffffff url('../images/blank.png');
	border: solid 1px #eeeeee;
	border-radius: 2px;
	padding: 10px;
	box-shadow: 1px 1px 5px #eaeaea;
	box-sizing: border-box;
	overflow-y: auto;
}

	.contextmenu-list {
		padding: 0px 10px 0px 10px;
		margin: 5px 0px 5px 0px;
	}

		.contextmenu-list.header {
			padding: 10px 10px 5px 10px;
			margin: 0px;
			font-weight: bold;
		}

		.contextmenu-list.button {
			margin-top: 30px;
		}

		.contextmenu-list.center {
			text-align: center;
		}

		.contextmenu-list a:not(.link) i {
			margin-right: 10px;
		}

		.contextmenu-list a:not(.link) {
			color: #666666;
			display: block;
			line-height: 22pt;
			padding: 0px 10px 0px 10px;
			margin: 0px -10px 0px -10px;
		}

			.contextmenu-list a:not(.clear-filter):not(.link):hover, .contextmenu-list a:not(.clear-filter):hover .labeltext {
				background: #1ab394;
				color: #ffffff;
			}

	.contextmenu-close {
		float: right;
		padding: 8px;
		display: none;
	}


/* FANCY-POPUP */

.fancy-popup-container {
	background: #ffffff;
	margin: 0px auto 0px auto;
}

	.fancy-popup-container.small {
		width: 400px;
		max-width: 100%;
	}

	.fancy-popup-container.medium {
		width: 600px;
		max-width: 100%;
	}

	.fancy-popup-container.midlarge {
		width: 700px;
		max-width: 100%;
	}

	.fancy-popup-container.large {
		width: 800px;
		max-width: 100%;
	}

	.fancy-popup-container.full {
		width: 10000px;
		max-width: 100%;
	}

.fancy-popup-container .content-section-title {
	background: transparent;
}

.fancy-popup-container .content-section-action {
	float: none;
}

	.fancy-popup-container .content-section-action input {
		margin-bottom: 20px;
	}

.fancy-popup-container .content-section-button {
	margin-bottom: 15px;
}

.fancy-popup-container .content-section-data.half {
	margin-bottom: 10px;
}



/* TABLE-LAYOUT */

div.table, table {
	display: table;
	width: 100%;
	border-collapse: collapse;
}

	div.table.fixedwidth, table.fixedwidth {
		table-layout: fixed;
	}

	.table-head, thead {
		display: table-header-group;
		font-weight: bold;
	}

		.table-head .table-row:hover, thead tr:hover {
			background: transparent;
		}

	.table-body, tbody {
		display: table-row-group;
	}

	.table-row, tr {
		display: table-row;
	}

		.table-row:hover {
			background: #fcfcfc;
		}

		.table-row.bold, tr.bold {
			font-weight: bold;
		}

		.table-row.no-hover:hover, tr.no-hover:hover, .table.no-hover .table-row:hover, table.no-hover tr:hover {
			background: transparent;
		}

		.table-row.no-border .table-cell, tr.no-border td {
			border-bottom: 0px;
		}

	.table-cell, td {
		display: table-cell;
		padding: 10px;
		border-bottom: solid 1px #e7eaec;
		position: relative;
		min-height: 1px;
	}

		.table-cell.bgfill, td.bgfill {
			background-color: #f7f8f9;
		}

		.table-cell.no-border, td.no-border, .table.no-border .table-cell, table.no-border td {
			border-bottom: 0px;
		}

		.table-cell.no-padding, td.no-padding, .table.no-padding .table-cell, table.no-padding td {
			padding: 0px;
		}

		.table-cell.small-padding, td.small-padding, .table.small-padding .table-cell, table.small-padding td {
			padding: 5px;
		}

		.table-cell.center, td.center {
			text-align: center;
		}

		.table-cell.right, td.right {
			text-align: right;
		}

		.table-cell.top, td.top {
			vertical-align: top;
		}

		.table-cell.bottom, td.bottom {
			vertical-align: bottom;
		}

		.table-cell.bold, td.bold {
			font-weight: bold;
		}

		.table-cell.iconlinks a, td.iconlinks a {
			margin-left: 15px;
		}

		.table-cell .form-input-icon, td .form-input-icon {
			top: 10px;
			right: 12px;
		}

		.table-cell.numlink {
			padding-right: 20px;
		}

	.table-foot, tfoot {
		display: table-footer-group;
		font-weight: bold;
	}

		.table-foot .table-row:hover, tfoot tr:hover {
			background: transparent;
		}

		.table-foot .table-cell, tfoot td {
			border-bottom-width: 0px;
		}


/* HEADER */

#header {
	position: fixed;
	width: 100%;
	height: 45px;
	background: #2f4050;
	color: #ffffff;
	line-height: 45px;
	z-index: 1500;
}

	.header-logo {
		float: left;
		width: 230px;
		font-size: 13pt;
		text-transform: uppercase;
		cursor: default;
		margin-left: 15px;
	}

		.header-logo-icon {
			color: #1ab394;
		}

		.header-logo-text {
			margin-left: 8px;
		}

	.navbars {
		display: none;
	}

	.header-title {
		float: left;
		line-height: 25px;
		padding: 10px;
		font-size: 10pt;
	}

	.header-tools {
		float: right;
	}

		.header-tools ul {
			list-style-type: none;
			padding: 0px;
			margin: 0px;
		}

			.header-tools ul li {
				font-size: 13pt;
				float: left;
				position: relative;
			}

				.header-tools ul li .badge {
					position: absolute;
					right: 8px;
					top: 5px;
					background: red;
					padding: 4px;
					border-radius: 50%;
					color: #ffffff;
					font-size: 7pt;
					line-height: 4pt;
					font-weight: 400;
				}

				.header-tools ul li a {
					display: block;
					line-height: 45px;
					color: #ffffff;
				}

					.header-tools ul li a:hover, .main-header-tools ul li a:focus {
						background: #1ab394;
						color: #ffffff;
					}

					.header-tools ul li a i {
						line-height: 45px;
						padding: 0px 11px 0px 11px;
					}



/* MAINNAV */

#mainnav {
	width: 230px;
	height: 100%;
	background: #f7f8f9;
	padding-top: 10px;
	padding-bottom: 45px;
	margin-top: 45px;
	overflow-y: auto;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: 1200;
}

	#mainnav ul {
		list-style-type: none;
		padding: 0px;
		margin: 0px;
	}

	#mainnav li {
		padding-left: 10px;
		margin-bottom: 8px;
		line-height: 28pt;
		border-left: solid 3px transparent;
		border-right: solid 3px transparent;
	}

		#mainnav li:hover, #mainnav li.active {
			background: #f1f2f3;
			border-left-color: #1ab394;
		}

		#mainnav li a {
			color: #666666;
			text-decoration: none;
			display: block;
			line-height: inherit;
		}

		#mainnav li i {
			float: left;
			margin-right: 10px;
			line-height: inherit;
		}

			#mainnav li i.fa {
				font-size: 16pt;
				display: block;
			}

		#mainnav li .text {
			display: inline-block;
		}

		#mainnav li .text-mini {
			display: none;
		}


/* MAIN */

#main {
	padding-left: 230px;
	padding-top: 45px;
}

	#content {}

		.content-titlebar {
			padding: 30px 20px 15px 25px;
			font-size: 18pt;
			font-weight: 300;
			margin-bottom: 10px;
		}

			.content-titlebar-title {
				float: left;
				margin-top: 5px;
			}

			.content-titlebar i {
				margin-right: 5px;
				color: #dddddd;
			}

			.content-titlebar-menu {
				float: right;
			}

				.content-titlebar-menu .text {
					font-size: 12pt;
				}

				.content-titlebar-menu-item {
					display: inline-block;
					margin: 0px 3px 0px 3px;
					font-size: 11pt;
					color: #999999;
				}

					.content-titlebar-menu-item .text {
						margin-left: 5px;
					}

					.content-titlebar-menu-item i {
						color: #999999;
						margin-right: 0px;
						border: solid 1px #e7eaec;
						border-radius: 2px;
						padding: 7px 5px 7px 5px;
					}

						.content-titlebar-menu-item:hover i, .content-titlebar-menu-item.active i {
							color: #1ab394;
							border: solid 1px #1ab394;
						}

							.content-titlebar-menu-item.alert:hover i {
								color: red;
								border: solid 1px red;
							}

		.content {
			padding: 10px;
			clear: both;
		}

			.content-section {
				padding: 20px;
				border: solid 1px #e7eaec;
				border-radius: 2px;
				margin: 0px 0% 15px 1%;
			}

				.content-section.no-border {
					border-width: 0px;
				}

				.content-section.min-padding {
					padding: 10px;
				}

				.content-section.note {
					background: #fffbe7;
					color: #8c7e5e;
					border-color: #f7f1e3;
				}

					.content-section.note a {
						color: #cac5b2;
					}

						.content-section.note a:hover {
							color: #8c7e5e;
						}

				.content-section.note-alert {
					background: #ffecec;
					color: #d9534f;
					border-color: #f9cbc8;
				}

					.content-section.note-alert a {
						color: #f7acaa;
					}

						.content-section.note-alert a:hover {
							color: #d9534f;
						}

				.content-section.full {
					width: 98%;
					clear: both;
				}

				.content-section.half {
					width: 48.5%;
					float: left;
				}

				.content-section.quarter {
					width: 23.75%;
					float: left;
				}

				.content-section-action {
					float: right;
				}

					.content-section-action a {
						font-size: 11pt;
					}

				.content-section-title {
					color: #999999;
					font-size: 12pt;
					font-weight: 300;
					margin-bottom: 10px;
				}

				.content-section-content {
					padding: 10px;
					border: solid 1px #e7ebee;
					border-radius: 2px;
				}

				.content-section-data {
					padding: 10px;
				}

					.content-section-data.half {
						float: left;
						width: 50%;
					}

					.content-section-datarow {
						padding: 5px 0px 5px 0px;
						position: relative;
						clear: both;
					}

						.content-section-datarow.header {
							font-weight: bold;
							margin-bottom: 9px;
							text-transform: uppercase;
						}

					.content-section-datacell {
						padding: 5px 0px 5px 0px;
					}

						.content-section-datacell.half {
							float: left;
							width: 50%;
						}

				.content-section-data.biglink {
					font-size: 12pt;
					color: #666666;
					font-weight: 300;
				}

					.content-section-data.biglink i {
						margin-right: 5px;
						color: #dddddd;
					}

				.content-section-button {
					text-align: right;
					margin: 0% 1% 0% 1%;
				}

					.content-section-button #formcheck-error {
						float: left;
						color: red;
					}

					.content-section-button .form-button {
						margin: 0px 0px 0px 10px;
						min-width: 100px;
					}

				.content-section .center {
					text-align: center;
				}

	#content-for-titlebar-menu {
		display: none;
	}

	#no-access-message {
		text-align: center;
		color: red;
	}



/* TABLET LANDSCAPE */

@media (max-width: 1024px), print {

	.hide-tablet-ls {
		display: none;
	}

	.header-logo {
		text-align: center;
		width: 90px;
		margin-left: 0px;
		position: relative;
	}

		.header-logo i {
			line-height: 45px;
		}

		.header-logo-text {
			display: none;
		}

	.header-title {
		padding-left: 20px;
	}

	#mainnav {
		width: 100%;
		display: none;
	}

		#mainnav.open {
			display: block;
		}

		#mainnav li {
			float: left;
			width: 25%;
			box-sizing: border-box;
		}

		#mainnav li i, #mainnav li .text, #mainnav li .text-mini {
			display: block;
			text-align: center;
			float: none;
			clear: both;
			margin: auto;
		}

		#mainnav li .text-mini {
			display: none;
		}

	#main {
		padding-left: 0px;
	}

	.header-logo {
		margin-left: 0px;
	}

		.header-logo .logo {
			display: none;
		}

	.navbars {
		display: block;
		float: left;
		width: 54px;
		font-size: 14pt;
		text-transform: uppercase;
		cursor: pointer;
	}

	.header-tools ul li.print {
		display: none;
	}

	.content-titlebar {
		padding: 30px 15px 15px 15px;
		font-size: 18pt;
		font-weight: 300;
		margin-bottom: 10px;
	}

	.content-section:not(.note) {
		padding: 5px;
		border-width: 0px;
		margin-bottom: 40px;
	}

		.content-section-action a {
			position: relative;
			top: -5px;
		}

	.content-section.full {
	}

	.content-section.half {
		width: 98%;
		float: none;
	}

	.content-section.quarter {
		width: 48.5%;
	}

	.content-section-title {
		background: #f7f7f7;
		color: #666666;
		font-weight: bold;
		font-size: 10pt;
		padding: 6px;
		margin: 0px -5px 0px -5px;
	}

	.content-section-action {
		margin: 8px 6px 0px 0px;
	}

	.content-section-data {
	}

		.content-section-data.half {
			width: 100%;
			float: none;
			margin-bottom: 30px;
		}

		.content-section-datarow.header {
			background: #f7f7f7;
			color: #666666;
			font-size: 10pt;
			padding: 6px;
			margin-left: -5px;
			margin-right: -5px;
		}

		.content-section-data:not(.note) {
			padding: 0px;
		}

	.content-section-button {
		margin: -40px 20px 0px 20px;
	}

}



/* MOBIL OG IPAD PORTRAIT */

@media screen and (max-width: 768px), print {

	.hide-tablet {
		display: none;
	}

	#mainnav li {
		width: 33.33%;
	}

		#mainnav li .text {
			display: none;
		}

		#mainnav li .text-mini {
			display: block;
		}

	.content-section:not(.note) {
		padding: 0px;
	}

		.content-section.note {
			padding: 5px;
		}

		.content-section.half {
			width: 98%;
			float: none;
			margin-left: 1%;
			margin-right: 1%;
		}

		.content-section.quarter {
			width: 48.5%;
		}

	.fancy-popup-container .content-section {
		padding: 10px;
	}

	.content-section-button {
		margin-top: 10px;
	}

		.content-section-button #formcheck-error {
			float: none;
			color: red;
			margin: -40px 0px 20px 0px;
		}

	.content-section-datacell.half.fullwidthipad {
		float: none;
		clear: both;
		width: 100%;
	}

	.table-cell {
		padding: 10px 0px 10px 0px;
	}

}



/* MOBIL PORTRAIT */

@media (max-width: 414px) {

	.hide-mobile {
		display: none;
	}

	.header-title {
		display: none;
	}

	.content-titlebar {
		margin-top: -10px;
		font-size: 14pt;
	}

	.content-titlebar-title {
		float: none;
		clear: both;
	}

	.content-titlebar-menu {
		float: none;
		clear: both;
		width: 100%;
		margin-top: 20px;
		padding: 5px 0px 5px 0px;
		text-align: center;
		border-bottom: solid 1px #e7eaec;
		border-top: solid 1px #e7eaec;
	}

	.content-section-button {
		text-align: center;
	}

		.content-section-button .form-button {
			margin: 0px 0px 10px 0px;
			width: 100%;
		}

}



/* PRINT */

@media print {

	a {
		color: #666666;
	}

	.form-input {
		border-width: 0px;
	}

	a i.fa {
		display: none;
	}

	#header {
		display: none;
	}

	#main {}

		#content {}

			.content-titlebar {
				padding-top: 10px;
			}

			.content-titlebar-menu {
				display: none;
			}

			.content-section-button {
				display: none;
			}

	.hideforprint {
		display: none;
	}

}