﻿/* CENTRALISED CSS STYLES FOR THE GFM WEBSITE */

/* ===============================================
# HTML TAG BASED STYLES
==================================================  */

html {
	height: 100%;
}

body {
	padding-top: 55px;
	padding-bottom: 0px;
	height: 100%;
}

textarea {
	resize: none; /* Remove the resizing behaviour */
	overflow: auto; /* IE shows the scrollbar, this hides it until its needed */
	width: 100% !important;
}

header {
	margin-bottom: 8px;
}

a:focus {
	outline: none;
}
1
input[disabled] { /* set grey background on disabled controls */
	background-color: #dedede;
}

input.btn.btn-primary[disabled] {
	background-color: #719ec6;
}

.main-page-header-container {
	height: 200px;
}

.page-content-container {
	overflow: auto;
	height: -webkit-calc(100% - 200px);
	height: -moz-calc(100% - 200px);
	height: calc(100% - 200px);
}

.loading-img {
	background-image: url(images/loading-image.gif);
	background-repeat: no-repeat;
	height: 35px;
	width: 35px;
}

/* ===============================================
# SYSTEM BASED COLOURS
==================================================  */

.red {
	color: rgb(221, 90, 67) !important;
}

.darkred {
	color: #c20000 !important;
}

.blue {
	color: rgb(71, 143, 202) !important;
}

.darkblue {
	color: rgb(49, 112, 143) !important;
}

.green {
	color: rgb(105, 170, 70) !important;
}
/* #79c447 */

.orange {
	color: rgb(255, 137, 42) !important;
}

.yellow {
	color: rgb(204, 204, 0) !important;
}

.purple {
	color: rgb(160, 105, 195) !important;
}

.darkpurple {
	color: #800080 !important;
}

.brown {
	color: rgb(153, 77, 0) !important;
}

.grey {
	color: #777777 !important;
}

.darkgrey {
	color: #888888 !important;
}

.black {
	color: #333 !important;
}

.light-grey {
	color: #bbbbbb !important;
}

.white {
	color: rgb(255, 255, 255) !important;
}

.pastel-red {
	color: #d9534f !important;
}

.pastel-green {
	color: #5cb85c !important;
}

.pastel-blue {
	color: #5bc0de !important;
}

.pastel-yellow {
	color: #ff9043 !important; /* f0ad4e  #ed9c2c */
}

.pastel-darkblue {
	color: #337ab7 !important;
}



.bg-red {
	background-color: #f2dede !important;
}

.bg-darkred {
	background-color: #c20000 !important;
}

.bg-blue {
	background-color: #d9edf7 !important;
}

.bg-green {
	/*background-color: #dff0d8 !important;*/
	background-color: rgb(105, 170, 70) !important;
}

.bg-orange {
	background-color: rgb(255, 137, 42) !important;
}

.bg-darkorange {
	background-color: #f0ad4e !important;
}

.bg-purple {
	background-color: #5bc0de !important;
}

.bg-darkpurple {
	background-color: #800080 !important;
}

.bg-grey {
	background-color: #d3d3d3 !important;
}

.bg-bluegrey {
	background-color: #D2F2FF !important;
}

.bg-yellow {
	background-color: #EEEE00 !important;
}

.bg-pastel-red {
	background-color: #d9534f !important;
}

.bg-pastel-green {
	background-color: #5cb85c !important;
}

.bg-pastel-blue {
	background-color: #5bc0de !important;
}

.bg-pastel-midblue {
	background-color: #00adf1 !important;
}

.bg-pastel-yellow {
	background-color: #ff9043 !important; /* f0ad4e  #ed9c2c */
}

.bg-pastel-orange {
	background-color: #f69546 !important;
}

.bg-pastel-darkblue {
	background-color: #337ab7 !important;
}

.bg-pastel-purple {
	background-color: #b2a1c6 !important;
}

/* ===============================================
# SYSTEM FORMATING
==================================================  */

.pad-top-5 {
	padding-top: 5px !important;
}

.pad-top-10 {
	padding-top: 10px !important;
}

.pad-top-20 {
	padding-top: 20px !important;
}

.pad-bottom-5 {
	padding-bottom: 5px !important;
}

.pad-bottom-10 {
	padding-bottom: 10px !important;
}

.pad-bottom-20 {
	padding-bottom: 20px !important;
}

.margin-top-10 {
	margin-top: 10px !important;
}

.margin-top-15 {
	margin-top: 15px !important;
}

.margin-bottom-5 {
	margin-bottom: 5px !important;
}

.margin-bottom-10 {
	margin-bottom: 10px !important;
}

.margin-bottom-20 {
	margin-bottom: 20px !important;
}

.margin-left-25 {
	margin-left: 25px !important;
}

.margin-right-5 {
	margin-right: 5px !important;
}

.height-100p {
	height: 100%;
}

.height-90p {
	height: 90%;
}

.width-350 {
	width: 350px;
}

.width-5p {
	width: 5%;
}

.width-10p {
	width: 10%;
}

.width-15p {
	width: 15%;
}

.width-20p {
	width: 20%;
}

.width-25p {
	width: 25%;
}

.width-35p {
	width: 35%;
}

.width-100p {
	width: 100%;
}

.text-top {
	vertical-align: top !important;
}

.text-bottom {
	vertical-align: bottom !important;
}

.text-middle {
	vertical-align: middle !important;
}

.text-center {
	text-align: center !important;
}

.text-right {
	text-align: right !important;
}

.text-italic {
	font-style: italic;
}

.text-verticle {
	writing-mode: vertical-rl;
	text-orientation: sideways;
}


.info-tooltip,
.ki-tooltip {
	color: #3071A9;
}

.fa-asterisk {
	font-size: 10px;
}

/* ===============================================
# MAIN SITE LAYOUT & MENU STYLES
==================================================  */

/* BACKGROUND IMAGE  */
#background {
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: -999; /* Ensure div tag stays behind content; -999 might work, too. */
}

.stretch {
	width: 100%;
	height: 100%;
}

/* Application logo */
.app-logo {
	height: 50px;
	width: 250px;
	position: relative;
	float: left;
	top: 8px;
	left: 0px;
}

.app-name {
	left: -20px;
}

.app-name-prefix {
	color: #fff;
	font-size: 12px;
	position: relative;
	top: -12px;
	left: 5px;
}

/* Set main site header style */
.header {
	/*background-color: rgb(0, 173, 241) !important;*/ /* SITE COLOUR */
	/*background-color: #9A5DA1;*/ /* PURPLE */
	background-color: #f2f2f2;
}

	.header h2 {
		color: #fff;
		white-space: nowrap;
	}

/* Set padding to keep content from hitting the edges */
.body-content {
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
	background-color: #fff;
	height: 97%;
	overflow: auto;
}

/* Control footer content */
.footer-content {
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	/*background-color: #00adf1 !important;*/ /* SITE COLOUR */
	/*background-color: #9A5DA1 !important;*/
	background-color: #f2f2f2;
	color: #464646;
	border-top: 1px solid #ddd;
	height: 30px;
}

	.footer-content p {
		font-size: 9px;
		margin: 2px 16px 2px 1px !important;
	}

