/* ==========================================================================
VERICO Document Less
Version: 1.37
Last Modified: July 25, 2023
========================================================================== */
@import url("https://fonts.googleapis.com/css?family=Roboto:400,300,700,100");
@import url("https://fonts.googleapis.com/css?family=Lato:300,300italic,700,700italic,900,900italic");

@import url("../Content/bootstrap.css");
@import url("../Content/icomoon.css");
@import url("../Content/animate.css");
@import url("../Content/typeahead.css");
@import url("../Content/bootstrap.checkbox.css");
@import url("../Content/bootstrap-datetimepicker.css");
@import url("../Content/ladda/ladda-themeless.min.css");
/* ==========================================================================
less global variables
========================================================================== */
@User-colour: #ffffff;
@User-background-colour:#ffffff;
@User-background-colour-2:@User-colour;
@User-background: @User-background-colour;
@User-background-image: url('/MortgageApplicationFiles/Images/Global/Hero/Hero_3.jpg') no-repeat center;
@User-colour-link: @User-colour;
@Warning-colour: #ffc107;
@System-colour: #efefef;
@System-background-colour: rgba(255,255,255,1);
@System-background: darken(@System-background-colour, 0%);
@up-btn-background: contrast(@User-background-colour, @User-colour, #ffffff);
.gradient (@origin: left, @start: #ffffff, @stop: #000000) {
	background-color: @start;
	background-image: -webkit-linear-gradient(@origin, @start, @stop);
	background-image: -moz-linear-gradient(@origin, @start, @stop);
	background-image: -o-linear-gradient(@origin, @start, @stop);
	background-image: -ms-linear-gradient(@origin, @start, @stop);
	background-image: linear-gradient(@origin, @start, @stop);
}
/* ==========================================================================
Base
========================================================================== */
/* * 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using
*    `em` units.
* 2. Prevents iOS text size adjust after orientation change, without disabling
*    user zoom. */
 
html { font-size: 100%; /* 1 */
	-webkit-text-size-adjust: 100%; /* 2 */
-ms-text-size-adjust: 100%; /* 2 */ }
html, html a { -webkit-font-smoothing: antialiased; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); }
/* * Addresses `font-family` inconsistency between `textarea` and other form
* elements. */
html, button, input, select, textarea { font-family:'Roboto', Arial, Helvetica, sans-serif; }
/* * Addresses margins handled incorrectly in IE 6/7. */
body { font-family:'Roboto', Arial, Helvetica, sans-serif; margin:0; color:#303030; background-color:@User-background;}
/* ==========================================================================
IE 10+ message
========================================================================== */
#NoIE{display:none; width:100%; height:100%; background:#fff;}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS */
    #NoIE{display:block;}
    #NoIE h1, #NoIE h2, #NoIE h3 {color:#2d53a4;}
    .Wrapper, .modal {
        display: none;
    }
}
/* ==========================================================================
Typography
========================================================================== */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: 'Lato', sans-serif;
  font-weight: 900;
  color: contrast(@User-background-colour, @User-colour);
}
.Space-Filler {clear:both; height:100vh; width:100%;}
.Space-exlg {clear:both; margin-bottom:70px; width:100%; min-height:1px;}
.Space-lg {clear:both; margin-bottom:50px; width:100%; min-height:1px;}
.Space-md {clear:both; margin-bottom:30px; width:100%; min-height:1px;}
.Space-sm {clear:both; margin-bottom:20px; width:100%; min-height:1px;}
.Space-xm {clear:both; margin-bottom:15px; width:100%; min-height:1px;}
.Space_MarginLeft {margin:0 0 0 10px;}
.Space_MarginRight {margin:0 10px 0 0;}
.Space_NoPadding {padding:0 !important;}
.Space_NoSidePadding {padding-left:0 !important; padding-right:0 !important;}
.Space_PaddingRight {padding-left:0 !important;}
.Space_PaddingLeft {padding-right:0 !important;}
.Space_CenterBlock {float:none; margin:0 auto;}
.Font_Footnote {font-size:0.8em; line-height:1.1; font-style:italic;}
.Font_Light {font-weight:300;}
.Font_White {color:#fff;}
.Font_Black {color:#000;}
/* ==========================================================================
Links
========================================================================== */
/* * Addresses `outline` inconsistency between Chrome and other browsers. */

a {color:contrast(@User-background, @User-colour-link, #ffffff);}
a:focus { outline: none; color:contrast(@User-background, lighten(@User-colour-link, 20%), darken(#ffffff, 20%)); text-decoration:none;}
/* * Improves readability when focused and also mouse hovered in all browsers. */
a:active, a:hover { outline: 0; color:contrast(@User-background, lighten(@User-colour-link, 20%), darken(#ffffff, 20%));}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}
/* ==========================================================================
Miscellaneous
========================================================================== */
.Wrapper {width:100%; margin:0 auto; background:@User-background-colour;}
.container-fluid {background-color: transparent;}
.body-content {max-width:1700px; margin:0 auto;}
.body-content:last-of-type {padding-bottom:30px;}
@media (max-width: 767px) {
	.body-content:last-of-type {padding-bottom:25px;}
}
#Sub_Contents {position:relative; z-index: 2;}
#Sub_Contents img {max-width:100%;}
.NoPadding {padding:0;}
.NoSmoothScroll{}
.Container_Title{display:block; position:relative; margin-bottom:25px;}
.PoweredBy {font-size:0.8em; color:contrast(@User-background, #808080, #ffffff); text-align:left;}
.PoweredBy .col-md-12 {margin-bottom:5px;}
.PoweredBy img {width:100%; max-width:140px; max-height:60px; margin-right:20px;}
.d-none {display: none;}
/* ==========================================================================
Waypoints
========================================================================== */
.wp1, .wp2, .wp3, .wp4 { visibility: hidden; }
.fadeInUp, .fadeInLeft { visibility: visible; }
.delay-05s { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; }
.delay-1s { animation-delay: 1s; -webkit-animation-delay: 1s; }
.delay-15s { animation-delay: 1.5s; -webkit-animation-delay: 1.5s; }
hr{
	clear:both; border-top: 1px solid #efefef;
}
hr.user-hr{
	clear:both; border-top: 1px solid @User-colour;
}
/* ==========================================================================
User contact card
========================================================================== */
#User_Wrapper {padding:30px; margin-bottom:10px; background:@User-background; color:contrast(@User-background, @User-colour);}
#User_Wrapper .body-content {max-width:none;}
#User_Wrapper .body-content:last-of-type {padding-bottom:0px;}
.col-user-card {position:relative; width:100%; height:auto; padding:15px; overflow:auto;}
.col-user-id h3 {margin-top:15px; color:contrast(@User-background, @User-colour); font-size:1.6em;}
.col-user-logo img {border:5px solid #ffffff; border-radius:2px; background:#ffffff;}
@media (max-width: 992px) {
	#User_Wrapper {padding:0;}
	.col-user-logo {width:100%; text-align:right; padding:0 0 10px;}
	.col-user-logo img {max-height:50px; max-width:150px;}
	.col-user-card {margin:0 auto; padding:15px; text-align:center;}
	.col-user-photo {width:100%; margin:0; height:auto; padding:0 15px; display:block; text-align:center;}
	.col-user-id {width:100%; display:block; margin:0; padding:0 15px; text-align:center;}
}
@media (min-width: 992px) {
	#User_Wrapper {padding:0;}
	.col-user-logo {width:230px; text-align:right; padding:0 15px;}
	.col-user-logo img {max-height:80px; max-width:200px;}
	.col-user-card {margin:0 auto; padding:30px 15px; max-width:1700px;}
	.col-user-photo {width:120px; padding:0px 15px; display:inline-block; float:left; text-align:center;}
	.col-user-id {width: ~"calc(100% - 350px)"; padding:0px 15px; float:left; text-align:left;}
}
.Image_Profile {max-height:90px; border:5px solid; max-width:100%;}
.col-user-card .label-license{white-space:normal;text-align:right;display:inline-block;margin:6px 0; padding:0; background:transparent;border:none; border-radius:0; color:contrast(@User-background-colour);}
/* ==========================================================================
Navigation - Header
========================================================================== */
.Wrapper_Nav {
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: #fff;
    margin: 0 auto;
    padding: 10px 0;
    border-bottom: 0px solid #ffffff;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.Wrapper_Nav.Shrink {background-color:rgba(255,255,255,0.98); -webkit-box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.15); box-shadow:0px 1px 5px 0px rgba(0, 0, 0, 0.15);}
.Container_Nav {width:100%; max-width:1920px; position:relative; margin:0 auto;}
@media (max-width: 992px) {
	.Wrapper_Nav {position:relative; border-bottom:5px solid #ca2027; padding:0;}	
}
.navbar-default {
  background-color: transparent;
  border-color: transparent;
}
.navbar-default .navbar-nav > li {padding:0 0 0 8px;}
.navbar-default .navbar-nav > li > a {padding:10px; margin:2px 0;}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #fff;
  background-color: #e6232b;
  -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #fff;
  background-color: #ca2027;
  -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
}
.navbar-default .navbar-toggle {
  border-color: #fff; background-color:#fff;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #ca2027;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #ca2027;
}
.navbar-default .navbar-toggle:hover .icon-bar, .navbar-default .navbar-toggle:focus .icon-bar {
  background-color: #fff;
}
a.navbar-btn {background:#ca2027; color:#fff !important; margin:0; border:none;}
a.navbar-btn:hover, a.navbar-btn:active {background:#e6232b !important;}
@media (max-width: 767px) {
  .navbar-default {
	background-color: #f8f8f8;
	border-color: #e7e7e7;
  }
  .navbar-default .navbar-nav > li {padding:0; margin:0 10px;}
}
.Wrapper_Nav .Container_Nav .col-lg-2 {display: flex; justify-content: center; height: auto;}
.Image_Logo_Header {height:100px; margin:25px auto; flex:none;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
@media (max-width: 1199px) {
	.Wrapper_Nav .Container_Nav .col-lg-2 {justify-content:inherit;}
}
@media (max-width: 992px) {
	.Wrapper_Nav .Container_Nav .col-lg-2 {justify-content:center;}
}
.Image_Logo_Header.Shrink{height:60px; margin:10px 0;}
.breadcrumb {width:auto; margin:15px 0; border-radius:0; border-bottom:1px solid #efefef; background-color:transparent;}
.navbar-brand img {max-height:26px;}
.navbar-collapse [class^="icon-"], .navbar-collapse [class*=" icon-"] {margin-right:5px;}
.navbar-collapse .icon-search {margin-right:0;}
.Nav_Search {padding:0 10px 4px;}
.navbar-fixed-top > .navbar-collapse.collapse.in {-webkit-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); -moz-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1);}

.Nav_Side {padding:20px 15px; border-left:4px solid #e7e7e7;}
@media (max-width: 992px) {
	.Nav_Side {  background-color: #f8f8f8; border: solid 1px #e7e7e7; border-radius:4px; text-align:center;}
	.Nav_Side .nav-pills > li > a, .Nav_Side .nav-pills > li > a:focus {border:#d0d0d0 1px solid; background:#fff;}
}
.Nav_Side_Fixed {position:fixed; top:150px; padding-right:21px; z-index:99;}
@media (min-width: 1700px) {
	.Nav_Side_Fixed {max-width:294px; padding-right:9px;}
}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {background:#CA2027;}
.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {background:#e6232b;}
.dropdown-menu > li > a {padding:7px 20px;}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {background:#ca2027; color:#fff;}
.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {background:@User-colour; color:contrast(@User-colour);}
/* ==========================================================================
Button
========================================================================== */
.tag-a-not-active,
.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
  pointer-events: none !important;
  cursor: not-allowed !important;

}
.tag-a-not-active {opacity:0.3;}

.btn-User {color:contrast(@User-colour); background:@User-colour;border-color:@User-colour;}
.btn-User:hover,
.btn-User:focus,
.btn-User.focus,
.btn-User:active,
.btn-User.active,
.open > .dropdown-toggle.btn-User {color:contrast(@User-colour); background-color: lighten(@User-colour, 20%); border-color: lighten(@User-colour, 20%);}
.btn-User:active,
.btn-User.active,
.open > .dropdown-toggle.btn-User {background-image: none;}
.btn-User.Clone {margin: 0 10px 0 0;}
.Wrapper_Duplicate .col-md-12 .btn-User.Clone:nth-child(odd){margin:0;}
@media (max-width: 480px) {
	.btn-User {width:100%; display:block; margin:0 0px 5px;}
	.User_Signature .btn-User {width:inherit; display:inline-block;}
	.btn-User.Space_MarginLeft {margin:0 0 5px;}
	.btn-User.Space_MarginRight {margin:0 0 5px;}
    .btn-User.Clone {margin:0 0 5px;}
    .Wrapper_Duplicate .col-md-12 .btn-User.Clone:nth-child(odd) {margin: 0 0 5px;}
}

a.up-btn { width: 80px; height: 80px; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; -o-border-radius: 50%; background: @up-btn-background; display: block; margin: 0 auto; color: contrast(@up-btn-background); font-size: 26px; line-height: 80px; text-align: center; position: relative; margin:30px auto;}
a.up-btn:hover, a.up-btn:focus {background: lighten(@up-btn-background, 10%); }
a.up-btn .glyphicon-chevron-up {line-height:80px;}
/* ==========================================================================
Apply now button section
========================================================================== */
a#ShowMortgageApplication {border-radius:6px; font-size:1.8em;margin:0 auto; position:relative;padding:15px;color:contrast(@User-colour);background:lighten(@User-colour, 10%);display:block;text-align:center; width:100%;max-width:400px;-webkit-box-shadow: 3px 3px 43px 0px rgba(32,32,32,0.3);-moz-box-shadow: 3px 3px 43px 0px rgba(32,32,32,0.3);box-shadow: 3px 3px 43px 0px rgba(32,32,32,0.3);}
a#ShowMortgageApplication:hover{text-decoration:none; color:contrast(@User-colour) !important;background:lighten(@User-colour, 15%);}
#Row_Apply{background:darken(@User-colour, 7%); padding:25px 30px; text-align:center;}
/* ==========================================================================
List style counter
========================================================================== */
.custom-counter {
    margin-left: 0;
    padding: 0 0 0 55px;
    list-style-type: none;
}
.custom-counter li {
    counter-increment: step-counter;
	margin:0 0 8px 0;
	position:relative;
}
.custom-counter li::before {
    content: counter(step-counter);
	position:absolute;
	left:-40px;
	width:30px;
	display:block;
	text-align:center;
    font-size: 80%;
    background-color: @User-colour;
    color: contrast(@User-colour);
    font-weight: bold;
    padding: 3px 8px;
    border-radius: 3px;
}
.custom-counter li.has-inline-field {line-height:30px;}
.custom-counter li.has-inline-field:before {line-height:24px;}
.custom-counter li.has-inline-field .form-group {width:auto;max-width:200px; display:inline-block; margin:0 5px;}
.custom-counter li.has-inline-field .form-group .form-control {display:inline-block;}
.custom-counter li.has-inline-field:before {}
ul.custom-counter-sub {
    margin-left: 0;
    padding:10px 0 2px 40px;
    list-style-type: none;
}
ul.custom-counter-sub li {
    counter-increment: step-counter-sub;
	margin-bottom:8px;
	position:relative;
}
ul.custom-counter-sub li::before {
    content: counter(step-counter-sub);
	position:absolute;
	left:-40px;
	width:30px;
	display:block;
	text-align:center;
    font-size: 80%;
    background-color: #efefef;
    color: #303030;
    font-weight: bold;
    padding: 3px 8px;
    border-radius: 3px;
}
ul.custom-counter-sub .custom-counter-sub-1 li {counter-increment: step-counter-sub-1;}
ul.custom-counter-sub .custom-counter-sub-1 li::before {content: counter(step-counter-sub-1);}
/* ==========================================================================
Popover
========================================================================== */
.popover {padding:0;color:#303030 !important;}
.popover-title {
  background-color: @User-colour;
  color:contrast(@User-colour);
  border-bottom: 1px solid @User-colour;
}
h5 .popover {color:#202020;}
/* ==========================================================================
Modal for Documents
========================================================================== */
/* To minimize use of the system resource on mobile */
.modal.fade .modal-dialog {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.modal-title {color:@User-colour;}
.modal-dialog{
  position: relative;
  width: 94% !important;
  max-width:1000px;
  margin: 30px auto !important;
}
.modal-dialog .label-license {display:inline-block; padding:6px 8px; margin-top:2px; background:lighten(@User-colour, 10%);color:contrast(@User-colour);}
@media (max-width: 480px) {
	.modal-dialog{margin:15px auto !important;}	
}
.modal-content {
  border: none;
  border-radius: 8px;
  background:#fff;
  overflow:visible; /* Allows pop-over to flow outside of the modal body */
  height:auto;
}
.modal-backdrop {
  background-color: #202020;
}
.modal-backdrop.fade {
  filter: alpha(opacity=0);
  opacity: 0;
}
.modal-backdrop.in {
  filter: alpha(opacity=90);
  opacity: 0.9;
}
.modal-open .modal {
  padding-left: 0px !important;
  padding-right: 0px !important;
  overflow-y: auto;
}
/*@media only screen and (max-device-width:768px){
	body.modal-open {
		// block scroll for mobile;
		// causes underlying page to jump to top;
		// prevents scrolling on all screens
		overflow: hidden;
		position: fixed;
	}
	
	body.viewport-lg {
		// block scroll for desktop;
		// will not jump to top;
		// will not prevent scroll on mobile
		position: absolute; 
	}
	
	body {  
		overflow-x: hidden;
		overflow-y: scroll !important;
	}
}*/
.Modal_Header {padding:15px; background: @User-colour; .gradient(top, @User-colour, darken(@User-colour, 12%)); border-top-left-radius:8px; border-top-right-radius:8px;}
.Modal_Header h1, .Modal_Header h2, .Modal_Header h3 {color:contrast(@User-colour);}
.Modal_Header.bg-warning {
	background: @Warning-colour;
	.gradient(top, @Warning-colour, darken(@Warning-colour, 12%));
}
.Modal_Header.bg-warning h1, .Modal_Header.bg-warning h2, .Modal_Header.bg-warning h3 {
	color: contrast(@Warning-colour);
}
.Modal_Header img, .modal-body img{max-width:70%; max-height:90px;}
@media (max-width: 480px) {
	.Modal_Header img {max-height:50px;}
}
.modal-body a{word-wrap:break-word; color:@User-colour;}
.modal-body p{color:#303030;}
.modal-body h3{color:@User-colour;}
.modal-body label {color:#303030;}
.modal-body .form-control:required {
    border-color: @User-colour;
}
.modal-body-iframe {
    position: relative;
    height: 70vh;
    overflow:auto !important;
	margin:-15px;
}
@media (max-width: 480px) {
	.modal-body-iframe {height: 65vh;}
}
.modal-body-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	overflow-y: auto !important;
}

.Modal_Accordion .panel-default {border:none;}
.Modal_Accordion .panel-heading {border:none; color:#ca2027; background-color:#fff; padding:0px;}
.Modal_Accordion .panel-title {border:none; color:#ca2027; margin:0; font-weight:300;}
.Modal_Accordion .panel-body {border:none;}
.modal-Calculator{width:330px !important;}
.modal-body ul.Links {list-style:none; padding-left:0px;}
.modal-body ul.Links li {padding:1em 1.3em; margin-bottom:5px; border-bottom:1px solid #efefef; display:block;}
.modal-body ul.Links li:before {
  content: "\e9d9";
  font-family: icomoon;
  display: inline-block;
  margin-left: -1.3em; /* same as padding-left set on li */
  width: 1.3em; /* same as padding-left set on li */
  color:#efefef;
}
/* ==========================================================================
Form
========================================================================== */
.form-content {max-width:1700px; margin:0 auto; padding:15px 30px;}
form h4{border-top:0px; border-bottom:1px solid contrast(@User-background, @User-colour); margin:20px 0; padding:15px 0; color:contrast(@User-background, @User-colour);}
.form-control-feedback {display:none;}
.help-block {font-size:0.9em; color:contrast(@User-background-colour)}
.help-block.with-errors ul.list-unstyled {
    background: #ca2027; color:#fff;
    width: auto;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 4px;
    box-shadow: 3px 3px 30px 0 rgba(0, 0, 0, 0.3);
}
.progress {margin:10px 0 5px;}

.btn-file {
	position: relative;
	overflow: hidden;
}
.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 100px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	outline: none;
	background: white;
	cursor: inherit;
	display: block;
}
input.Format_PostalCode {text-transform: uppercase;}

/*Sticky Form Button */
button[type=submit]{-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;}
.affix {z-index:1200; position:fixed !important; bottom:25px; right:25px; font-size:1.1em; font-weight:bold; border-radius:50%; width:100px; height:100px; -webkit-box-shadow:0px 0px 10px 0px rgba(50, 50, 50, 0.5); -moz-box-shadow:0px 0px 10px 0px rgba(50, 50, 50, 0.5); box-shadow:0px 0px 10px 0px rgba(50, 50, 50, 0.5); animation: affixFadeIn 0.44s ease-in; -webkit-animation: affixFadeIn 0.44s;}
@keyframes affixFadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}
@-webkit-keyframes affixFadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
} 
.affix-bottom {position:relative; bottom:inherit; right:inherit; font-weight:inherit; border-radius: 4px; width:auto; height:inherit;-webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;}
.Type_Save:before {font-family: 'icomoon'; content: "\e962"; color:#fff; font-size: 1.8em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Save:after {content: "SAVE"; color:#fff; font-size:1.8em; display:inline-block;}
.Type_Send:before {font-family: 'icomoon'; content: "\e619"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Send:after {content: "SEND"; color:#fff; font-size:1em; display:inline-block;}
.Type_Import:before {font-family: 'icomoon'; content: "\e9c5"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Import:after {content: "IMPORT"; color:#fff; font-size:1em; display:inline-block;}
.Type_Export:before {font-family: 'icomoon'; content: "\e9c6"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Export:after {content: "EXPORT"; color:#fff; font-size:1em; display:inline-block;}
.Type_Delete:before {font-family: 'icomoon'; content: "\e9ac"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Delete:after {content: "DELETE"; color:#fff; font-size:1em; display:inline-block;}
.Type_Upload:before {font-family: 'icomoon'; content: "\e934"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Upload:after {content: "UPLOAD"; color:#fff; font-size:1em; display:inline-block;}
.Type_Search:before {font-family: 'icomoon'; content: "\e986"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Search:after {content: "SEARCH"; color:#fff; font-size:1em; display:inline-block;}
.Type_Add:before {font-family: 'icomoon'; content: "\e931"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Add:after {content: "ADD"; color:#fff; font-size:1em; display:inline-block;}
.Type_Substract:before {font-family: 'icomoon'; content: "\e932"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Substract:after {content: "SUBSTRACT"; color:#fff; font-size:1em; display:inline-block;}
.Type_Join:before {font-family: 'icomoon'; content: "\e972"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Join:after {content: "JOIN"; color:#fff; font-size:1em; display:inline-block;}
.Type_List:before {font-family: 'icomoon'; content: "\e9ba"; color:#fff; font-size: 1em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_List:after {content: "LIST"; color:#fff; font-size:1em; display:inline-block;}
.Type_Submit:before {font-family: 'icomoon'; content: "\e962"; color:#fff; font-size: 1.8em; font-weight:lighter; display:inline-block; margin-right:10px;}
.Type_Submit:after {content: "SUBMIT"; color:#fff; font-size:1.8em; display:inline-block;}
.Type_ReverseColour:before {color:#ca2027;}
.Type_ReverseColour:after {color:#ca2027;}
.Type_ReverseColour:hover:before, .Type_ReverseColour:hover:after {color:#ffffff;}
.affix.Type_Save:before, .affix.Type_Send:before, .affix.Type_Import:before, .affix.Type_Export:before, .affix.Type_Delete:before, .affix.Type_Upload:before, .affix.Type_Search:before, .affix.Type_Add:before, .affix.Type_Substract:before, .affix.Type_Join:before, .affix.Type_List:before, .affix.Type_Submit:before {font-size: 2em; display:block; margin-right:0;}
@media (max-width: 640px) {
	.affix {font-size:0.85em !important; width:70px; height:70px; bottom:15px; right:15px;}
	.Type_Save:after, .Type_Send:after, .Type_Import:after, .Type_Export:after, .Type_Delete:after, .Type_Upload:after, .Type_Search:after, .Type_Add:after, .Type_Substract:after, .Type_Join:after, .Type_List:after{font-size:0.82em;}
	.Type_Submit, .Type_Save {width:100%; text-align:center; margin-bottom:5px;}
	.Type_Submit:before, .Type_Submit:after, .Type_Save:before, .Type_Save:after {font-size:1.4em;}
}
label{color:contrast(@User-background-colour);}
.has-feedback .form-control {padding-right: 5px;}
.form-control:required {border-color: lighten(contrast(@User-background, @User-colour), 10%);}
.has-success .help-block, .has-success .control-label, .has-success .radio, .has-success .checkbox, .has-success .radio-inline, .has-success .checkbox-inline, .has-success.radio label, .has-success.checkbox label, .has-success.radio-inline label, .has-success.checkbox-inline label {color:contrast(@User-background, @User-colour);}
.has-success .form-control {border-color: contrast(@User-background, @User-colour);}
.has-success .form-control-feedback {color:@User-colour;}
.Detail_Highlight .has-error .help-block, .Detail_Highlight .has-error .control-label, .Detail_Highlight .has-error .radio, .Detail_Highlight .has-error .checkbox, .Detail_Highlight .has-error .radio-inline, .Detail_Highlight .has-error .checkbox-inline, .Detail_Highlight .has-error.radio label, .Detail_Highlight .has-error.checkbox label, .Detail_Highlight .has-error.radio-inline label, .Detail_Highlight .has-error.checkbox-inline label {color:contrast(@User-colour);}
.Detail_Highlight .has-error .form-control:required {border-color: lighten(contrast(@User-background, #a94442), 10%); background:rgba(229, 21, 0, 0.6); color:#fff;}
.Detail_Highlight .input-group-addon {border-color: lighten(contrast(@User-background, @User-colour), 10%);}
.input-required-msg:before, .signature-required:before {color:#ffffff !important; font-size:0.8em; font-family:'icomoon'; content: "\e905"; display:inline-block; padding:3px 6px; background:rgba(202,32,39,0.8); border-radius:4px; position:absolute; margin-left:-35px;}
@media (max-width: 640px) {
	.input-required-msg:before, .signature-required:before {font-size:0.45em; padding:2px 4px; margin-left:-20px;}
}
/* ==========================================================================
Affix: PageTitle
========================================================================== */
.PageTitle {color:contrast(@User-background, @User-colour);}
.PageTitle h3 {display:none;}
.PageTitle #PageTitle_Menu {display:none;}
.PageTitle .Image_Profile {display: none;}
.PageTitle .user-phone {display:none;}
.PageTitle.affix {z-index:99; position:fixed !important; top:0px; right:0; bottom:inherit; border-radius:0; background:darken(@User-colour, 10%); width:100%; height: auto; padding:0px; margin:0; display:block; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; text-align:left; opacity:0.95; -webkit-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); -moz-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); box-shadow:8px 18px 73px 0 rgba(0,0,0,.3);}
.PageTitle.affix h3 {display: block;font-size:1.2em; line-height:32px; color:contrast(@User-colour);font-weight:normal; padding:15px;margin:0;}
.PageTitle.affix #PageTitle_Menu {display:block; position:relative; width:100%; height:auto; overflow:auto; padding:15px; background:darken(@User-colour, 20%);}
.PageTitle.affix ul{list-style:none; padding-left:0px; margin-bottom:0;}
.PageTitle.affix ul li a{display:inline-block; float:left; margin-right:15px; padding:7px; font-size:1em; font-weight:100;}
.PageTitle.affix ul li a:hover, .PageTitle.affix ul li.active a{border-radius:5px; font-size:1em; background:lighten(@User-colour, 10%); color:contrast(@User-colour); text-decoration:none;}
.PageTitle.affix .Font_highlight {font-weight:bold;}
.PageTitle.affix .Image_Profile {display:inherit; max-height:32px; border:none;}
.PageTitle.affix .user-phone {display:inherit;}
.PageTitle.affix a {color:contrast(@User-colour);}
.PageTitle.affix a:focus { outline: none; color:contrast(@User-colour); text-decoration:none;}
/* * Improves readability when focused and also mouse hovered in all browsers. */
.PageTitle.affix a:active, .PageTitle.affix a:hover { outline: 0; color:contrast(@User-colour);}
.PageTitle.affix-bottom {position:relative; top:inherit; background:none; padding:inherit; margin:inherit; display:inherit; border-bottom:none;}
body.desktop-view .PageTitle.affix {position:relative !important;}
@media (max-width: 640px) {
	.PageTitle.affix {font-size: 0.9em !important; left:0; bottom: inherit; right:inherit; top:0; text-align:left; /*-webkit-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); -moz-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1);*/}
    .PageTitle.affix .Font_highlight {color:#fff; font-weight:bold;}
	body.desktop-view .PageTitle.affix {position:relative !important;}
}
@media (min-width: 641px) and (max-width:992px) {
	.PageTitle.affix {font-size: 1em !important; left:0; bottom: inherit; right:inherit; top:0px; text-align:left; /*-webkit-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); -moz-box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1); box-shadow:0px 7px 7px 0px rgba(50, 50, 50, 0.1);*/}
    .PageTitle.affix .Font_highlight {color:#fff; font-weight:bold;}
	body.desktop-view .PageTitle.affix {position:relative !important;}
}
/* ==========================================================================
Responsive Table
========================================================================== */
.Table_Responsive td {vertical-align:middle !important; padding:12px 10px !important; border-bottom:1px solid #efefef;}
.Table_Responsive td.Table_CompanyLogo {padding-left:8px !important; border-bottom:none;}
.Table_Responsive td.Table_CompanyLogo .thumbnail {margin-bottom:0;}
.Table_Responsive td.Table_CompanyLogo img{max-width:130px; max-height:80px;}

/* Tr Group */
.Table_Responsive tbody tr.group:not(:first-child) td.Row_Group {padding:60px 10px 10px !important;}

/* Merge Table */
#Table_Clients_Merge tbody tr td.Table_Category{font-weight:bold; color:#ca2027;}

@media only screen and (max-width: 800px) {
    
    /* Force table to not be like tables anymore */
	.Table_Responsive table, 
	.Table_Responsive thead, 
	.Table_Responsive tbody,
	.Table_Responsive tfoot,
	.Table_Responsive th, 
	.Table_Responsive td, 
	.Table_Responsive tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	.Table_Responsive thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	/*.Table_Responsive tfoot {display:none;}*/
 
	.Table_Responsive tr { border: 1px solid #efefef; padding:10px; border-radius:4px; margin-bottom:15px;}
 
	.Table_Responsive td { 
		/* Behave  like a "row" */
		border: none;
		border-top:none !important;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50% !important; 
		white-space: normal;
		text-align:left;
	}
	 
	.Table_Responsive td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		/*top: 6px;*/
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		/*white-space: nowrap;*/
		text-align:left;
		font-weight: bold;
	}
	
	.Table_Responsive td, .Table_Responsive td:before {word-wrap:break-word !important;}
	.Table_Responsive td.Table_CompanyLogo img{max-width:75%; max-height:120px;}
	.fixed-table-container tbody td {border-left:none;}
	 
	/*
	Label the data
	*/
	.Table_Responsive td:before { content: attr(data-title);}
	.Table_Responsive td:last-child {border-bottom:none;}
	.radio, .checkbox {margin-top:0; margin-bottom:0;}
	
	/* Tr Group */
	.Table_Responsive tbody tr.group {background:#ca2027 !important;}
	.Table_Responsive tbody tr.group td.Row_Group {padding:10px 0 !important; text-align:center; border-bottom:none !important; background:#ca2027; color:#fff;}
	.Table_Responsive tbody tr.group:not(:first-child) td.Row_Group {padding:10px 0 !important;}
	
	/* tfoot */
	.Table_Responsive tfoot tr { padding:0; border:none;}
	.Table_Responsive tfoot tr td { width:100%; padding: 10px 0 !important; display:block;}

	/* Merge Table */
	#Table_Clients_Merge tbody tr td.Table_Category:before {border-bottom:none;}
	#Table_Clients_Merge tbody tr td.Table_Category{font-size:1.2em; text-align:center; padding: 10px 0 !important;}	
}
@media only screen and (max-width: 480px) {
	.Table_Responsive td:not(:last-child), .Table_Responsive tfoot tr td { width:100%; padding: 10px 0 !important; display:block;}
	.Table_Responsive td:not(:last-child):before { position:relative; width:100%; left:inherit; margin-bottom:3px; padding:3px 0 !important; display:block !important; border-bottom:1px solid #c0c0c0;}
	.Table_Responsive td:last-child:before {display:none;} 
	.Table_Responsive tbody tr td:last-child {border-bottom:none; padding-left:46.5% !important;}
	.Table_Responsive td.Table_CompanyLogo {padding-left:0px !important; border-bottom:none;}
	.Table_Responsive td.Table_CompanyLogo:before {border-bottom:none;}
	
	/* Merge Table */
	#Table_Clients_Merge tbody tr td:last-child {border-bottom:none; padding: 10px 0 !important;}
	
	/* History Table, No Data Table */
	#Customer_History tbody tr td:last-child, .NotDataTable tbody tr td:last-child { width:100%; padding: 10px 0 !important; display:block;}
	#Customer_History tbody tr td:last-child:before, .NotDataTable tbody tr td:last-child:before { position:relative; width:100%; left:inherit; margin-bottom:3px; padding:3px 0 !important; display:block !important; border-bottom:1px solid #c0c0c0;}
}
/* ==========================================================================
Tab
========================================================================== */
.NestedDropdown-tab {cursor:pointer !important;}
.Detail_SubHeader {margin:0 0 5px !important; font-weight:700 !important; display:block !important; border:none !important; padding:0 !important;}
.Detail_SubContents {color:#606060; margin-bottom:20px; display:block;}
a.Detail_SubContents {color:#ca2027;}
h3.Detail_SubContents {margin:0 0 20px;}
.Wrapper_Duplicate .address-tabs-system > li > a, .address-tabs-white > li > a {
    color: #c0c0c0;
}
.Wrapper_Duplicate .address-tabs-system > li.active > a, .Wrapper_Duplicate .address-tabs-system > li.active > a:hover, .Wrapper_Duplicate .address-tabs-system > li.active > a:focus, .address-tabs-white > li.active > a, .address-tabs-white > li.active > a:hover, .address-tabs-white > li.active > a:focus {
    color: #303030;
}
.Wrapper_Duplicate .address-tabs-system > li > a:hover, .address-tabs-white > li > a:hover {
    color: @User-colour;
}
.address-tabs-system > li > a:hover {color: @User-colour;}
.address-tab-content{border-left:0px solid #ddd;border-right:0px solid #ddd;border-bottom:0px solid #ddd;border-bottom-left-radius:4px;border-bottom-right-radius:4px;margin-bottom:0px;}
/* ==========================================================================
Broker Contents
========================================================================== */
#Wrapper-BrokerContents {
    background-color: @User-background-colour-2;
    color: contrast(@User-background-colour-2);
    height: auto;
    position: relative;
}
#Container-BrokerContents {width:100%; max-width:1700px; height:auto; position:relative; margin:0 auto; padding:40px 30px 40px; color:contrast(@User-background-colour-2);}
#Container-BrokerContents a, #Container-BrokerContents a focus, #Container-BrokerContents a:active {color:contrast(@User-background-colour-2, @User-colour);}
#Container-BrokerContents a:hover{color:lighten(@User-background-colour-2, 30%);}
#Container-BrokerContents [class^="col-sm-"]:hover{background-color:lighten(@User-background-colour-2, 10%);}
#Container-BrokerContents h1, #Container-BrokerContents h2, #Container-BrokerContents h3, #Container-BrokerContents h4, #Container-BrokerContents h5, #Container-BrokerContents h6 {color:contrast(@User-colour); margin-top:0; margin-bottom:40px;}
#Container-BrokerContents [class^="col-sm-"]  {border-top-color:contrast(@User-background-colour-2) !important; border-top:solid 5px; padding-top:20px; padding-left:10px; display:inline-block;}
#Container-BrokerContents p, #Container-BrokerContents #ContentsDiv p, #User_Agreement .modal-body .col-md-12 {
    white-space: pre-line;
}
#Tab-BrokerCustomizedContents #Hero {width:100%; height:100px; position:relative; background:url(../Images/Global/Hero/Hero_3.jpg) no-repeat center; background-size:cover;}
#Tab-BrokerCustomizedContents #Hero img{width:100%; display:block;}
@media (min-width:1600px){
	#Container-BrokerContents {padding:60px 30px 60px;}
	#Tab-BrokerCustomizedContents #Hero {height:220px;}
}
@media (max-width:768px){
	#Container-BrokerContents [class^="col-sm-"]  {width:100%; padding-left:0px;}
}
@media (max-width:480px){
	.modal-body [class^="col-sm-"], .modal-body [class^="col-md-"] {padding-left:0px; padding-right:0px;}
}
/* ==========================================================================
Data Detail
========================================================================== */
.Detail_Collapsible {display:none; clear:both;}
.Detail_Collapsible.Active {display:block;}
.Detail_Collapsible h5 {display:inline-block; color:contrast(@User-background, @User-colour); border-bottom:1px solid contrast(@User-background, @User-colour); padding:5px 0px; margin-bottom:20px; font-size:1.2em; font-weight:600; width:100%;}
.Detail_Toggle{margin-top:-8px; width:98px; background:@User-colour;}
.Detail_Toggle:hover {background:darken(@User-colour, 10%);}
.Detail_Toggle:before {font-family:'icomoon'; content:'\ea43'; margin-right:5px; color:contrast(@User-colour);}
.Detail_Toggle:after {content:'Expand'; color:contrast(@User-colour);}
.Detail_Toggle_Expanded {background:#efefef; border-color:#c0c0c0; color:#303030;}
.Detail_Toggle_Expanded:hover {background:#c0c0c0;}
.Detail_Toggle_Expanded:before {font-family:'icomoon'; content:'\ea41'; margin-right:5px; color:#303030;}
.Detail_Toggle_Expanded:after {content:'Collapse'; color:#303030;}
@media (max-width:768px){
	.Detail_Toggle{display:block; margin:30px 0 30px; width:100%;}
}
.Detail_OptionContainer {border-left:5px solid #efefef; padding:0px;}
.Detail_Mortgage h4 {color:#303030; border-bottom:1px solid #303030;}
.Button_ViewDetails, .Button_Preview, .Button_Download {display:inline-block; width:100%;}
.Button_ViewDetails:after {content:'View / Edit'; text-align:center; font-size:0.82em; color:#ca2027; background:#fff; border:1px solid #ca2027; border-radius:4px; display:block; padding:5px 8px; margin:5px 0 0; width:100%;}
.Button_Preview:after {content:'Preview'; text-align:center; font-size:0.82em; color:#ca2027; background:#fff; border:1px solid #ca2027; border-radius:4px; display:block; padding:5px 8px; margin:5px 0 0; width:100%;}
.Button_Download:after {content:'Download'; text-align:center; font-size:0.82em; color:#ca2027; background:#fff; border:1px solid #ca2027; border-radius:4px; display:block; padding:5px 8px; margin:5px 0 0; width:100%;}
.Button_ViewDetails:hover, .Button_Preview:hover, .Button_Download:hover {text-decoration:none;}
.Button_ViewDetails:hover:after, .Button_Preview:hover:after, .Button_Download:hover:after { background:#e6232b; color:#fff;}
.Button_tfoot {margin:0 0 0 10px;}
@media (max-width:768px){
	.Button_tfoot {margin:0 0 10px 0px; width:100%;}
}
.Row_DateCreated {font-size:0.8em;}
.Row_DateModified {font-size:0.8em; border-bottom:4px solid #efefef;}
.Detail_Hidden {background:#f1f1f1; color:#303030; padding:15px; position:relative; display:block; border-radius:8px;}
.Detail_Hidden h5 {color:#303030; border-bottom:1px solid #303030;}
.Detail_Hidden label {color:#303030;}
.Detail_Highlight {background: lighten(@User-colour, 2%); border-radius:8px; padding:15px; position:relative; -webkit-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); -moz-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); box-shadow:8px 18px 73px 0 rgba(0,0,0,.3);}
.Detail_Highlight_Agreement {background: darken(@User-colour, 10%); margin:15px 0;}
.Detail_Highlight .btn-agreement{background:contrast(@User-colour);color:@User-colour; border-color:contrast(@User-colour);}
.Detail_Highlight .btn-agreement:hover, .Detail_Highlight .btn-agreement:active, .Detail_Highlight .btn-agreement:focus{background:lighten(@User-colour, 10%);color:contrast(@User-colour);border-color:darken(@User-colour, 3%);}
.Detail_Highlight .Label_Manual {color:contrast(@User-colour);margin-bottom:5px; font-weight:bold;}
.Detail_Highlight h4 {color:contrast(@User-colour); margin:0 0 20px; border-bottom:1px solid contrast(darken(@User-colour, 10%));}
.Detail_Highlight h5 {color:contrast(@User-colour); border-bottom:1px solid contrast(darken(@User-colour, 10%));}
.Detail_Highlight label, .Detail_Highlight .help-block {color:contrast(@User-colour);}
.Detail_Highlight a {color:contrast(@User-colour);}
.Detail_Highlight a:focus { outline: none; color:contrast(lighten(@User-colour, 20%)); text-decoration:none;}
.Detail_Highlight a:active, .Detail_Highlight a:hover { outline: 0; color:contrast(lighten(@User-colour, 20%));}
.Detail_Highlight .has-success .help-block, .Detail_Highlight .has-success .control-label, .Detail_Highlight .has-success .radio, .Detail_Highlight .has-success .checkbox, .Detail_Highlight .has-success .radio-inline, .Detail_Highlight .has-success .checkbox-inline, .Detail_Highlight .has-success.radio label, .Detail_Highlight .has-success.checkbox label, .Detail_Highlight .has-success.radio-inline label, .Detail_Highlight .has-success.checkbox-inline label {color:contrast(@User-colour);}
.Detail_Highlight_LightGrey {background: #efefef; border-radius:8px; padding:15px; position:relative; /*-webkit-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); -moz-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); box-shadow:8px 18px 73px 0 rgba(0,0,0,.3);*/}
.Detail_Highlight_LightGrey .Label_Manual {margin-bottom:5px; font-weight:bold;}
.Detail_Highlight_LightGrey  h4 {margin:0 0 20px; color:#303030; border-bottom:1px solid #303030;}
.Wrapper_Duplicate {position:relative;color:#303030; background:#ffffff; margin:15px 0; border-radius: 8px; padding:15px 0; -webkit-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); -moz-box-shadow:8px 18px 73px 0 rgba(0,0,0,.3); box-shadow:8px 18px 73px 0 rgba(0,0,0,.3);}
.Wrapper_Duplicate label.control-label, .Wrapper_Duplicate .help-block{color:#303030;}
#Detail_CurrentMortgageInformation {z-index:1000;}
#Detail_FinancialInformation {color:contrast(@User-background-colour);}
#Wrapper-Application h4 {font-size:5.5em;}
@media (max-width:1400px){
	#Wrapper-Application h4 {font-size:4.2em; word-wrap: break-word;}
}
@media (max-width:1024px){
	#Wrapper-Application h4 {font-size:3em; word-wrap: break-word;}
}
#Title_h4_Agreement:hover {cursor: default !important;color: @User-colour !important;}
.Financial_Title {color: contrast(@User-background-colour); font-weight: bold;}
/* ==========================================================================
Graph
========================================================================== */
.graph-container {max-width:100%;}
.graph-container canvas {max-width:100%; height:auto !important; margin-bottom:20px;}
.legend-container ul.line-legend{list-style:none; padding:0; margin-top:20px; width:100%;}
.legend-container ul li{display:inline-block; margin:0 5px 2px 0; min-width:160px;}
.legend-container ul li span{display:inline-block; width:12px; height:12px; margin:0 5px 0px 0; color:#303030;}
.graph-user {background: @User-colour;}
/* ==========================================================================
awesome checkbox
========================================================================== */
.checkbox-centre {width:20px; margin:0 auto; text-align:left;}
/* ==========================================================================
bootstrap datetimepicker
========================================================================== */
.bootstrap-datetimepicker-widget {color:#303030;}
.date .input-group-addon {background:@User-colour;color:contrast(@User-colour); border-color:@User-colour;}
.Detail_Highlight .date .input-group-addon {background:darken(@User-colour, 10%); border-color:darken(@User-colour, 10%);color:contrast(@User-colour);}
/* ==========================================================================
twitter - typeahead
========================================================================== */
.twitter-typeahead {margin-bottom:5px;}
.tt-dropdown-menu .tt-suggestion, .tt-menu .tt-suggestion {word-wrap:break-word;}
.tt-dropdown-menu .tt-suggestion.tt-cursor, .tt-menu .tt-suggestion.tt-cursor, .tt-dropdown-menu .tt-suggestion:hover, .tt-menu .tt-suggestion:hover {color:contrast(@User-colour); background:@User-colour;}
/* ==========================================================================
Agreement
========================================================================== */
.Wrapper_Agreement_Checkox_Instruction{font-size:1.2em; font-weight:100; color:contrast(@User-colour); padding-bottom:15px;}
/* ==========================================================================
Footer
========================================================================== */
footer {
    padding: 20px 0;
    background: @User-background;
    color: contrast(darken(@User-background, 2%));
}
@media (max-width: 992px) {
	footer .col-md-2, footer .col-md-3, footer .col-md-4 {text-align:center; padding:0 0 10px;}
}
footer h5 {color:contrast(darken(@User-background, 2%));}
footer a {color:contrast(@User-background, @User-colour-link, #ffffff);}
footer a:focus { outline: none; color:contrast(@User-background, lighten(@User-colour-link, 20%), darken(#ffffff, 20%)); text-decoration:none;}
/* * Improves readability when focused and also mouse hovered in all browsers. */
footer a:active, a:hover { outline: 0; color:contrast(@User-background, lighten(@User-colour-link, 20%), darken(#ffffff, 20%));}
footer .container-fluid {background-color: transparent; padding:0;}
footer .row {padding:20px 0;}
footer .Font_Footnote {color:contrast(@User-background);}
.Image_Logo_Footer {max-width:100%; max-height:80px; margin:12px 15px 0;}
.Image_Logo_Footer_Partner {max-width:100%; max-height:50px; margin:12px 15px 0;}