body {margin:0; padding:0; height:100%; text-align:center; font-family: Verdana, Geneva, sans-serif; font-size:11px; color:#333333; background-color:#f0f0f0}
#content {position:relative; margin:auto; width:98%; text-align:left; margin-top: 5px}
#inner_content {position:relative; width:100%; background-color:#ffffff; border:1px solid #aabbcc; z-index:1}
#inner_padding {position:relative; margin:15px 5px 30px 5px;}
#head {position:relative; width:100%; margin-bottom: 5px; color: #ffffff; border: 1px solid #1f2124; border-bottom:8px solid #1f2124; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -0px; z-index:998;}
#head div.right {position:relative; font-size: 11px; float: right; padding-right: 10px; text-align: right; font-weight: normal;}
#head a {color: #15428b;}
#footer {width:100%; height: 30px; line-height: 32px; color: #808080; font-size: 11px; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -116px;}
#footer a {color: #808080}
#menu a span, a span, span.icons {position:relative; display:block; margin:auto; background: url("../../assets/img/icons.png") no-repeat;}
#menu {position:relative; text-align:left; padding: 0; margin: 0; list-style: none; min-height: 50px;}
#menu li {float: left; width: 120px; display:block; position:relative; text-align:center; height: 50px; margin: 0; padding: 0;}
#menu li a:link, #menu li a:visited {position:relative; display:block; text-align:center; padding: 2px 0 4px 0; text-decoration:none; color:#ffffff; font-weight:800; height: 50px;}
#menu li.right {float:right; width: 150px;}
#menu a span {width: 25px; height: 25px;}
#menu a span.loans {background-position: -0px -52px;}
#menu a span.accounting {background-position: -78px -0px;}
#menu a span.agents {background-position: -52px -52px;}
#menu a span.clients {background-position: -26px -52px;}
#menu a span.logout {background-position: -52px -26px;}
#menu a span.payments {background-position: -26px -26px;}
#menu a span.reports {background-position: -0px -26px;}
#menu a span.system {background-position: -52px -0px;}
#menu a span.tasks-pending {background-position: -26px -0px;}
#menu a span.tasks {background-position: -0px -0px;}
#menu a span.phones {background-position: -29px -77px;}
#menu a span.messaging {background-position: -54px -77px;}
#menu li:hover a, #menu li a:hover, #menu li a:active {color: #ffffff; display:block; text-align:center; text-decoration:none;}
#menu li:hover a, #menu li a:hover, #menu li a:active, #menu .menu_item_on {background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -58px;}

/* Sub-menus */
#menu li ul {margin:0; padding:0; list-style:none; display:none; width:180px; position:absolute; top: 51px; z-index:10;}
#menu li:hover > ul {display:block;}
#menu li ul li {position:relative; display:block; clear:left; width:180px; height: 22px; margin:0; padding:0; border:0}
#menu li ul li a span {display:inline-block; width: 15px; height: 13px; background-position: -90px -60px;}
#menu li ul li a, #menu li ul li a:link, #menu li ul li a:visited {text-align: left; clear:left; padding: 0; margin:0; border:none; position:relative; font-weight: normal; padding-left: 5px; color: #ffffff; line-height:22px; height:22px; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -218px;}
#menu li ul>li:hover>a, #menu li ul>li>a:active, #menu li ul>li>a:hover {position:relative; z-index:1000; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -240px;}
#menu ul ul {left: 100%; top: 0;}
#menu:before, #menu:after {content: " "; display: table;}
#menu:after {clear: both;}

/* Navigation */
/*.navigation {display:block; background: url("../../assets/img/bg.png") repeat-x; height:24px; width:100%; background-position: -0px -147px;}*/
.navigation {display: inline-flex; flex-wrap: wrap; width: 100%; border-bottom: 2px solid #6b869f; margin-bottom: 1px;}
.navigation .limg {position:absolute; background: url("../../assets/img/bg.png") no-repeat; width:1px; height:21px; left:0; top:0; background-position: -0px -170px;}
.navigation .rimg {position:absolute; background: url("../../assets/img/bg.png") no-repeat; width:1px; height:21px; right:0; top:0; background-position: -0px -194px;}
.navigation .spacer {position:relative; float:left; width:10px}
/*.navigation .tab {display:block; position:relative; float:left; height:21px; text-decoration:none; text-align:center; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -364px; margin:0 2px 0 2px}*/
.navigation .tab {display:inline-block; position:relative; height:21px; text-decoration:none; text-align:center; background: url("../../assets/img/bg.png") repeat-x; background-position: -0px -364px; margin:0 2px 0 2px}
/*.navigation .right {float:right}*/
.navigation .right {margin-left: auto}
.navigation .tab a {display:block; padding:4px 5px 4px 5px; color:#333333}
.navigation .tab a:hover {text-decoration:none}
.navigation .tab .limg {position:absolute; background-position: -0px -412px; width:2px; height:21px; left:0; top:0;}
.navigation .tab .rimg {position:absolute; background-position: -0px -460px; width:2px; height:21px; right:0; top:0;}
.navigation .tabchange:hover {background-position: -0px -388px;}
.navigation .tabchange:hover .limg {background-position: -0px -436px;}
.navigation .tabchange:hover .rimg {background-position: -0px -484px;}
.navigation .tabchange a:hover {color:#ffffff}

.stretch {clear:both; font-size:1px; height:1px; width:1px}

.table-outer-container {display: block; overflow-x: auto; width: 100%;}

table {font-family: Verdana, Geneva, sans-serif; font-size:11px; color:#333333;}
table.layout {width:100%; position:relative; border:1px solid #8db2e3; border-collapse:collapse}
table.layout td {padding:2px 5px 2px 5px}
table.classic {position:relative; width:100%; border:1px solid #8db2e3; border-collapse:collapse; text-align: left;}
table.classic td {padding:2px 5px 2px 5px; position:relative; border-bottom:1px solid #eeeeee}
table.classic tr.first td {padding-top: 10px}
table.classic tr.last td, table.classic tr.last-bd td, table.classic tr td.last {border-bottom: 1px solid #8db2e3}
table.classic tr:last-child td {border-bottom: 1px solid #8db2e3;}
table.classic tr.last-bd td {padding-bottom: 10px}
table.classic td a {display:block; width:100%;}
table.classic td a.in {display:inline; width: auto;}
table.classic tr.change:hover, table.classic tr td.change:hover {background-color:#efefef; cursor: pointer;}
table.classic tr.change td b {color: #106594}
table.classic tr.title td {font-weight:800; height:24px; background: url("../../assets/img/bg.png"); background-position: -0px -262px; padding:0 5px 0 5px; border-bottom:1px solid #ffffff;}
table.classic tr.title td:hover {background-position: -0px -315px;}
table.classic tr.title td a, table.classic td.title a {display:block; color:#000000}
table.classic tr.title td a:hover, table.classic td.title a:hover {color:#000000; text-decoration:none}
table.classic tr.highlighted, table.classic td.highlighted, table.classic td.title {background-color:#e9f3f8; font-weight:800}
table.classic tr.approved {background-color: #beb7c7}
table.classic tr.blocked {background-color:#fde9e9}
table.classic tr.declined {background-color:#e2e2e2}
table.classic tr.warning {background-color:#ffffbb;}
table.classic tr.legal {background-color:#ff8080}
table.classic tr.pending {background-color:#fde9e9}
table.classic tr.completed {background-color: #d8fae6}
table.classic tr.list td {background-color:#e9f3f8; font-weight:800}
table.classic tr.list td a {display:inline; color:#000000; font-weight:500; width:auto}
table.classic tr.title input.nb {border: 0; background-color:#e9f3f8}
table.classic td input.nb {border: 0; background-color:transparent}
table.classic.nb {border: 0;}
table.classic tr td.nb {border: 0; padding: 0; margin:0;}
table.classic tr td.n {font-weight: normal;}

input, select, textarea {font-family: Verdana, Geneva, sans-serif; font-size:11px; color:#333333; border:1px solid #333333; background-color:#deecfd;}
input.submit {text-transform:uppercase; cursor: pointer;}
input.btn[type=submit] {cursor: pointer; height: 19px;}
input.btn.bold[type=submit] {font-weight:800;}
input.l, select.l, textarea.l {width: 350px;}
input.m, select.m, textarea.m {width: 200px;}
input.s, select.s, textarea.s {width: 100px;}
select.xs {width: 50px;}
textarea.l {height: 150px;}
textarea.m {height: 100px;}
textarea.s {height: 50px;}

/* Default */
form {margin:0; padding:0;}
a {text-decoration:none; color:#106594;}
a img {border:0}
a span, span.icons {width: 13px; height: 13px;}
a span.delete {background-position: -78px -54px;}
a span.edit {background-position: -91px -40px;}
a span.list {background-position: -78px -40px;}
a span.speaker {background-position: -94px -26px;}
a.click:hover {cursor: pointer;}

span.icons {display: inline-block;}
span.personalid {background-position: -0px -83px;}
span.application {background-position: -13px -83px;}
span.jobletter {background-position: -107px -0px;}
span.insurance {background-position: -107px -14px;}
span.cheque {background-position: -107px -42px;}
span.contract {background-position: -107px -28px;}
span.certification {background-position: -107px -56px;}
span.sheriff {background-position: -107px -70px;}

h1 {margin: 0 10px 10px 10px; font-size:18px}

#btnfilter, #btnfilter_right {position: relative; float: left; padding-bottom: 10px; margin-right: 5px;}
#btnfilter input.submit, #btnfilter_right input.submit {font-weight: 800; text-transform:none}
#btnfilter input.reset, #btnfilter_right input.reset {font-weight: normal;}
#btnfilter_right {float: right;}
.btnfilter, .btnfilter_right {position: relative; float: left; padding-bottom: 10px; margin-right: 5px;}
.btnfilter input.submit, .btnfilter_right input.submit {font-weight: 800; text-transform:none}
.btnfilter input.reset, .btnfilter_right input.reset {font-weight: normal;}
.btnfilter_right {float: right;}

a.btn {display: inline-block; border: 1px solid #333333; background-color: #deecfd; font-size: 11px; color: #333333; padding: 2px 5px;}
a.btn.bold {font-weight: 800;}

table.classic tr.title input.nb {border: 0; background-color:#e9f3f8}
table.classic td input.nb {border: 0; background-color:transparent}
table.classic.nb {border: 0;}
table.classic tr td.nb {border: 0; padding: 0; margin:0;}
table.classic tr td.n {font-weight: normal;}

[data-tooltip] {position: relative; z-index: 2; cursor: pointer;}
[data-tooltip]:before, [data-tooltip]:after {visibility: hidden; pointer-events: none; opacity: 0; transition: visibility 0s, opacity 0.5s linear;}
[data-tooltip]:before {position: absolute; margin-top: 5px; top: 150%; left: 50%; transform: translate(-50%, 0); padding: 5px 10px; border-radius: 3px; background-color: #546274; color: #ffffff; font-size: 1em; content: attr(data-tooltip); text-align: center; white-space: nowrap;}
[data-tooltip]:after {position: absolute; top: 150%; left: 50%; margin-left: -5px; width: 0; border-bottom: 5px solid #546274; border-bottom: 5px solid #546274; border-right: 5px solid transparent; border-left: 5px solid transparent; content: " "; font-size: 0; line-height: 0;}
[data-tooltip]:hover:before, [data-tooltip]:hover:after, [data-tooltip]:focus:before, [data-tooltip]:focus:after {visibility: visible;opacity: 1;}

#callingBox {display: none; position: relative; top: 100px; margin: 0 auto; width: 600px; box-shadow: 0 0 60px 20px rgba(0,0,0,0.75); background: #ffffff;}
#callingBox table {text-align: center;}
#callingBox input {font-size: 20px; margin: 20px 0;}

div.chart {width: 100%; height: 500px;}
ul li {list-style-type: square;}
.w30 {width: 30%;}
.w20 {width: 20%;}
.wGauge {width: 14.28%;}
.count {float:right;}
.upper {text-transform:uppercase;}
.lc {text-transform:lowercase;}
.ctr {text-align: center !important;}
.rgt {text-align: right !important;}
.lft {text-align: left !important;}
.result {position:relative; padding:15px; background-color:#b7d8e6;}
span.red, span.green {font-weight: bold;}
span.red {color: #ff0000;}
span.green {color: #00ae00;}
.hidden{display: none;}
hr {size: 1px; color: #1875ad; height: 1px}
#errors, #errors-wrapper {position: relative; width: 100%; margin: 20px 0;}
#errors div, #errors-wrapper div {margin: 5px 0; color: #fff; text-align: center; padding: 5px 20px; font-size: 1.2em; text-transform: uppercase;}
#errors div.notice {background: #9dcb5b;}
#errors div.warning {background: #f5cf77;}
#errors div.error, #errors-wrapper div.error {background: #ff6272;}
#errors-wrapper div.error ul li{list-style-type: none}
.gaugeValue{font-size: 15px;font-weight: 600;margin-bottom: 10px;margin-top: -10px;text-align: center;}
.moveTo {cursor: pointer;}
.select-readonly{pointer-events: none;}
.border-error{border:1px solid red;}
#developmentEnvironment {
	background-color: lightcoral;
	width: 100%;
	font-weight: bold;
	padding: 2px 0;
	margin-bottom: 5px;
	text-align: center;
}
@media print {
	#head, #footer, div.tab.tabchange {display: none;}
}

/* Searchable selects styles */

select.searchable { display: none; }
input.select_search_input { width: -webkit-fill-available; margin: 4px 4px 8px; border-radius: 4px; padding: 2px 4px; background: #f1f1f1; border-color: #9b9b9b; }
div.searchable-options-outer-container { max-height: 480px; border: 1px solid #BABABA; border-radius: 8px; z-index: 1; position: fixed; background: #DEECFD; box-shadow: 0 1px 6px #000000; padding: 4px; }
div.searchable-options-outer-container.hidden { visibility: hidden; }
div.searchable-options-outer-container div { padding: 4px; font-weight: normal; }
div.searchable-options-inner-container { max-height: 442px; overflow-y: auto; }
div.searchable-options-inner-container::-webkit-scrollbar { width: 8px; height: 8px; }
div.searchable-options-inner-container::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 10px; margin-right: 8px; }
div.searchable-options-inner-container::-webkit-scrollbar-thumb { background: #888; border-radius: 10px; }
div.searchable-options-inner-container::-webkit-scrollbar-thumb:hover { background: #555; }
div.searchable-options-inner-container div { cursor: default; }
div.searchable-options-inner-container div.group-label { font-weight: bold; }
div.searchable-options-inner-container div.group-options { margin-left: 6px; }
div.searchable-options-inner-container div:hover:not(.optgroup, .group-label, .group-options),
div.searchable-options-inner-container div:not(.optgroup, .group-label, .group-options).focused { color: #ffffff; background: #1967D2; }
span.options-not-found { display: block; padding: 4px; color: gray; }
select.searchable.s + div.searchable-select-container input { width: 88px; }
select.searchable.sm + div.searchable-select-container input { width: 182px; }
select.searchable.m + div.searchable-select-container input { width: 188px; }
select.searchable.l + div.searchable-select-container input { width: 338px; }
.searchable-select-container { display: inline-block; position: relative; }
.searchable-select-container input[type="text"] { cursor: default; padding-right: 14px; }
.searchable-select-container input[type="text"]:focus { outline: none; }
.searchable-select-container > input[type="text"]:focus { outline: -webkit-focus-ring-color auto 1px; }
.searchable-select-container input[type="text"].disabled { color: #8f9194; }
.searchable-select-container input[type="text"].disabled:focus-visible { outline: none; }
.searchable-select-container span.svg-icon.arrow-down { position: absolute; right: 2%; top: 50%; transform: translateY(-50%); width: 0.7rem; height: 0.7rem; cursor: default; }

/* Loading loan calculator style */

.loading-calculator-form {
	border: 8px solid #f3f3f3;
	border-top: 8px solid #3498db;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	animation: spin 1s linear infinite;
	margin: 20px auto;
	display: block;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* Microsoft login styles */

div.ms-login-separator {
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 10px;
}

div.ms-login-separator hr {
	width: 100%;
}

div.ms-login-container {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
	user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
}

a.ms-login {
	width: 100%;
	height: 2rem;
	border: 1px solid #a9c5ea;
	margin: 0 0 5px 0;
	display: flex;
	transition-duration: 0.3s;
}

a.ms-login:hover {
	background-color: rgba(169, 197, 234, 0.41);
	color: black;
	border-color: transparent;
}

div.ms-login-content {
	width: 100%;
	height: 100%;
	display: flex;
	position: relative;
}

div.ms-login-content > div.ms-login-img {
	width: 8%;
	height: auto;
	overflow: hidden;
	position: relative;
	z-index: 10;
	display: flex;
	justify-content: center;
	align-items: center;
}

div.ms-login-content > div.ms-login-img > img {
	width: 70%;
}

div.ms-login-content > div.ms-login-text {
	position: absolute;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 5;
}