/* MENU */
/* We are not interested in override bootstrap here, as we want to define our own */
.main-menu {
	margin-top: 18px;
}

	.main-menu ul > li .tooltip {
		white-space: nowrap;
	}

	.main-menu ul > li > a {
		border-radius: 0px;
	}

		.main-menu ul > li > a > i {
			font-size: 17px;
		}

			.main-menu ul > li > a > i + span.badge {
				color: #3071a9;
				font-weight: bold;
				background-color: #ff9043;
			}

	.main-menu ul > li:first-child > a {
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	.main-menu ul > li:last-child > a {
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}

/* MENU - CONTEXT MENU */
.context-menu > ul > li > a {
	font-size: 12px !important;
	padding: 3px 15px !important;
}

.context-menu ul > li > a > span {
	font-size: 12px !important;
	opacity: 1;
	transition: none;
}

.context-menu ul > li {
	max-width: inherit;
	transition: none;
}

	.context-menu ul > li:hover {
		max-width: inherit;
	}


.secondary-menu ul {
	/*margin: 8px 0px;*/
	margin: 0px;
}

	.secondary-menu ul > li .tooltip {
		white-space: nowrap;
	}

	.secondary-menu ul > li > a {
		/*border: 1px solid #337ab7;*/
		min-width: 90px;
		border-radius: 0px;
		/*padding: 6px 15px;*/
		/*margin: 0px 2px;*/
		font-weight: bold;
		font-size: 12px;
		/*background-color: #D2F2FF;*/
	}

	.secondary-menu ul > li > a > span.badge {
		color: #3071a9;
		font-weight: bold;
		background-color: #ff9043;
	}

	.secondary-menu ul > li:first-child > a {
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	.secondary-menu ul > li:last-child > a {
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}

	/* MENU - ANIMATIONS */
	.secondary-menu ul > li.expand > a {
		min-width: 0px;
	}
	.secondary-menu ul > li.expand > a > span {
		font-size: 12px !important;
		padding-left: 3px;
		opacity: 0;
		transition: opacity 1s;
	}
	.secondary-menu ul > li.expand:hover > a > span {
		opacity: 1;
	}
	.secondary-menu ul > li.expand {
		max-width: 45px;
		transition: max-width 1s;
	}
	.secondary-menu ul > li.expand:hover {
		max-width: 200px;
	}
	.secondary-menu ul > li.expand > a:hover {
		background-color: #5cb85c !important;
	}
	.secondary-menu ul > li.expand.active  {
		max-width: 200px;
	}
	.secondary-menu ul > li.expand.active > a {
		background-color: #5cb85c !important;
	}
	.secondary-menu ul > li.expand.active > a > span {
		opacity: 1;
	}

	/* MENU - ANIMATIONS END */

.smenu-bar {
	/*background-color: rgb(53,60,69);*/
	background-color: #4f5964;
	margin-top: 0px;
}

.smenu-bar-analysis {
	margin-top: -10px;
	background-color: #4f5964;
}

.menu-arrow {
	font-size: 20px;
	float: left;
	padding-right: 10px;
}

/* MENU - SUB MENU */
.sub-menu {
	position: relative;
	top: -5px;
	padding-right: 35px !important;
	text-transform: capitalize;
}

	.sub-menu ul > li > a {
		padding: 4px 15px !important;
		margin-left: 4px;
		margin-right: 4px;
	}

		.sub-menu ul > li > a > i {
			color: #666;
		}

		/* MENU - ANIMATIONS */
		.sub-menu ul > li > a > span {
			font-size: 12px !important;
			opacity: 0;
			transition: opacity 1s;
		}

	.sub-menu ul > li:hover > a > span {
		opacity: 1;
	}

	.sub-menu ul > li > a:hover > i {
		color: #fff;
	}

	.sub-menu ul > li {
		max-width: 55px;
		transition: max-width 1s;
	}

		.sub-menu ul > li:hover {
			max-width: 200px;
		}


/* ===============================================
# LOGIN STYLES
==================================================  */

/***** GFM LOGIN STYLES *****/

.login-background { /* Sets the background colour of screen */
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0px;
	top: 0px;
	z-index: -99;
	background-color: #fff;
	opacity: 0.5;
}


.login-container {
	color: #666;
	padding: 20px 10px;
	/*margin-bottom: 40px;*/
	/*border: 1px solid rgb(40,96,144);*/
	height: 95%;
	overflow: auto;
}

	.login-container .row {
		margin: 30px;
	}

	.login-container p {
		font-size: 16px;
		margin-top: 15px;
		margin-bottom: 15px;
		margin-right: 20px;
		margin-left: 20px;
	}

.login-box {
	overflow: auto;
	height: 97%;
}

.login-container label {
	font-size: 14px;
}

.login-container p > ul > li {
	padding-bottom: 7px;
}

.login-intro {
	padding: 10px 10px 0px 30px;
	min-height: 450px;
}

	.login-intro ul > li {
		padding-bottom: 5px;
	}

.login-intro-heading {
	font-size: 38px !important;
	color: #666;
	width: 65%;
	min-height: 150px;
}

.login-intro-quote {
	font-size: 18px;
	font-style: italic;
	color: #a5c7e2;
	width: 85%;
}

.login-intro-aronlogo {
	width: 200px;
}

.login-entry-box {
	border-radius: 4px;
	background-color: #d3dfe7;
	opacity: 0.9;
	padding-top: 20px;
	padding-bottom: 20px;
	min-height: 450px;
}

	.login-entry-box > .row {
		margin-top: 25px;
		margin-bottom: 25px;
	}

	.login-entry-box a {
		font-weight: bold;
		font-size: 14px;
		color: #666;
	}

.login-entry-box-img {
	position: absolute;
	top: -60px;
	left: 230px;
	height: 266px;
	width: 350px;
}

.login-entry-box-terms {
	font-size: 8px;
}

	.login-messagebox {
		color: #fff;
		background-color: #cf3154;
		padding: 10px 15px;
		font-size: 15px;
	}

	.login-messagebox .validation-summary-errors {
		padding: 10px 5px 0px 5px;		
	}

	.login-messagebox ul > li {
		font-weight: bold;
		list-style-type: disc;
		padding-left: 10px;
	}

.login-popover-message {
	background-color: #cf3154;
	color: #fff
}
/***** GFM LOGIN STYLES END *****/
/* ===============================================
# ROW STYLES
==================================================  */
.row.separator {
	margin: 15px 0px 10px 0px;
	border-bottom: 1px dotted #ddd;
}

.row.separator.lg-margin {
	margin: 20px 0px 15px 0px;
}

.row > div.form-label {
    margin-top: 6px;
}

/* ===============================================
# Horizontal Rule Style
==================================================  */
hr.hr {
    background-color: #428bca;
    height: 1px;
    border: none;
}


/* ===============================================
# KEY INDICATOR SPECIFIC STYLES
==================================================  */

/* We set our own width here to work with bootstrap grid settings */
.col-ki {
	position: relative;
	float: left;
	width: 19.66666667% !important;
	min-height: 1px;
	padding-right: 10px;
	padding-left: 10px;
}

/* Define the container */
.infobox {
	border-width: 1px;
	border-style: dotted;
	border-color: rgb(216, 216, 216) !important;
	margin: -1px 0px 0px -1px;
	padding: 8px 3px 6px 9px;
	border-radius: 0px;
	width: 100%;
	text-align: left;
	color: rgb(85, 85, 85);
	vertical-align: middle;
	position: relative;
	box-shadow: none;
	background-color: rgb(255, 255, 255);
}

	.infobox > .infobox-icon {
		width: 44px;
		vertical-align: top;
		display: inline-block;
	}

	.infobox > .infobox-data {
		border: 0px currentColor;
		top: 0px;
		text-align: left;
		line-height: 21px;
		padding-left: 8px;
		font-size: 12px;
		display: inline-block;
		position: relative;
	}

.infobox-blue {
	border-color: rgb(111, 179, 224);
	color: rgb(111, 179, 224);
}

.infobox .infobox-content {
	color: rgb(85, 85, 85);
	font-size: 14px;
}

.infobox :first-child.infobox-content {
	font-weight: bold;
}

.grad-grey {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #777777;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#bbbbbb), to(#777777));
	background-image: -webkit-linear-gradient(top, #bbbbbb, #777777);
	background-image: -moz-linear-gradient(top, #bbbbbb, #777777);
	background-image: -ms-linear-gradient(top, #bbbbbb, #777777);
	background-image: -o-linear-gradient(top, #bbbbbb, #777777);
	line-height: 50px;
	text-align: center;
}

.grad-blue {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #2E64FE;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#2E64FE), to(#00BFFF));
	background-image: -webkit-linear-gradient(top, #2E64FE, #00BFFF);
	background-image: -moz-linear-gradient(top, #2E64FE, #00BFFF);
	background-image: -ms-linear-gradient(top, #2E64FE, #00BFFF);
	background-image: -o-linear-gradient(top, #2E64FE, #00BFFF);
	line-height: 50px;
	text-align: center;
}

.grad-orange {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #FFBF00;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFBF00), to(#FF8000));
	background-image: -webkit-linear-gradient(top, #FFBF00,#FF8000);
	background-image: -moz-linear-gradient(top, #FFBF00,#FF8000);
	background-image: -ms-linear-gradient(top, #FFBF00,#FF8000);
	background-image: -o-linear-gradient(top, #FFBF00,#FF8000);
	line-height: 50px;
	text-align: center;
}

.grad-green {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #04B404;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#04B404), to(#0B610B));
	background-image: -webkit-linear-gradient(top, #04B404,#0B610B);
	background-image: -moz-linear-gradient(top, #04B404,#0B610B);
	background-image: -ms-linear-gradient(top, #04B404,#0B610B);
	background-image: -o-linear-gradient(top, #04B404,#0B610B);
	line-height: 50px;
	text-align: center;
}

.grad-black {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #000000;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#000000), to(#151515));
	background-image: -webkit-linear-gradient(top, #000000,#151515);
	background-image: -moz-linear-gradient(top, #000000,#151515);
	background-image: -ms-linear-gradient(top, #000000,#151515);
	background-image: -o-linear-gradient(top, #000000,#151515);
	line-height: 50px;
	text-align: center;
}

.grad-red {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: #DF0101;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DF0101), to(#FE2E2E));
	background-image: -webkit-linear-gradient(top, #DF0101,#FE2E2E);
	background-image: -moz-linear-gradient(top, #DF0101,#FE2E2E);
	background-image: -ms-linear-gradient(top, #DF0101,#FE2E2E);
	background-image: -o-linear-gradient(top, #DF0101,#FE2E2E);
	line-height: 50px;
	text-align: center;
}

.grad-transparent {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	background-color: transparent;
	border: 1px solid gainsboro;
	line-height: 50px;
	text-align: center;
}

.grad-text {
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	max-height: 50px;
	max-width: 50px;
}

/* ===============================================
# CUSTOM STYLES
==================================================  */


/* USED FOR PAGE HEADINGS */
.main-page-header {
	margin-top: 15px;
	margin-bottom: 15px;
	padding-bottom: 5px;
	border-bottom: 1px dotted #ddd;
	font-weight: 500;
	font-size: 18px;
	text-transform: uppercase;
	display: flex;
}

.main-page-header .sub-item {
	text-transform: none;
	font-weight: normal;
	font-size: 12px;
	color: #333;
}

.section-page-header {
	margin-top: 0px;
	margin-bottom: 4px;
	padding-bottom: 2px;
	border-bottom: 1px dotted #ddd;
	font-weight: 500;
	font-size: 17px;
	text-transform: uppercase;
}

/* Heading content within a f-content container */
.section-heading {
	font-weight: bold;
	font-size: 13px;
}

/* DEFINES FORMAT FOR SUMMARY CONTENT DISPLAY */
.label-heading {
	font-size: 13px;
	font-weight: bold;
	color: #3C763D;
}

.label-heading-large {
	font-size: 16px;
	font-weight: bold;
	color: #3C763D;
}

/* CUSTOM BADGE CONTENT */
.badge-number {
	color: #3071a9;
	font-weight: bold;
	background-color: #ff9043;
}

.badge-light {
	color: #3C763D;
	background-color: #DFF0D8;
}

.badge > a {
	color: #fff;
}


/* SEPARATOR FOR INPUT CONTENT */
.separator {
	color: #2A6496;
	margin-left: 8px;
	margin-right: 8px;
}

/* USE HOVER OVER EFFECT TO EMPHASIS SELECTABILITY */
.hover-effect:hover {
	cursor: pointer;
}

tbody > tr.hover-effect:hover > td, tbody > tr.hover-effect:hover > th {
	background-color: #D2F2FF;
}

tbody > tr > td.hover-effect:hover {
	background-color: #D2F2FF;
}

.default-color {
	color: #333;
}

.hover-color {
	color: #2A6496;
}

/* Sets disable style */
.disabled-block {
	/*cursor: not-allowed;*/
	background-color: #EEE;
	/*opacity: 0.7;*/ /* Creates unselected effect */
	/*border-radius: 4px;
    padding-left: 10px;
    padding-right: 10px;*/
}

.label-btn-grp label {
	min-width: 100px;
}

.cl-icon {
	font-size: 20px;
	position: relative;
	top: -30px;
	margin-bottom: -100px;
}

.fadeout {
    opacity: 0.4;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
}

/* ===============================================
# GFM Tabs
==================================================  */

.gfm-tabs > li.active > a {
	background-color: #337ab7 !important;
	color: #fff !important;
}

.gfm-tabs > li > a {
	background-color: #e3e3e3;
}


/* ===============================================
# GFM Filter Box
==================================================  */

/* filter box */
.gfm-filter-box {
	border: 1px solid #468847;
	border-radius: 4px;
	background-color: #DFF0D8;
	padding-top: 4px;
	padding-bottom: 4px;
	padding-right: 4px;
	padding-left: 4px;
	margin-left: 4px;
	margin-right: 4px;
	display: inline-block;
}

	.gfm-filter-box.form-inline {
		display: flex;
		flex-direction: row;
	}

		.gfm-filter-box.form-inline > .form-group {
			display: flex;
			flex-direction: row;
		}

	.gfm-filter-box > label,
	.gfm-filter-box > div > label {
		white-space: nowrap;
		margin-top: 6px;
		margin-right: 6px;
		min-width: 40px;
	}

span.gfm-filter-box {
	position: relative;
	top: 4px;
	margin-left: 0px;
	margin-right: 0px;
}

.gfm-filter-textbox {
	padding: 2px 0.3em;
	border-color: #c5c5c5;
	border-radius: 4px;
	margin-bottom: 1px;
	margin-right: 2px;
	height: 20px;
	line-height: 20px;
	font-size: 12px;
}

[disabled].gfm-filter-select,
.gfm-filter-select {
	padding: 2px 0.3em;
	border-color: #c5c5c5;
	border-radius: 4px;
	margin-bottom: 1px;
	margin-right: 6px;
	height: 20px;
	line-height: 20px;
	font-size: 12px;
}

.gfm-filter-checkbox {
	margin: 8px 4px 6px 1px !important;
}

.gfm-filter-box .gfm-filter-checkbox {
	position: relative;
	top: -2px;
}

.gfm-filter-box-xs {
	border: 1px solid #468847;
	border-radius: 4px;
	background-color: #DFF0D8;
	padding: 3px 6px;
	font-size: 8pt;
}

.gfm-filter-box-spacer {
	padding-left: 15px;
	background-color: #5cb85c;
	color: #fff;
}

/* ===============================================
# GFM DDL
==================================================  */

.f-ddl {
	border-radius: 3px;
	padding: 1px 5px;
	border: 1px solid #333;
	position: relative;
	top: 1px;
}

/* ===============================================
# GFM TABLE
==================================================  */

/* DEFINES FORMAT FOR TABLE DISPLAY */
.gfm-table {
	width: 97%;
	/*border: 1px solid #aaa;*/
	margin: 10px 5px 30px 0px;
}

	.gfm-table > thead > tr.plain > th,
	.gfm-table > thead > tr.plain > td {
		background-color: transparent;
		border: none !important;
	}

	.gfm-table > thead > tr > th,
	.gfm-table > thead > tr > td {
		background-color: #d9edf7;
		border-top: 1px solid #428bca;
		border-bottom: 1px solid #428bca;
	}

	.gfm-table > tbody > tr > td:first-child {
		width: 40%;
		font-size: 11px !important;
		/*color: #3C763D;*/
	}

	.gfm-table > thead > tr > th + th,
	.gfm-table > tbody > tr > th + th,
	.gfm-table > tbody > tr > td + td {
		width: 20%;
		text-align: right;
		white-space: nowrap;
		padding: 4px;
	}

	.gfm-table > tbody > tr.alt {
		background-color: #D2F2FF;
	}

	.gfm-table .label {
		padding: 8px;
	}

table > tbody > tr.spacer > td {
	background-color: #DBE5F1 !important;
	line-height: 2px;
	height: 2px;
}

table > tbody > tr.spacer {
	background-color: #DBE5F1 !important;
	line-height: 2px;
	height: 2px;
}

table > tbody > tr.disabled > td {
	background-color: #d9d9d9 !important;
}
table > tbody > tr.disabled > td > i {
	opacity: 0.4;
}
table > tbody > tr.disabled > td.ignore {
	background-color: #fff !important;
	opacity: 1 !important;
}
table > tbody > tr.disabled > td.ignore > i {
	opacity: 1 !important;
}

.division-table > tbody > tr > td > span.fa {
	position: relative;
	top: 1px;
	font-size: 13px;
}

.table-link-confirm {
	margin-bottom: 0px;
}

.table-link-confirm > thead > tr > th {
	background-color: #e5e5e5;
}

.table-link-confirm > tbody > tr > td:first-child {
	width: 20%;
}

.table-link-confirm > tbody > tr > td {
	padding: 5px;
}

.gfm-table-extra-row-height tbody > tr > td {
	height: 60px;
	line-height: 20px;
}

.table > tbody > tr.nobordertop > td {
	border-top: none;
}


/* ===============================================
# CHART BASED STYLES
==================================================  */

h5 .chart-header {
	font-size: 16px;
}

/* Donut inner text */
.donut-inner-label {
	position: relative;
	color: #3265cb; /*#323a45 */
}

	.donut-inner-label.value {
		top: -180px;
		left: 90px;
		width: 120px;
		font-size: 36px;
	}

	.donut-inner-label.text {
		top: -190px;
		left: 130px;
		width: 100px;
		font-size: 14px;
	}

.chart-legend-block {
	position: relative;
	float: left;
	/*top: -285px;*/
	top: -64px;
	left: 452px;
	/*background-color: #f0b3b3;*/
	background-color: #f5cccc;
	border-top: 1px solid #76c076;
	width: 115px;
	height: 25px;
}

	.chart-legend-block > div {
		padding: 5px;
		font: 9px Arial,Helvetica,sans-serif;
		margin-left: auto;
		margin-right: auto;
		width: 98px;
	}

.chart-square {
	height: 10px;
	width: 10px;
	display: inline-block;
}

.chart-bgcolor-lightgreen {
	background: #90cc38 !important;
}

.chart-bgcolor-darkgreen {
	background-color: #5f9f80 !important;
}

.chart-bgcolor-darkblue {
	background-color: #0769be !important;
}

.chart-bgcolor-lightblue {
	background-color: rgb(0, 173, 241) !important;
}

.chart-bgcolor-yellow {
	background-color: #EEEE00 !important;
}

.chart-bgcolor-orange {
	background-color: rgb(255, 137, 42) !important;
}

.chart-bgcolor-red {
	background-color: rgb(221, 90, 67) !important;
}

/* ===============================================
# BREADCRUMB STYLES
==================================================  */

.f-breabcrumb {
	font-weight: bold;
}

	.f-breabcrumb > .btn {
		font-size: 11px;
		margin-bottom: 5px;
	}

/* ===============================================
# PANEL STYLES
==================================================  */

.f-panel > .f-header {
	color: #fff;
	padding-bottom: 5px;
	/*border-bottom: 1px solid #9A5DA1;*/
	border-bottom: 1px solid #428bca;
	padding-top: 5px;
	padding-left: 0px;
}

	.f-panel > .f-header.header-dropdown {
		color: #fff;
		padding-bottom: 0px;
		/*border-bottom: 1px solid #9A5DA1;*/
		border-bottom: 1px solid #428bca;
		padding-top: 0px;
		padding-left: 0px;
	}

	.f-panel > .f-header > span {
		position: relative;
		font-size: 13px;
		padding: 7px 15px;
		background-color: #428bca; /* SITE COLOUR */
		/*background-color: #9A5DA1;*/
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
	}

	.f-panel > .f-header.header-dropdown > div.dropdown {
		position: relative;
		display: inline-block;
		font-size: 13px;
		padding: 4px 15px;
		background-color: #428bca; /* SITE COLOUR */
		/*background-color: #9A5DA1;*/
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
	}

		.f-panel > .f-header.header-dropdown > div.dropdown > button {
			font-size: 13px;
			padding: 0px;
			border-radius: 0px;
			/*border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;*/
			background-color: #428BCA;
			border-color: #428BCA;
		}

	.f-panel > .f-header > div.legendkey {
		display: inline;
		font-size: 11px;
		color: #333;
		padding: 2px 8px;
	}

		.f-panel > .f-header > div.legendkey > i {
			font-size: 1em;
			position: relative;
			top: -2px;
		}


	.f-panel > .f-header > div.iconbar {
		display: inline;
		font-size: 13px;
		padding: 2px 8px;
	}

		.f-panel > .f-header > div.iconbar > a {
			padding: 0px 2px;
			cursor: pointer;
			outline: none;
		}

	.f-panel > .f-header > div.switch {
		bottom: 3px;
		position: relative;
		float: right;
	}

	/* DEFINES NAV TABS F-HEADER */
	.f-panel > .f-header > .nav-tabs {
		border-bottom-color: #428bca;
	}

		.modal-body > .f-panel > .f-header > .nav-tabs > li > a,
		.f-panel > .f-header > .nav-tabs > li > a {
			font-size: 13px;
			padding: 5px 14px;
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
			border-bottom-left-radius: 0px;
			border-bottom-right-radius: 0px;
			/*cursor: default; */
		}

		.f-panel > .f-header > .nav-tabs > li.active > a {
			color: #fff;
			background-color: #428BCA;
			border: 1px solid #428BCA;
			border-bottom-color: transparent;
		}

		.f-panel > .f-header > .nav-tabs > li > div.info {
			color: #333;
			padding: 8px 15px;
			font-size: 13px;
		}

.modal-body > .f-panel > .f-header > .nav-tabs > li {
	margin-bottom: 0px;
	border-bottom: none;
}

.f-panel .f-header .modal {
	color: #333;
}

/* F-CONTENT */
.f-panel > .f-content {
	padding: 5px 10px 0px 20px;
	/*border-bottom: 1px solid #9A5DA1;*/
	border-bottom: 1px solid #428bca;
	/*box-shadow: 0px 0px 5px 0px #428bca;*/
}

/* ===============================================
# GRID STYLES
==================================================  */

.f-grid table > tbody > tr:hover > td,
.f-grid table > tbody > tr > th:hover {
	background-color: #D2F2FF;
}

.f-grid-hover table > tbody > tr:hover > td,
.f-grid-hover table > tbody > tr:hover > th {
	background-color: #D2F2FF;
	cursor: pointer;
}

tr:hover.f-row-hover > td,
tr:hover.f-row-hover > th {
	background-color: #D2F2FF;
	cursor: pointer;
}


/* ===============================================
# GRID FILTERS
==================================================  */

.f-filter-header a {
	background-color: #5cb85c;
	color: #fff;
	font-size: 11px;
	font-weight: normal;
	text-decoration: none;
	padding: 3px 18px;
	z-index: 10;
}

.f-filter-content {
	padding: 5px;
	background-color: #efefef;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

	.f-filter-content .detail {
		padding: 3px;
		background-color: #d2f2ff;
		border: 1px solid #5cb85c;
		border-radius: 4px;
	}

	/* FILTER TABLE STYLES*/
	.f-filter-content table {
		margin-bottom: 0px;
	}

		.f-filter-content table > tbody > tr > td.filter-label {
			width: 100px;
			white-space: nowrap;
			border-right: 1px solid #428BCA;
		}

		/* SET LABEL DISPLAY STYLE */
		.f-filter-content table > tbody > tr > td > label {
			margin-bottom: 2px;
		}

/*===============================================
    # Seach controls
================================================= */

.search-well {
	background-color: #58b9ea;
	padding-top: 0px;
	padding-bottom: 5px;
	min-height: 0px;
}

.search-control {
	line-height: 30px !important;
	height: 30px !important;
}

.search-control-sm {
	line-height: 28px !important;
	height: 28px !important;
	font-size: 12px;
}

/* ===============================================
#  BUTTON - GROUP STYLE
==================================================  */

.btn-default.selltype.active {
	color: #fff;
	background-color: #5cb85c;
	border-color: #4cae4c;
}

	.btn-default.selltype.active:hover {
		color: #fff;
		background-color: #449d44;
		border-color: #398439;
	}

/* ===============================================
# RADIO BUTTON - GROUP STYLE
==================================================  */

/* Used in conjunction with bootstrap btn to create button toggle effect */
.f-radiogroup input[type="radio"] {
	display: none;
}

.f-radiogroup label {
	color: #3071a9;
	/*margin-bottom: 0px;*/
}

	.f-radiogroup label:hover,
	.f-radiogroup input[type="radio"]:checked + label {
		color: #fff;
		background-color: #5cb85c;
		border: 1px solid #666;
	}

.f-radiogroup .f-group-btn {
	padding: 3px 7px;
	border: 1px solid #5bc0de;
	border-radius: 4px;
}


/* ===============================================
# MENU STYLES
==================================================  */

.indent {
	padding-left: 20px !important;
}

.emphasise {
	font-weight: bold;
}

ul.dropdown-menu > li.selected > a,
ul.dropdown-menu > li.selected > a:hover,
ul.dropdown-menu > li.selected > a:focus {
	background-color: #489229;
	border-color: #489229;
	color: #ffffff;
}

/* ===============================================
# ANALYSIS CHART SPECIFIC
================================================== */


.table-tooltip {
	min-width: 180px !important;
	margin-bottom: 0px !important;
	background-color: transparent !important;
	font-size: 11px;
	text-align: left;
	color: #333;
}

	.table-tooltip thead tr th {
		/*text-align: center;*/
		padding-bottom: 4px;
		padding-top: 4px;
		border-bottom: 2px solid #428bca;
	}

	.table-tooltip tbody tr td {
		border: none !important;
		padding-top: 2px;
		padding-bottom: 2px;
	}

		.table-tooltip tbody tr td:first-child {
			width: 10px;
		}


	.table-tooltip tfoot tr td {
		border-top: solid;
		border-top-color: #ddd;
		border-width: 2px;
		font-weight: bold;
	}

/*================================================
# Animate loading section
=================================================*/

.loading {
	opacity: 0.2;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 0.5s ease;
}

.loading-complete {
	opacity: 1;
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 0.5s ease;
}

/* ===============================================
# TRANSITIONS
================================================== */
tbody > tr.tr-normal > td {
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 0.5s ease;
}

tbody > tr.tr-unemphasis > td {
	background-color: #fff !important;
	color: #bebaba;
	/*font-size: 10px;*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

tbody > tr.tr-emphasis > td {
	background-color: #D2F2FF !important;
	/*font-size: 11px;*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

tbody > tr.tr-emphasis-title > td {
	font-weight: bold;
	background-color: #f5f5f5;
	/*font-size: 11px;*/
	-webkit-transition: all 1s ease;
	-moz-transition: all 1s ease;
	-o-transition: all 1s ease;
	-ms-transition: all 1s ease;
	transition: all 1s ease;
}

tbody > tr.tr-emphasis-title.hover-effect:hover > td {
	background-color: #b7d7e2 !important;
}

tbody > tr.tr-emphasis.hover-effect:hover > td {
	background-color: #b7d7e2 !important;
}

.menu-right {
	float: right;
}

	.menu-right .filteringtab a {
		max-width: 250px;
		overflow: hidden;
		text-overflow: ellipsis;
	}

/* ===============================================
# Filtering Styles
================================================== */

ul.nav > li > a.filtering-on {
	border-color: #e66000 !important;
	background-color: #fff !important;
	color: #e66000 !important;
}

a.filtering-on,
span.filtering-on,
ul.nav > li.active > a.filtering-on {
	background-color: #e66000 !important;
	border-color: #e66000 !important;
	color: #fff !important;
}

a.filtering-off,
span.filtering-off {
	background-color: #428BCA !important;
	border-color: #428BCA !important;
	color: #fff !important;
}

/* ===============================================
# DASHBOARD SECTION
==================================================  */

.progress-bar-container {
	height: 90%;
	border: 1px solid lightgray;
	padding: 15px;
	margin: 10px 0px 10px 25px;
}

.list-results {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

	.list-results li:after {
		content: "";
		display: block;
		clear: both;
		height: 3px;
		line-height: 0;
	}

	.list-results .k-progressbar {
		margin-bottom: 10px;
		width: 100%;
	}

.summary-section > div:first-child {
	width: 37%;
}

.summary-section > div {
	display: inline-block;
	padding: 10px 8px;
	margin: 10px 5px;
	border-radius: 4px;
}

.summary-section > .panel-box {
	color: #f1f1f1;
	width: 47% !important;
}

.summary-section > div.alert {
	width: 57%;
}

.summary-section > div > div {
	display: inline-block;
}

.summary-section .icon {
	font-size: 25px;
	color: #f2f2f2;
	width: 14%;
}

.summary-section .smaller {
	font-size: 18px;
}


.summary-section .headline {
	font-size: 14px;
	font-weight: bold;
	padding-right: 10px;
}

.summary-section .action:hover {
	color: #286090;
	cursor: pointer;
}


.summary-section.medium > div {
	padding: 5px 8px;
	margin: 8px 5px;
}

/* ===============================================
# Trigger SECTION
==================================================  */

/* TABLE TRIGGERS */
.table-triggers > tbody > tr > td:first-child {
	width: 5px;
	vertical-align: top;
	padding-top: 8px;
}

.table-triggers > tbody > tr > td:nth-child(2) {
	width: 25%;
}

.table-triggers > tbody > tr > td.icon {
	width: 5px;
	font-size: 20px;
	vertical-align: middle;
}

	.table-triggers > tbody > tr > td.icon .fa-stack-1x {
		top: -1px;
	}

.table-triggers > tbody > tr > th,
.table-triggers > tbody > tr > td {
	/*padding: 10px 5px !important;*/
	vertical-align: middle;
}

	.table-triggers > tbody > tr > td.progressbar-display {
		width: 40%;
	}

	.table-triggers > tbody > tr > td > div.progress {
		margin-bottom: 0px;
		border: 1px solid #999;
		height: 28px;
	}

	.table-triggers > tbody > tr > td > div.value {
		display: inline-block;
		padding: 6px;
		margin-bottom: 0;
		line-height: 1.42857143;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		-ms-touch-action: manipulation;
		touch-action: manipulation;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		border-radius: 4px;
		width: 100%;
		border-bottom: 1px solid #999;
		/*background-color: #5bc0de;*/
		color: #eee;
	}

.table-triggers div.stagevalue {
	border-radius: 4px;
}

.trigger-red {
	background-color: #c20000;
}

.trigger-orange {
	background-color: #ff7a00;
}

.trigger-green {
	background-color: #5cb85c;
}

.trigger-cell-block {
	color: #fff;
	margin-left: 3px;
	margin-right: 3px;
	padding-left: 3px;
	padding-right: 3px;
	border-radius: 2px;
	width: 100%;
	text-align: center;
}

	.trigger-cell-block:hover {
		cursor: pointer;
		background-color: #75D6FF;
	}

/* ===============================================
# ELIGIBILITY SECTION
==================================================  */
.alert-heading {
	padding-right: 0px;
	border-color: #3c763d;
	padding: 5px 0px !important;
}

.eligibilty-section-header {
	font-weight: bold;
	font-size: 14px;
	background-color: #5bc0de;
	color: #fff;
	padding: 8px 5px;
	margin-top: 10px;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
}

.table-eligibility {
	margin-top: 15px;
}

.table-eligibility.groupheading {
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
	padding-left: 15px;
}

.table-eligibility > tbody > tr.alt {
	background-color: #e6faff;
}

.table-eligibility > tfoot > tr.subtotal {
	background-color: #e6e6e6;
}


.table-eligibility > thead > tr.collapseRow:hover {
	color: #337ab7 !important;
}
.table-eligibility > thead > tr.collapseRow i {
	color: #337ab7 !important;
}

.table-eligibility > thead > tr > th,
.table-eligibility > tbody > tr > td,
.table-eligibility > tfoot > tr > td {
	vertical-align: middle;
}

.table-eligibility > thead > tr > th:first-child,
.table-eligibility > tbody > tr > td:first-child {
	width: 40%;
}

.table-eligibility > thead > tr > th + th,
.table-eligibility > tbody > tr > td + td,
.table-eligibility > tfoot > tr > th + th,
.table-eligibility > tfoot > tr > td + td {
	width: 10%;
	text-align: right;
	padding: 5px;
}

.table-eligibility > thead > tr > th .btn {
	min-width: 80px;
	padding-top: 4px;
	padding-bottom: 4px;
}

.table-eligibility > thead > tr > th.item,
.table-eligibility > tbody > tr > td.item,
.table-eligibility > tfoot > tr > th.item {
	padding-left: 25px;
}

.table-eligibility > thead > tr.subheading > td,
.table-eligibility > thead > tr.subheading > th {
	/*background-color: #ffb380;*/
	background-color: #ffc299;
}

.table-eligibility > thead > tr.subtotal > td,
.table-eligibility > thead > tr.subtotal > th {
	background-color: #8c8c8c;
	padding: 8px 5px;
	color: #fff;
}

.table-eligibility > thead > tr.total > td,
.table-eligibility > thead > tr.total > th {
	font-weight: bold;
	font-size: 14px;
	background-color: #4eb14e;
	color: #fff;
	padding: 8px 5px;
}

.table-eligibility > tbody > tr.subcategory > td {
	font-style: italic;
	color: #c7254e;
}

.table-eligibility > tbody > tr.subcategory > td:first-child {
	padding-left: 45px;
}

.table-eligibility > tbody > tr > td > span > i.fa-stack-1x {
	top: -1px;
}

.table-eligibility > tbody > tr > td > span > i.fa-chevron-down {
	left: -0.5px;
}

.table-eligibility-border > thead > tr > th {
	border-top: 1px solid #3c763d !important;
	border-bottom: 1px solid #3c763d !important;
	background-color: #dcdcdc;
}

.table-eligibility-selected {
	border: 2px solid #8cc46e;
}

.table-eligibility > tbody > tr.border-bottom > td {
	border-bottom: 1px solid #ddd;
}

tr.no-border-top td,
tr.no-border-top th {
	border-top: none !important;
}

tr.no-border-bottom td,
tr.no-border-bottom th {
	border-bottom: none !important;
}

.options-box {
	margin-top: 15px;
	margin-bottom: 15px;
	padding-bottom: 5px;
}

	.options-box > .icon {
		border-left: 1px solid darkgreen;
	}

/* ============================================
# Limit Tables
===============================================  */
.limit-table {
	border: #a6a6a6 1px solid;
}

.limit-table > thead > tr > th {
	background-color: #337ab7;
	color: #fff;
	border: #a6a6a6 1px solid;
}

.limit-table > tbody > tr > td {
	border: #a6a6a6 1px solid;
	min-height: 31px;
}

.limit-table tbody .form-control.input-sm {
	height: 20px;
	padding-top: 1px;
	padding-bottom: 1px;
}

.limit-table tbody select.form-control.input-sm {
	padding-top: 1px;
	padding-bottom: 1px;
}



/* ============================================
# Round Cornered Container
===============================================  */
.round-corner-container {
	height: 100%;
	margin: auto;
}

.round-corner-box {
	position: relative;
	top: 10%;
	margin: auto;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	width: 1000px;
	height: auto;
	min-height: 450px;
	background-color: #ffffff;
	border: 1px solid #999;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
	-webkit-background-clip: padding-box;
	-moz-background-clip: padding-box;
	background-clip: padding-box;
}

/* ============================================
# Search Form
===============================================  */
.search-box {
	padding: 15px;
	/*background-color: #ebdfec;*/
	background-color: #e4e4e4;
	border-radius: 4px;
	border: 1px solid #ccc;
	/*border: 1px solid #995da0;*/
}

	.search-box.result-showing {
		border-bottom-left-radius: 0px;
		border-bottom-right-radius: 0px;
	}

	.search-box .gfm-search-textbox {
		width: 350px;
	}

.modal input.input-sm {
	height: 30px;
	line-height: 1.5;
}

.modal select.input-sm {
	height: 30px;
	line-height: 30px;
}

/* ===============================================
# CALC WIZARD STYLES
==================================================  */

.vertical-alignment-helper {
	display: table;
	height: 100%;
	width: 100%;
}

.vertical-align-center {
	/* To center vertically */
	display: table-cell;
	vertical-align: middle;
}

.wizard {
	margin: 20px auto;
	background: #fff;
}

	.wizard .nav-tabs {
		position: relative;
		/*margin: 40px auto;*/
		margin-bottom: 0;
		border-bottom-color: #e0e0e0;
	}

	.wizard > div.wizard-inner {
		position: relative;
	}

.connecting-line {
	height: 2px;
	background: #e0e0e0;
	position: absolute;
	width: 70%;
	margin: 0 auto;
	left: 0;
	right: 0;
	top: 50%;
	z-index: 1;
}

span.round-tab {
	width: 70px;
	height: 70px;
	line-height: 70px;
	display: inline-block;
	border-radius: 100px;
	background: #fff;
	border: 2px solid #e0e0e0;
	z-index: 2;
	position: absolute;
	left: 0;
	text-align: center;
	font-size: 25px;
}

	span.round-tab i {
		color: #555555;
	}

	span.round-tab > span.fa-stack {
		margin-top: -15px;
	}

.wizard li.active span.round-tab {
	background: #fff;
	border: 2px solid #5bc0de;
}

	.wizard li.active span.round-tab i {
		color: #5bc0de;
	}

.wizard li.complete span.round-tab {
	background: #fff;
	border: 2px solid green;
}

	.wizard li.complete span.round-tab i {
		color: green;
	}

span.round-tab:hover {
	color: #333;
	border: 2px solid #333;
}

.wizard .nav-tabs > li:first-child:nth-last-child(2),
.wizard .nav-tabs > li:first-child:nth-last-child(2) ~ li {
	width: 50%;
}

.wizard .nav-tabs > li:first-child:nth-last-child(3),
.wizard .nav-tabs > li:first-child:nth-last-child(3) ~ li {
	width: 33%;
}

.wizard .nav-tabs > li:first-child:nth-last-child(4),
.wizard .nav-tabs > li:first-child:nth-last-child(4) ~ li {
	width: 25%;
}

.wizard .nav-tabs > li:first-child:nth-last-child(5),
.wizard .nav-tabs > li:first-child:nth-last-child(5) ~ li {
	width: 20%;
}

/*.wizard .nav-tabs > li {
    width: 20%;
}*/

.wizard li:after {
	content: " ";
	position: absolute;
	left: 41%;
	opacity: 0;
	margin: 0 auto;
	bottom: 0px;
	border: 5px solid transparent;
	border-bottom-color: #5bc0de;
	transition: 0.1s ease-in-out;
}

.wizard li.active:after {
	content: " ";
	position: absolute;
	left: 45%; /*44%;*/
	opacity: 1;
	margin: 0 auto;
	bottom: 0px;
	border: 10px solid transparent;
	border-bottom-color: #5bc0de;
}

.wizard.five-icons li.active:after {
	left: 41%;
}

.wizard.four-icons li.active:after {
	left: 44%;
}

.wizard .nav-tabs > li a {
	width: 70px;
	height: 70px;
	margin: 20px auto;
	border-radius: 100%;
	padding: 0;
	border: none;
}

	.wizard .nav-tabs > li a:hover {
		background: transparent;
	}

	.wizard .nav-tabs > li a i.fa-stack-1x {
		margin-top: 2px;
	}

	.wizard .nav-tabs > li a i.fa-cog {
		margin-top: 3px;
	}

.wizard .nav-tabs > li.active > a, .wizard .nav-tabs > li.active > a:hover, .wizard .nav-tabs > li.active > a:focus {
	color: #555555;
	cursor: default;
	border: 0;
	border-bottom-color: transparent;
}

.wizard .tab-pane {
	position: relative;
	padding-top: 50px;
}

.wizard h3 {
	margin-top: 0;
}


.wizard ul, ol {
	padding: 0px;
}

/****** WIZARD SMALL OVERRIDES */
.wizard-small {
	margin: 0px auto;
}

	.wizard-small span.round-tab {
		width: 55px;
		height: 55px;
		line-height: 55px;
		border-radius: 50px;
		font-size: 20px;
	}

	.wizard-small .nav-tabs > li a {
		width: 55px;
		height: 55px;
		margin: 10px auto;
	}

.wizard .nav-tabs > li a i.fa-stack-1x {
	margin-top: 1px;
}


.wizard-small .tab-pane {
	padding-top: 25px;
}

.wizard-small span.round-tab > span.fa-stack {
	margin-top: -12px;
}



/* ===============================================
# PDF Report table formatting
==================================================  */

.table-report > thead > tr > th,
.table-report > thead > tr > td {
	color: #FFF;
	background-color: #6f30a0 !important;
	border: 1px solid #6f30a0 !important;
	vertical-align: top;
}

.table-report > tbody > tr > td:first-child,
.table-report > tfoot > tr.section-footer > td:first-child {
    padding-left: 10px;
    white-space: nowrap;
}

.table-report > thead > tr > th + th,
.table-report > tbody > tr > td + td,
.table-report > tfoot > tr.section-footer > td + td {
    text-align: right;
    padding-right: 10px;
    width: 12%;
}

.table-report > tbody > tr > td { /* reduces the row height by reducing padding */
	padding-top: 3px;
	padding-bottom: 3px;
	border-top: 1px solid none;
	border-bottom: 1px solid none;
	border-left: 1px solid #6f30a0;
	border-right: 1px solid #6f30a0;
}

.table-report > tbody > tr > td.heading {
	text-decoration: underline;
}

.table-report > tbody > tr.spacer > td {
	background-color: #DBE5F1;
	line-height: 2px;
	height: 2px;
}

.table-report > tbody > tr.spacer-clear > td {
    background-color: #fff;
    line-height: 2px;
    height: 2px;
}

.table-report > tbody > tr.section-heading > td {
	color: #fff;
	background-color: #5B9BD5 !important;
	line-height: 10px;
	height: 10px;
}
.table-report > tbody > tr.section-subheading > td {
	text-decoration: underline;
	background-color: #DBE5F1 !important;
	line-height: 10px;
	height: 10px;
}

.table-report > tbody > tr.section-subtotal > td {
    font-weight: bold;
    margin-bottom: 10px;
    border-top: solid 2px #6f30a0;
    border-bottom: solid 2px #6f30a0;
}

.table-report > tbody > tr.pad-top-10 > td {
	padding-top: 8px;
}
.table-report > tbody > tr.pad-bottom-10 > td {
	padding-bottom: 8px;
}

.table-report > tfoot > tr > td,
.table-report > tfoot > tr > th {
    background-color: #6f30a0 !important;
    border: 1px solid #6f30a0 !important;
    line-height: 2px;
    height: 2px;
}

.table-report > tfoot > tr.section-footer > td {
    background-color: #6f30a0;
    border: 1px solid #6f30a0;
    color: #fff;
    line-height: 10px;
    height: initial;
    font-weight: bold;
}

/* Portfolio Table */

table.table-portfolio-report {
    margin-left: 70px;
    margin-right: 70px;
    width: initial;
    border: 1px solid #000000;
    font-size: 9px;
    width:645px;
}

table.table-portfolio-report th {
    color: #FFF !important;
    background-color: #6f30a0 !important;
    border: 1px solid #000 !important;
    vertical-align: top;
}

table.table-portfolio-report tfoot td.footer {
	background-color: #2f5596 !important;
	color: #fff !important;
}

.table.table-portfolio-report thead th:first-child,
.table.table-portfolio-report tbody td:first-child {
    white-space: nowrap;
}

table.table-portfolio-report tbody td:first-child {
    padding-right: 20px;
}

table.table-portfolio-report tbody td {
    padding-top: 1px !important;
    padding-bottom: 1px !important;
    border: none !important;
}

table.table-portfolio-report tbody td:not(:first-child),
table.table-portfolio-report tfoot td:not(:first-child),
table.table-portfolio-report thead th:not(:first-child) {
    border-left: 1px solid #000 !important;
    text-align: right;
}

table.table-portfolio-report tbody tr.table-section {
    line-height: 10px;
    height: 10px;
}

table.table-portfolio-report tbody tr.table-section td {
    color: #fff !important;
    background-color: #5B9BD5 !important;
    font-weight: bold;
}

table.table-portfolio-report tfoot tr.section-footer td {
    color: #FFF !important;
    background-color: #6f30a0 !important;
    font-weight: bold;
    border-top: none;
}

table.table-portfolio-report tbody tr td.table-underline {
    text-decoration: underline;
}

table.table-portfolio-report tbody tr td.table-bold {
    font-weight: bold;
}

table.table-portfolio-report tbody tr.table-line td {
    font-size: 5px;
    border-top: solid 1px #000 !important;
}

table.table-portfolio-report tbody tr.table-line-bottom td {
    font-size: 5px;
    border-bottom: solid 1px #000 !important;
}

table.table-portfolio-report tbody tr.table-spacer td {
    font-size: 5px;
}

table.table-portfolio-report tfoot tr.table-spacer td {
    font-size: 6px;
    background-color: #6f30a0 !important;
    border-top: none;
    padding: 0px;
}

.table.table-portfolio-report tbody tr.section-subtotal td {
    border-top: 1px solid #000 !important;
    border-bottom: 1px solid #000 !important;
    font-weight: bold;
}

table.table-portfolio-report thead tr.sub-header th,
table.table-portfolio-report thead tr th.sub-header,
table.table-portfolio-report tbody tr td.sub-header {
	color: #fff !important;
	background-color: #5B9BD5 !important;
	font-weight: bold;
}

table.table.table-portfolio-report tbody tr td.border-top,
table.table.table-portfolio-report tfoot tr td.border-top {
	border-top: 1px solid #000 !important;
}

table.table.table-portfolio-report tbody tr td.border-bottom {
	border-bottom: 1px solid #000 !important;
}

table.table.table-portfolio-report tbody tr td.border-right {
	border-right: 1px solid #000 !important;
}

table.table.table-portfolio-report tbody tr td.border-left {
	border-left: 1px solid #000 !important;
}

table.table.table-portfolio-report tbody tr td.no-border-bottom {
	border-bottom: none;
}

table.table.table-portfolio-report tbody tr td.no-border-top {
	border-top: none;
}

/* Notes and Definitions Report Table Styles */
table.table.table-notes,
table.table.table-notes tr,
table.table.table-notes td {
    border: none;
}

table.table.table-notes {
    width: 710px;
    margin-left: 45px;
    margin-right: 45px;
    font-size: 13px;
    text-justify: inter-word;
    text-align: justify;
}

table.table.table-notes td:first-child {
    font-weight: bold;
    width: 200px;
}

/*.table-report-borrowing-base td:nth-child(1),
.table-report-borrowing-base td:nth-child(3) {
	color: #000;
}*/

.table-report-borrowing-base .table-subtable {
	background-color: #e6e6e6;
	color: #15365c;
}

.table-report-borrowing-base {
	/*border: 1px solid #666 !important;*/
	margin-bottom: 0px;
	margin-top: 0px;
}

/*.table-report-borrowing-base > tbody > tr.subtotal > td {
	border-top: 1px solid #666 !important;
}*/

.table-report-borrowing-base > thead > tr > th {
	color: #333;
	font-weight: 700;
	background-color: #b3b3b3;
	/*border: 1px solid #666 !important;*/
	/*border: none !important;*/
}

.table-report-borrowing-base > tbody > tr > td {
	border: 1px solid #ddd !important;
}

.table-report-borrowing-base > tbody > tr > td:first-child {
	border-left: 1px solid #000 !important;
}

.table-report-borrowing-base > tbody > tr > td:last-child {
	border-right: 1px solid #000 !important;
}

.table-report-borrowing-base > tbody > tr > td.spacer-borrowing-base {
	border-left: 1px solid #000 !important;
	border-right: 1px solid #000 !important;
}

.table-report-borrowing-base > tfoot > tr > th {
	border: 1px solid #000 !important;
}

.table-report-borrowing-base > tbody > tr:last-child > td {
	border-bottom-color: #000 !important;
}

.table-report-borrowing-base > thead > tr > th {
	border: 1px solid #000 !important;
}

.table-report-borrowing-base > thead > tr > th:first-child {
	border-right: none !important;
}
	
.table-report-borrowing-base > thead > tr > th:last-child {
	border-left: none !important;
}

.table-report-borrowing-base thead > tr > th.force-border,
.table-report-borrowing-base tbody > tr > td.force-border,
.table-report-borrowing-base tfoot > tr > th.force-border {
	border: 1px solid #000 !important;
}

	/*.table-report-borrowing-base > tbody > tr > td {
	border-left: 1px solid #666 !important;
	border-right: 1px solid #666 !important;
}*/
	/*.table-report-borrowing-base > tfoot > tr > th {
	border: 1px solid #666 !important;
}*/
	.table-report-borrowing-base > tbody > tr > td + td,
	.table-report-borrowing-base > tfoot > tr > th + th {
		/*border-left: 1px solid rgb(221,221,221);*/
		width: 15%;
		text-align: left;
	}

.table-report-borrowing-base > tbody > tr.alt > td {
	background-color: #fff !important;
}

.table-report-borrowing-base > tbody > tr.alt > td {
	background-color: #efefef !important;
}

.table-report-borrowing-base > tfoot > tr.slim > th {
	padding: 4px;
	padding-left: 10px;
	font-weight: normal;
	padding-right: 8px;
}

.table-report-borrowing-base > tfoot > tr.shaded > th {
	background-color: #efefef !important;
	font-weight: bold;
	padding-right: 8px;
}

.table-report-borrowing-base > thead > tr.subheading > th {
	background-color: #e6e6e6 !important;
	/*border-bottom: solid 1px black;*/
	padding: 4px;
	padding-left: 10px;
}

/*.table-report-borrowing-base > thead > tr.subheading > th {
	border-right: none;
	border-left: none;
}*/

/*.table-report-borrowing-base > thead > tr.subheading > th:first-child {
	border-left: 1px solid rgb(221,221,221);
}

.table-report-borrowing-base > thead > tr.subheading > th:first-child {
	border-right: 1px solid rgb(221,221,221);
}*/

.table-report-borrowing-base > tbody > tr.highlight > td {
	padding: 4px;
	/*border-top: solid #666 1px !important;
	border-bottom: solid #666 1px !important;*/
	background-color: #efefef !important;
	font-weight: bold;
	padding-right: 8px;
	padding-left: 10px;
}

table > tbody > tr.spacer > td.spacer-borrowing-base {
	background-color: #fff !important;
	padding-bottom: 10px;
	padding-top: 10px;
}

table > tbody > tr.spacer.alt > td.spacer-borrowing-base {
	background-color: #efefef !important;
	padding-bottom: 10px;
	padding-top: 10px;
}

.table-report-overview-2 {
	background-color: #e6e6e6 !important;
	color: #15365c !important;
	border: 1px solid #000 !important;
}

.table-report-overview-2 td {
	border: none;
	background-color: #e6e6e6 !important;
}

/* ===============================================
# PDF TEXT FORMATTING
==================================================  */
.portfolio-report .section-header {
    font-size: 14px;
    font-weight: bold;
    padding-bottom:20px;
    padding-top:20px;
}

.portfolio-report .section-header-number {
    display: inline-block;
    min-width: 45px;
    text-decoration: none;
}

.portfolio-report .section-header-title {
    text-decoration: underline;
}

.portfolio-report .sub-section-header {
    font-size: 13px;
    font-weight: bold;
    padding-left: 45px;
    padding-bottom: 20px;
    padding-top: 20px;
}

.portfolio-report .sub-section-header-number {
    display:inline-block;
    min-width: 45px;
    text-decoration: none;
}

.portfolio-report .sub-section-header-title {
    text-decoration: underline;
}

.portfolio-report p,
.portfolio-report ul,
.portfolio-report ol,
.portfolio-report h1,
.portfolio-report h2,
.portfolio-report h3,
.portfolio-report h4,
.portfolio-report h5,
.portfolio-report h6
{
	padding-left: 45px;
	padding-right: 45px;
	text-justify: inter-word;
	text-align: justify;
	page-break-inside: avoid;
}

.portfolio-report p,
.portfolio-report ul,
.portfolio-report ol {
    font-size: 13px;
    /*padding-left: 45px;
    padding-right: 45px;
    text-justify: inter-word;
    text-align: justify;
    page-break-inside: avoid;*/
}

.portfolio-report ul,
.portfolio-report ol {
	padding-left: 80px;
}

/* ===============================================
# PDF CHART AND MAP FORMATTING
==================================================  */
.portfolio-report .world-map {
    margin-left: 70px;
    margin-right: 70px;
    padding: 3px;
    border: 1px solid #5b9bd5;
}

.chart-report-wrapper {
    margin-left: 70px;
    margin-right: 70px;
    border-right: 1px solid #6f30a0;
    border-left: 1px solid #6f30a0;
}

.chart-report-wrapper .print-header {
    color: #fff !important;
    background-color: #6f30a0 !important;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

.chart-report-wrapper .print-chart {
    
    padding-top: 5px;
    padding-bottom: 5px;
}

.chart-report-wrapper .print-block {
    padding-top: 5px;
    padding-bottom: 5px;
}

.chart-report-wrapper .print-legend-item {
    padding: 5px;
}

.chart-report-wrapper .print-legend {
    border-top: 1px solid #6f30a0;
}

.chart-report-wrapper .print-legend-item-border {
    /*border: 1px solid #6f30a0;*/
    margin: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
}

/*.chart-report-wrapper .print-legend {
    border-left: 1px solid #6f30a0;
    border-right: 1px solid #6f30a0;
}*/

.chart-report-wrapper .print-footer {
    border-bottom: 10px solid #6f30a0;
}

.chart-report-wrapper .print-footer-content {
    background-color: #6f30a0 !important;
    color: #fff;
    padding: 5px;
}

.key-indicator-section-right,
.key-indicator-section-left {
    width: 50%;
    position: relative;
}

.key-indicator-section-right {
    float: right;
    padding-right: 60px;
}

.key-indicator-section-left {
    float: left;
    padding-left: 60px;
}

.key-indicator-content {
    border: solid 1px;
    height: 260px;
}

.key-indicator-section-left .key-indicator-content {
    border-right: none !important;
}

.key-indicator-header-purple,
.key-indicator-header-blue {
    color: #fff !important;
    padding: 2px 5px;
    font-weight: bold;
    text-align: center !important;
}

.key-indicator-header-purple {
    background-color: #6f30a0 !important;
}

.key-indicator-header-blue {
    background-color: #5b9bd5 !important;
}

.key-indicator-legend {
    border-top: solid 1px;
    padding: 2px 0px;
}

.key-indicator-legend-item {
    padding: 5px;
}

.key-indicator-table {
    width: calc(100% - 20px);
    margin: 10px;
}



.key-indicator-table tbody tr td:first-child {
    border: solid 1px #000;
    padding: 10px;
}

.key-indicator-table tbody tr td:nth-child(2) {
    border: solid 1px #000;
    width: 130px;
    padding: 10px;
    text-align: right !important;
    height: 47px;
}

.key-indicator-table-spacer {
    padding: 0px !important;
    margin: 0px;
    border: solid 1px #000;
    height: 10px;
    width: 100%;
}

.key-indicator-table td.trigger-status {
	vertical-align: middle;
}

.key-indicator-table td.trigger-status span.progress {
	display: block;
	vertical-align: middle;
	margin-bottom: 0px;
	background-color: #f5f5f5 !important;
}

.key-indicator-table td.trigger-status span.progress .progress-bar-success {
	background-color: #5cb85c !important;
}

.key-indicator-table td.trigger-status span.progress .progress-bar-warning {
	background-color: #f0ad4e !important;
}

.key-indicator-table td.trigger-status span.progress .progress-bar-danger {
	background-color: #d9534f !important;
}


/* ===============================================
# MANUAL UPLOAD OVERVIEW FORMATTING
==================================================  */

		.breakdown-table-html {
	overflow-y: auto;
}

	.breakdown-table-html table.table-condensed.scrollable {
		border-collapse: separate;
	}

		.breakdown-table-html table.table-condensed.scrollable tr:first-child td {
			border-top: none;
		}

	.breakdown-table-html table.scrollable thead {
		position: sticky;
		top: 0;
		z-index: 1;
	}

	.breakdown-table-html table.scrollable tfoot {
		position: sticky;
		bottom: 0;
		z-index: 1;
	}

	.breakdown-table-html.mu-queue {
		max-height: 200px;
	}

.validation-model-seperator {
	border-bottom: 1px solid #428bca;
	margin: 20px 0px 15px 0px;
}

.validation-table {
	border: 1px solid #428BCA;
}

	.validation-table > tbody > tr:nth-child(even) {
		background-color: #f5f5f5;
	}

.mu-queue-table thead {
	background-color: white;
}

.mu-queue-table tbody > tr > td:hover {
	cursor: pointer;
}

.mu-current-table thead th:first-child,
.mu-current-table thead th:last-child {
	width: 100px;
}

.section-table table {
	margin: 0px;
	table-layout: fixed;
}

.validation-modal-section table tr {
	background-color: lightgrey;
	border-bottom: 1px solid white;
}

	.validation-modal-section table tr:nth-child(even) {
		background-color: darkgrey;
	}

.validation-modal-section table th {
	background-color: grey;
	font-weight: bold;
	font-size: 12px;
	color: white;
}

.validation-modal-section table.bordered th:not(:last-child),
.validation-modal-section table.bordered td:not(:last-child) {
	border-right: 1px solid white;
}

.indicator-group {
	flex: 1;
	display: flex;
	justify-content: flex-end;
}

	.indicator-group > div {
		margin-right: 5px;
	}


.divMuIndicator {
	cursor: pointer;
	text-align: center;
}

.file-upload-table {
	margin-left: 20px;
}

	.file-upload-table tr > td:first-child {
		width: 150px;
	}


/* ===============================================
# MEDIA SPECIFIC
==================================================  */
/* First we set all styles below set screen size */
/* More specific settings are applied afterwards */
@media (max-width: 1299px) {
    .login-box h2 {
                font-size: 20px;
            }

            .login-entry-box a {
                font-size: 11px;
            }

            .login-intro-heading {
                font-size: 34px !important;
            }

            /* Key indicator changes*/
            .col-ki {
                padding-right: 5px;
                padding-left: 5px;
            }

            .infobox {
                padding-left: 5px;
            }

                .infobox > .infobox-data {
                    font-size: 11px;
                    padding-left: 2px;
                }

                .infobox > .infobox-icon {
                    width: 40px;
                }

            .grad-text {
                font-size: 14px;
                max-height: 40px;
                max-width: 40px;
            }

                .grad-text > span,
                .grad-text > i {
                    position: relative;
                    top: -5px;
                }

            .chart-legend-block {
                left: 307px;
            }


            /**** Dashboard Overrides ****/
            .donut-inner-label.value {
                top: -155px;
                left: 70px;
            }

            .donut-inner-label.text {
                top: -165px;
                left: 110px;
            }

            .round-corner-box {
                width: 900px;
            }

            .res-Font {
                font-size: 12px;
            }

            .wizard li.active:after {
                left: 44%; /*44%;*/
            }

			.summary-section > div {
				margin-left: 2px;
				padding: 10px 3px;
			}

			.summary-section > .panel-box {
				width: 48% !important;
			}
        }

        @media (max-width: 1197px) {

            /* Key indicator */
            .infobox .infobox-content {
                font-size: 13px;
            }

            /* login message */
            .login-messagebox {
                font-size: 12px;
            }

            /* content headings */
            .section-heading {
                font-size: 12px;
            }

            .label-heading-large {
                font-size: 12px;
            }

            .round-corner-box {
                width: 800px;
            }

            /* F-CONTENT */
            .f-panel > .f-header > span {
                font-size: 12px;
            }

            .f-panel > .f-header > .nav-tabs > li > a {
                font-size: 12px;
            }

            .f-panel > .f-header > .nav-tabs > li > div.info {
                font-size: 12px;
            }

            .f-panel > .f-content {
                padding: 5px 10px 0px 5px;
            }

            /**** Dashboard Overrides ****/
            .donut-inner-label.value {
                top: -130px;
                left: 40px;
                font-size: 25px;
            }

            .donut-inner-label.text {
                top: -138px;
                left: 60px;
                font-size: 12px;
            }

            .donut-inner-label.value {
                top: -130px;
                left: 40px;
                font-size: 25px;
            }

            .donut-inner-label.text {
                top: -137px;
                left: 60px;
                font-size: 12px;
            }

            .summary-section .headline {
                font-size: 12px;
            }

            .table-triggers > tbody > tr > td:nth-child(2) .small {
                font-size: 9px;
            }

            .gfm-filter-box.form-inline {
                display: inline-block;
            }

                .gfm-filter-box.form-inline > label {
                    white-space: nowrap;
                    padding-right: 6px;
                }

                .gfm-filter-box.form-inline > .form-group {
                    display: inline-block;
                    flex-direction: row;
                }

            .gfm-filter-checkbox {
                position: relative;
                top: 2px;
            }

            .gfm-filter-box .gfm-filter-checkbox {
                position: relative;
                top: 2px;
            }

            [disabled].gfm-filter-select,
            .gfm-filter-select {
                font-size: 11px;
            }


            .summary-section .headline {
                font-size: 12px;
            }

            .summary-section .icon {
                font-size: 20px;
            }

            .table-triggers > tbody > tr > td:nth-child(2) .small {
                font-size: 9px;
            }

            .label-btn-grp label {
                min-width: 90px;
            }

            .res-Font {
                font-size: 12px;
            }

            .wizard li.active:after {
                left: 43%; /*44%;*/
            }
        }




        @media all and (max-width: 768px) {
            .menu-right {
                float: none;
            }

                .menu-right .filteringtab {
                    max-width: 100%;
                }

            .round-corner-box {
                width: 500px;
            }

            .gfm-filter-box {
                margin-top: 5px;
            }

            [disabled].gfm-filter-select,
            .gfm-filter-select {
                font-size: 11px;
            }

            span.gfm-filter-box {
                position: relative;
                top: 16px;
            }

            .gfm-filter-box.form-inline {
                display: inline-block;
            }

                .gfm-filter-box.form-inline > label {
                    white-space: nowrap;
                }

                .gfm-filter-box.form-inline > .form-group {
                    display: inline-block;
                    flex-direction: row;
                }

            .gfm-filter-checkbox {
                position: relative;
                top: 2px;
            }

            .gfm-filter-box .gfm-filter-checkbox {
                position: relative;
                top: 2px;
            }

            .search-box .gfm-search-textbox {
                width: 100%;
            }

            .res-Font {
                font-size: 12px;
            }

            .wizard li.active:after {
                left: 41%; /*44%;*/
            }
        }
        /* ===============================================
# Manual Upload
==================================================  */
        .muValidationResultsTable {
	width: 100%;
	margin-left: 2%;
}

.muValidationResultsTableHeaderRow {
	background-color: #E5E5E5;
}

.muIndentCell {
	padding-left: 25px !important;
}

.muAlignTextRight {
	text-align: right;
}

@keyframes pulsate {
	0% {
		opacity: 0;
	}

	25% {
		opacity: 0.25;
	}

	50% {
		opacity: 0.5;
	}

	75% {
		opacity: 0.75;
	}

	100% {
		opacity: 1;
	}
}


.pulsateIcon {
	animation-name: pulsate;
	animation-duration: 1s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}

.compliance-table {
	min-width: 400px;
	width: 70%;
	margin-left: 10%;
}

	.compliance-table td {
		padding-left: 10px;
		padding-right: 10px;
	}

@media (min-width: 0px) and (max-width: 1199px) {
	.compliance-table {
		/* Override the margin, forcing it to be centered rather than offset once the screen becomes small enough */
		margin: auto;
	}
}

.clickthrough {
	height: 25px;
	position: relative;
}

	.clickthrough > * {
		height: 25px;
		float: left;
	}

	.clickthrough .clickthrough-text > span {
		position: absolute;
		bottom: 3px;
		cursor: pointer;
		font-style: italic;
	}

.clickthrough-text,
.clickthrough-text:hover,
.clickthrough-text:visited {
	color: inherit;
}

.userSubscriptions .subscriptionGroup {
	margin: 0px;
}

	.userSubscriptions .subscriptionHeader th,
	.userSubscriptions .subscriptionGroup td {
		vertical-align: middle;
		width: 32px;
	}

		.userSubscriptions .subscriptionHeader th:first-child,
		.userSubscriptions .subscriptionGroup td:first-child {
			width: initial;
		}

		.userSubscriptions .subscriptionGroup td input[type='checkbox'],
		.userSubscriptions .subscriptionHeader i.fa {
			margin: 0 auto;
			display: block;
			text-align: center;
		}

#action-type-filter {
	max-height: 100px;
	overflow-y: auto;
	overflow-x: hidden;
	height: 85px;
	padding: 5px 25px 0px 25px;
	flex: 1;
}

	#action-type-filter label {
		flex: 1;
		word-break: break-word;
		display: flex;
		height: 100%;
		margin-top: 5px;
	}

	#action-type-filter > div.col-md-4 {
		display: flex;
		padding: 0px;
		height: 35px;
	}

.gfm-filter-box.col-sm-1 > .form-group
.gfm-filter-box.col-sm-2 > .form-group
.gfm-filter-box.col-sm-3 > .form-group
.gfm-filter-box.col-sm-4 > .form-group
.gfm-filter-box.col-sm-5 > .form-group
.gfm-filter-box.col-sm-6 > .form-group
.gfm-filter-box.col-sm-7 > .form-group
.gfm-filter-box.col-sm-8 > .form-group
.gfm-filter-box.col-sm-9 > .form-group
.gfm-filter-box.col-sm-10 > .form-group
.gfm-filter-box.col-sm-11 > .form-group
.gfm-filter-box.col-sm-12 > .form-group {
	justify-content: center;
	display: flex;
}

.validation-summary {
	display: none;
}

	.validation-summary.field-validation {
		display: block;
	}

.justification-uploader .control-label {
	font-weight: bold;
	background-color: #428BCA;
	color: #fff;
	border-radius: 4px 0px 0px 4px;
	border-color: #428BCA;
}

	.justification-uploader .control-label:hover {
		cursor: pointer;
		background-color: #286090;
	}

.justification-uploader .k-upload {
	border-radius: 0px 4px 4px 0px;
}

	.justification-uploader .k-upload .k-dropzone {
		padding: 0px;
	}


	.justification-uploader .k-upload .k-button {
		visibility: hidden;
		margin: 0px;
	}

		.justification-uploader .k-upload .k-button.k-upload-selected,
		.justification-uploader .k-upload .k-button.k-clear-selected {
			display: none !important;
		}

.justification-table {
	font-size: 12px;
}

	.justification-table tr.justification.deleted {
		text-decoration: line-through;
	}

	.justification-table tr.justification td.name {
		max-width: 200px;
	}

		.justification-table tr.justification td.name > div {
			overflow: hidden;
			text-overflow: ellipsis;
			color: inherit;
			cursor: pointer;
		}

	.justification-table tr.justification td.state > i {
		cursor: pointer;
	}

/* This class matches the padding the standard input box has to keep the elements inline*/
div .inputPadding {
	padding: 2px 0.3em;
	margin-left: 1px;
	/* This adds 1px padding to the top and bottom of the div, this forces the text to be inline */
	border: 1px solid transparent;
	border-left: 0px;
	border-right: 0px;
}

.textarea-container {
	position: relative;
}

	.textarea-container > div, .textarea-container > textarea {
		word-wrap: break-word; /* make sure the div and the textarea wrap words in the same way */
		box-sizing: border-box;
		padding: 2px;
		width: 100%;
	}

	.textarea-container > textarea {
		overflow: hidden;
		position: absolute;
		height: 100%;
	}

	.textarea-container > div {
		padding-bottom: 1.5em; /* A bit more than one additional line of text. */
		visibility: hidden;
		width: 100%;
	}

.js-timeline,
.js-tooltips {
	position: relative;
	width: inherit;
}

.js-timeline {
	background-color: darkgrey;
	display: flex;
	flex-flow: row nowrap; /* required */
	min-height: 10px;
	border-radius: 4px;
	min-height: 60px;
	overflow: hidden;
}

	.js-timeline > .js-layer,
	.js-tooltips > .js-segments-wrapper {
		box-sizing: border-box; /* required */
		width: 100%; /* required */
		flex: none; /* required */
		margin-left: -100%;
	}

		.js-timeline > .js-layer:first-child,
		.js-tooltips > .js-segments-wrapper {
			margin-left: unset;
		}

		.js-timeline > .js-layer,
		.js-timeline > .js-layer .js-segments-wrapper,
		.js-timeline > .js-layer > .js-progress-current,
		.js-timeline > .js-tooltips {
			height: inherit;
			width: inherit;
			float: left;
			overflow: hidden;
			position: relative;
		}

	.js-timeline > .js-overlay {
		z-index: 3;
	}

	.js-timeline > .js-progress {
		z-index: 2;
	}

		.js-timeline > .js-progress > .js-progress-current {
			display: flex;
			height: inherit;
		}

	.js-timeline > .js-ghost {
		z-index: 1;
	}

		.js-timeline > .js-ghost .js-segment {
			border-left: 1px solid white;
		}

			.js-timeline > .js-ghost .js-segment:first-child {
				border-left: none;
			}

	.js-timeline .js-segment {
		align-items: center;
		justify-content: center;
	}

		.js-timeline .js-segment > * {
			text-align: center;
			justify-content: center;
			align-items: center;
			font-size: 14px;
			font-weight: bold;
			color: #f1f1f1;
			padding: 10px;
		}


.js-segments-wrapper .js-segment {
	height: inherit;
	float: left;
	display: flex;
	flex-direction: column;
	position: relative;
}

	.js-segments-wrapper .js-segment > * {
		display: inline-flex;
		position: relative;
	}

.js-segment-tooltip:last-child > .tooltip-wrapper {
	float: right;
	align-items: flex-end;
	justify-content: flex-end;
}

.summary-card {
	width: 50%;
	color: #f1f1f1;
	padding: 10px 5px;
	float: left;
}

	.summary-card > .summary-card-content {
		padding: 10px 8px;
		border-radius: 4px;
		width: 100%;
		height: 100%;
	}

		.summary-card > .summary-card-content div {
			display: inline-block;
		}

		.summary-card > .summary-card-content .icon {
			font-size: 25px;
			color: #f2f2f2;
			width: 14%;
		}

		.summary-card > .summary-card-content .headline {
			font-size: 14px;
			font-weight: bold;
			padding-right: 10px;
		}

.cancelled-invoice-number {
    font-weight: 700;
    color: red;
}
.changed-history-value {
    background-color: #D6EAF8
}
.toggle-disabled {
    color: grey;
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

/* ===============================================
# VALIDATION STYLES
==================================================  */
.form-group.invalid input, tr.invalid input {
    background-color: #fee;
    border: 1px solid #a94442;
}

.form-group.invalid label, tr.invalid .table-label {
    color: #a94442
}

/*tr th.no-ellipsis*/
.k-grid-header th.k-header.no-ellipsis > .k-link {
    text-overflow: clip;
}

/* ===============================================
# Default Form Style
==================================================  */
.form-checkbox {
	position: relative;
	top: 4px;
}