/*===========================================
	FONTS
===========================================*/
@font-face {
	font-family: 'Default-Light';
		src: url('/asset-fonts/OpenSans-Light.ttf') format('truetype');
}
@font-face {
	font-family: 'Default-Regular';
		src: url('/asset-fonts/OpenSans-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Default-Bold';
		src: url('/asset-fonts/OpenSans-Bold.ttf') format('truetype');
}

@font-face {
    font-family: GDSTransportRegular;
    font-style: normal;
    font-weight: 400;
    src: url('/asset-fonts/GDS Transport Regular.woff') format('woff');
	font-display: fallback;
}
@font-face {
    font-family: GDSTransportBold;
    font-style: normal;
    font-weight: 700;
    src: url('/asset-fonts/GDS Transport Bold.woff') format('woff');
	font-display: fallback;
}


* {
	margin: 0;
	padding: 0;
}

body {
	font-family: 'Default-Regular', sans-serif, Arial, 'Hiragino Sans GB', 'Microsoft YaHei';
	font-weight: 300;
	font-size: 16px;
	color: #000;
	background-color: #FFFFFF;
	padding: 0;
	margin: 0;
}

html,
body {
	height: 100%;
}

ul,
li {
	list-style: none;
	margin: 0;
	padding: 0;
}


/*===========================================
	HEADERS
===========================================*/
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	padding: 0;
	letter-spacing: 0px;
	padding-bottom: 10px;
}

h1 {
	font-size: 1.5em;
}

h2 {
	font-family: 'Default-Bold';
	font-size: 1.25em
}

h3 {
	font-family: 'Default-Regular';
	font-size: 1.15em;
}


/*===========================================
	PARAGRAPHS & TEXT
===========================================*/
p {
	text-align: left;
	font-size: 1em;
	margin: 0 0 1em 0;
	line-height: 1.40em;
}

.small-text {
	font-size: 0.8em;
	line-height: 1.4em;
	text-align: left
}

.bold-text {
	font-family: Default-Bold;
}


/*===========================================
	HYPERLINKS
===========================================*/
a:link,
a:active,
a:visited {
	text-decoration: none;
	color: #171717;
	transition: color 0.3s linear;
	-webkit-transition: color 0.3s linear;
	-moz-transition: color 0.3s linear;
}

a:hover {
	text-decoration: underline;
	color: #121212;
}

/*===========================================
	IMAGES
===========================================*/
img {
	max-width: 100%;
	height: auto;
}

div {
	outline: none;
}


/*===========================================
	ALIGNMET
===========================================*/
.text-left {
	text-align: left;
}

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

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


/*===========================================
	SPACING
===========================================*/


/*===========================================
	CLEAR FIXES
===========================================*/
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
}

.clearfix {
	*zoom: 1;
}


/*===========================================
	HIDDEN
===========================================*/
.hidden-section {
	display: none;
}


/*===========================================
	SHADOWS
===========================================*/
.box-shadow {
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}


/*===========================================
	BUTTONS
===========================================*/
a.button,
span.button {
	display: inline-block;
	padding: 6px 20px;
	color: #FFF;
	background: #BBB;
	text-align: center;
	text-decoration: none;
	moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	cursor: pointer;
}

a.button:hover,
span.button:hover {
	background: #CCC;
}

a.button.dark-blue,
span.button.dark-blue {
	display: block;
	padding: 14px 20px;
	color: #FFF;
	background: #0c5e96;
	font-size: 0.8em;
}

a.button.dark-blue:hover,
span.button.dark-blue:hover {
	background: #0f75bc;
}


/*===========================================
	FRAME CONTAINERS
===========================================*/
.page-container {
	/*background: pink;*/
}

.center-container-max {
	position: relative;
	margin: 0 auto;
	width: calc(100% - 64px);
	margin: 0 32px;
}

.center-container {
	position: relative;
	margin: 0 auto;
	max-width: 980px;
}

.center-container.narrow-frame {
	max-width: 780px;
	padding: 0;
}

.center-container-vmiddle {
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 100%;
	text-align: left;
	width: 100%;
}

.center-container-vmiddle.center-content {
	align-items: center;
}


/*===========================================
	FLEX CONTAINERS
===========================================*/
.flex-container {
	display: flex;
	flex-wrap: wrap;
}

/*	HALFES 	*/
.flex-container .flex-one-half-margin {
	width: 49%;
	margin: 0 2% 0 0;
}

.flex-container .flex-one-half-margin:nth-child(2n),
.flex-container .flex-one-half-margin:last-child {
	margin-right: 0;
}

/*	THIRDS 	*/
.flex-container .flex-one-third-margin {
	width: 32.66%;
	margin: 0 1% 0 0;
}

.flex-container .flex-one-third-margin:nth-child(3n),
.flex-container .flex-one-third-margin:last-child {
	width: 32.68%;
	margin: 0 0 0 0;
}


/*===========================================
	PAGE HEADER
===========================================*/
.page-header-container {
	display: block;
	border-bottom: 1px solid #F2F2F2;
	padding: 20px 0;
}

.page-header-container .company-branding {
	text-align: center;
}

.page-header-container .company-branding img {
	padding: 10px;
	width: 200px;
}


/*===========================================
	PAGE CONTENT
===========================================*/
.page-content-container {
	padding: 20px 10px;
}


/*===========================================
	DAHSBOARD
===========================================*/
.dashboard-buttons a {
	display: block;
	padding: 20px 10px;
	color: #FFF;
	background: #0f75bc;
	width: calc(49% - 20px);
	margin: 0 2% 10px 0;
	text-align: center;
	text-decoration: none;
	moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

.dashboard-buttons a:nth-child(2n),
.dashboard-buttons a:last-child {
	margin-right: 0;
}

.dashboard-buttons a:hover {
	background: #0c5e96;
}


/*===========================================
	VOUCHER LOOKUP
===========================================*/
.voucher-lookup {
	color: #0b0c0c;
	font-family: GDSTransportRegular, arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-weight: 400;
	margin-top: 30px;
}

.voucher-lookup h1 {
	font-family: GDSTransportBold, arial, sans-serif;
	font-size: 3rem;
	line-height: 1.04167;
	margin-bottom: 20px;
}

.voucher-lookup h2 {
	font-family: GDSTransportBold, arial, sans-serif;
	font-size: 2em;
	line-height: 1.04167;
	margin-bottom: 20px;
}

.voucher-lookup h4 {
	font-family: GDSTransportBold, arial, sans-serif;
	font-size: 1em;
}

.voucher-lookup a.std-link {
	display: block;
	font-family: GDSTransportRegular, arial, sans-serif;
	font-size: 1em;
	color: #1d70b8;
	text-decoration: underline;
	margin-bottom: 20px;
	cursor: pointer;
}

.voucher-lookup a.std-link:hover {
	color: #003078;
}

.voucher-lookup label {
	margin-top: 20px;
	color: #0b0c0c;
	font-size: 1em;
}

.voucher-lookup input {
	font-size: 1em;
	width: 125px;
	padding: 15px 10px;
	border: 2px solid #0b0c0c;
}

.voucher-lookup input:focus {
	outline: 3px solid #fd0;
	outline-offset: 0;
	box-shadow: inset 0 0 0 2px;
	border: 2px solid #0b0c0c;
}

.voucher-lookup input.validation-error {
	border-color: #d4351c;
}

.voucher-lookup .govbutton {
	font-family: GDSTransportRegular, arial, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-weight: 400;
	font-size: 16px;
	font-size: 1rem;
	line-height: 1.1875;
	box-sizing: border-box;
	display: inline-block;
	position: relative;
	width: 100%;
	margin: 0 0 22px;
	padding: 8px 10px 7px;
	border: 2px solid rgba(0, 0, 0, 0);
	border-radius: 0;
	color: #fff;
	background-color: #00703c;
	box-shadow: 0 2px 0 #002d18;
	text-align: center;
	vertical-align: top;
	cursor: pointer;
	-webkit-appearance: none;
	text-decoration: none;
}

.voucher-lookup span.govbutton {
	display: block;
	width: 150px;
	cursor: pointer;
	margin-top: 20px;
}

.voucher-lookup span.govbutton:hover {
	background-color: #005a30;
}


.voucher-lookup .searching-postcode {
	border: 5px solid #00703c;
	padding: 20px;
	margin-bottom: 50px;
	text-align: center;
}

.voucher-lookup .searching-postcode img {
	width: 50px;
}

.voucher-lookup .unclaimed-vouchers,
.voucher-lookup .claim-complete {
	border: 5px solid #00703c;
	padding: 20px;
	margin-bottom: 50px;
}

.voucher-lookup .unclaimed-vouchers input {
	width: 200px;
}

.voucher-lookup .unclaimed-vouchers ul li {
	float: left;
	margin-right: 20px;
}

.voucher-lookup .unclaimed-vouchers .process-image {
	margin-bottom: 20px;
	text-align: center;
}

.voucher-lookup .unclaimed-vouchers .process-image img {
	width: 50px;
}


.voucher-lookup .unclaimed-vouchers a.govbutton,
.voucher-lookup .unclaimed-vouchers span.govbutton,
.voucher-lookup .claim-complete span.govbutton {
	display: block;
	width: 250px;
	cursor: pointer;
	margin: 0;
}

.voucher-lookup .unclaimed-vouchers span.govbutton:hover,
.voucher-lookup .unclaimed-vouchers a.govbutton:hover {
	background-color: #005a30;
}



.checkbox-item {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.checkbox-item .checkbox-selector {
	position: relative;
	width: 44px;
	margin-right: 16px;
}

.checkbox-item .checkbox-selector input[type='checkbox'] {
	text-align: center;
	appearance: none;
	height: 44px;
	width: 44px;
	padding: 8px;
	/* adjust this to control the space between border and background */
	margin-right: 12px;
	border: 2px solid #000;
	border-radius: 50%;
	cursor: pointer;
	background-color: #FFF;
	background-clip: content-box;
	box-sizing: border-box;
}

.checkbox-item .checkbox-selector input[type='checkbox']:checked {
	border: 3px solid #000;
	background-color: #000;
}

.checkbox-item .checkbox-selector input[type='checkbox']:focus {
	box-shadow: 0 0 0 4px #fd0;
}

.checkbox-item .checkbox-label {
	width: calc(100% - 60px);
	min-height: 44px;
}





/*===========================================
	SURFACE AREA CALCULATOR
===========================================*/
.surface-area-selector {
	margin: 0 auto;
	width: 400px;
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 20px;
}

.surface-area-selector .item-selector {
	width: calc(50% - 21px);
	padding: 10px;
	margin: 0;
	background: #F9F9F9;
	border-right: 1px dashed #DEDEDE;
	text-align: center;
	cursor: pointer;
}

.surface-area-selector .item-selector:hover {
	background: #F5F5F5;
}

.surface-area-selector .item-selector.active {
	color: #FFF;
	background: #0f75bc;
}

.surface-area-selector .item-selector:nth-child(1),
.surface-area-selector .item-selector:nth-child(2) {
	border-bottom: 1px dashed #DEDEDE;
}

.surface-area-selector .item-selector:nth-child(2n),
.surface-area-selector .item-selector:last-child {
	width: calc(50% - 20px);
	border-right: 0;
}

.surface-area-selector .item-selector h5 {
	font-size: 16px;
	padding-bottom: 0;
}

.surface-area-selector .item-selector img {
	padding-bottom: 10px;
}


/*===========================================
	ROOD CALCULATOR
===========================================*/
.roof-calculation {
	margin-top: 20px
}

.roof-calculation ul {
	margin-left: 15px;
	padding-left: 15px;
	list-style: none;
	padding-bottom: 0em;
}

.roof-calculation ul li {
	font-size: 0.8em;
	line-height: 1.3em;
	list-style-type: disc;
	padding-bottom: 0.5em;
}

.roof-calculation ul ul {
	margin-left: 0;
	list-style: none;
}

.roof-calculation ul li li {
	line-height: 0.9em;
	list-style-type: none;
}

.roof-total-area {
	display: inline-block;
	color: #FFF;
	background: #0f75bc;
	padding: 5px 10px;
	margin-bottom: 20px;
	moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}


/*===========================================
	SPACEWRAP
===========================================*/
.SpaceWrapTotalTable label,
.NegotiatedPrice label,
.CommissionBreakdown label {
	padding: 2px 4px;
	background: #0f75bc;
	color: #FFF;
	font-family: 'Default-Regular';
	width: calc(100% - 8px);
}

.NegotiatedPrice .NegotiatedCommissionTable label {
	font-family: 'Default-Bold';
	display: block;
	text-align: left;
	width: 100%;
	font-size: 0.8em;


	padding: 0;
	background: none;
	color: #54595F;
}

.CommissionTable,
.NegotiatedCommissionTable {
	padding-bottom: 10px;
}

.CommissionTable span,
.NegotiatedCommissionTable span {
	font-size: 0.8em;
	moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

.CommissionTable .commisson-highlight,
.NegotiatedCommissionTable .commisson-highlight {
	padding: 2px 4px;
	background: #0f75bc;
	color: #FFF;
}

/*===========================================
	PAGE FOOTER
===========================================*/
.page-footer {
	border-top: 1px solid #F2F2F2;
	padding: 20px 10px;
	text-align: center;
}


/*===========================================
	SPACING
===========================================*/
.MarginBottom20 {
	margin-bottom: 20px;
}

.MarginBottom30 {
	margin-bottom: 30px;
}

/*===========================================
	COLORS
===========================================*/
.ImageColourOverlay {
	background-color: rgba(1, 44, 104, 0.5);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*===========================================
	CLEAR FIXES
===========================================*/
.ClearFix:before,
.ClearFix:after {
	content: "";
	display: table;
}

.ClearFix:after {
	clear: both;
}

.ClearFix {
	*zoom: 1;
}


/*===========================================
	HIDDEN
===========================================*/
.HiddenSection,
.HideContiner,
.HideItem,
.hide-item {
	display: none;
}

/*===========================================
	DISPLAY SQL
===========================================*/
.DisplaySQL {
	background: #f9f9f9;
	border-left: 10px solid #ccc;
	margin: 1.5em 0px 1.5em 0px;
	padding: 0.5em 10px;
	font-size: 12px;
}

.DisplaySQL .Title {
	padding-bottom: 10px;
}

.DisplaySQL pre {
	white-space: pre-wrap;
	/* css-3 */
	white-space: -moz-pre-wrap;
	/* Mozilla, since 1999 */
	white-space: -pre-wrap;
	/* Opera 4-6 */
	white-space: -o-pre-wrap;
	/* Opera 7 */
	word-wrap: break-word;
	/* Internet Explorer 5.5+ */
}


/*===========================================
	SHADOWS
===========================================*/
.BoxShadow {
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}


/*===========================================
	FLEX CONTAINERS
===========================================*/
.flex-container,
.FlexContainer {
	display: flex;
	flex-wrap: wrap;
}

/*	Full Width - No Margin 	*/
.FlexContainer .FlexFullWidth_NoMargin {
	flex-basis: 100%;
}

/*	HALFES - No Margin 	*/
.FlexContainer .FlexOneHalf_NoMargin {
	flex-basis: 50%;
}

/*	HALFES - Margin 	*/
.FlexContainer .FlexOneHalf_Margin {
	flex-basis: 49.5%;
	margin: 0 1% 0 0;
}

.FlexContainer .FlexOneHalf_Margin:nth-child(2n),
.FlexContainer .FlexOneHalf_Margin:last-child {
	margin: 0;
}

/*	THIRDS 	*/
.FlexContainer .FlexOneThird_Margin {
	flex-basis: 32.66%;
	margin: 0 1% 0 0;
}

.FlexContainer .FlexOneThird_Margin:nth-child(3n),
.FlexContainer .FlexOneThird_Margin:last-child {
	flex-basis: 32.68%;
	margin: 0 0 0 0;
}

.FlexContainer .FlexOneThird_NoMargin {
	flex-basis: 33.33%;
	margin: 0;
}

.FlexContainer .FlexOneThird_NoMargin:nth-child(3n),
.FlexContainer .FlexOneThird_NoMargin:last-child {
	flex-basis: 33.34%;
}

/*	QUARTERS 	*/
.FlexContainer .FlexOneQuarter_Margin {
	flex-basis: 24.25%;
	margin: 0 1% 0 0;
}

.FlexContainer .FlexOneQuarter_Margin:nth-child(4n),
.FlexContainer .FlexOneQuarter_Margin:last-child {
	margin: 0 0 0 0;
}


/*	FIFTHS 	*/
.FlexContainer .FlexOneFifth_NoMargin {
	flex-basis: 20%;
	margin: 0;
}

.FlexContainer .FlexOneFifth_Margin {
	flex-basis: 19.2%;
	margin: 0 1% 0 0;
}

.FlexContainer .FlexOneFifth_Margin:nth-child(5n),
.FlexContainer .FlexOneFifth_Margin:last-child {
	margin: 0 0 0 0;
}


/*===========================================
	FIXED SIZED CONTAINERS
===========================================*/
.OneHalf_Margin {
	float: left;
	width: 49%;
	margin-right: 2%;
}

.OneHalf_Margin:nth-child(2n),
.OneHalf_Margin:last-child {
	margin-right: 0%;
}


/*===========================================
	FRAME CONTAINERS
===========================================*/
.center-container-max {
	position: relative;
	margin: 0 auto;
	width: calc(100% - 64px);
	margin: 0 32px;
}

.center-container-narrow {
	position: relative;
	margin: 0 auto;
	max-width: 780px;
	padding: 0 10px;
}

.CenterContainer {
	position: relative;
	margin: 0 auto;
	max-width: 1176px;
	padding: 0;
}

.CenterContainer.NarrowFrame {
	max-width: 600px;
	padding: 0;
}

.StandardContainer {
	position: relative;
	max-width: 1176px;
	padding: 0;
}


.ContentContainer_VMiddle {
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 100%;
	text-align: left;
	width: 100%;
}

.ContentContainer_VMiddle.CenterContent {
	align-items: center;
}


/*===========================================
	CONTAINERS
===========================================*/
.ContentContainer_Middle {
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 100%;
	text-align: left;
	width: 80%;
}

.content-container-vmiddle {
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 100%;
	text-align: left;
	width: 100%;
}

.content-container-vmiddle.center-content {
	align-items: center;
}


.BoxedShadowContainer {
	padding: 40px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	margin-bottom: 15px;
}

.BoxedShadowContainer.NarrowContainer {
	padding: 10px 40px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	margin-bottom: 15px;
}

.OneQuarter_Margin {
	float: left;
	width: 24.25%;
	margin: 0 1% 20px 0;
}

.ThreeQuarter {
	float: left;
	width: 74.75%;
	margin: 0 1% 20px 0;
}

.ThreeQuarter:last-child {
	margin: 0 0 20px 0;
}


/*===========================================
	APPLICATION HEADER
===========================================*/
.login-header {
	text-align: center;
	height: 80px;
	background: #c20029;
}

.login-header .company-logo {
	width: 150px;
	height: 80px;
}

.login-header .company-logo img {}


/*===========================================
	LOGIN NOTIFICATION
===========================================*/
.login-header-notification {
	padding: 16px 0;
	margin-bottom: 30px;
	background-color: #FFEDED;
	box-shadow: 0px 4px 4px rgba(209, 209, 209, 0.15);
}

.login-header-notification .response-notification {
	display: flex;
	justify-content: center;
	align-items: center;
}

.login-header-notification .response-notification .status-icon {
	width: 40px;
	font-size: 1.5em;
	color: #f7233d;
}

.login-header-notification .response-notification .status-message {
	width: calc(100% - 40px);
	color: #040505;
}

/*	Success messages */
.login-header-notification.Success {
	background-color: #CDFAF7;
}

.login-header-notification.Success .response-notification .status-icon {
	color: #009191;
}


/*===========================================
	APPLICATION HEADER TITLE
===========================================*/
.login-header-title {
	margin: 50px 0;
	color: #000000;
}

.login-header-title h1 {
	font-size: 2em;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
}

.login-header-title p {
	text-align: center;
	line-height: 1.3em;
	margin: 10px 0 0 0;
}


/*===========================================
	APPLICATION LOGIN
===========================================*/
.application-login {
	margin: 0 auto;
	max-width: 380px;
}

.application-login p {
	text-align: center;
}

.application-login a {
	color: #0072CE;
	font-weight: 700;
	display: flex;
	justify-content: center;
	text-align: center;
	text-decoration: underline;
	margin-top: 10px;
}

.application-login label {
	display: block;
	font-family: 'Default-Bold';
	text-align: left;
	font-size: 16px;
	color: #001d4b;
	line-height: 24px;
	margin-bottom: 5px;
}

.application-login input {
	width: 100%;
	font-size: 16px;
	font-weight: 400 !important;
	border-color: #C1C7D0;
	color: #00012e;
	outline: 0;
	height: 56px;
	padding: 9px 8px;
	margin: 0;
	box-sizing: border-box;
	border: 1px solid #979797;
	moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}

.application-login input:focus {
	border: 2px solid rgb(0, 114, 206);
}



/*===========================================
	FORM QUESTIONS
===========================================*/
.application-login .form-item .form-question {
	margin-bottom: 30px;
}


.application-login .form-item .form-question.validation-error .validation-message {
	color: #f6001e;
	margin-top: 10px;
}


/*===========================================
	LOGIN BUTTON
===========================================*/
.application-login .form-button-control {
	margin-top: 32px;
	text-align: center;
}

.application-login .form-button-control.center-item {
	justify-content: center;
}

.application-login .form-button-control span {
	display: inline-block;
	background-color: #040505;
	border-radius: 100px;
	padding: 20px 32px;
	text-align: center;
	color: #FFF;
	min-width: 90px;
	text-decoration: none;
	cursor: pointer;
}

.application-login .form-button-control span:hover {
	background-color: #545454;
	box-shadow: 0 4px 4px 0 rgb(0 0 0 / 20%);
}

.application-login .form-question.validation-error .validation-message {
	color: #f6001e;
	margin-top: 10px;
}

.application-login .form-question.validation-error input {
	border: 2px solid #f6001e;
}





/*
.LoginPage {
	height: 100%;
}
	.LoginPage .ImageBackground {
		position: relative;
		float: left;
		width: 100%;
		height: 100%;
	}
		.LoginPage .ImageBackground .DisplayImage {
			background-size: cover;
			height: 100%;
			width: 100%;
		}
	
	.LoginPage .LoginForm {
		margin: 0 auto;
		max-width: 380px;
		padding: 0 110px;
		height: 100%;
		background-color:rgba(255, 255, 255, 0.85);
	}	
	
		.LoginPage .LoginForm .Header {
			height: 150px;
			text-align: center;
		}
			.LoginPage .LoginForm .Header .CompanyLogo img {
				width: 250px;
				padding-top: 45px;
			}
			
		.LoginPage .LoginForm .AuthenticationForm {
			height: calc(100% - 300px);
		}	
			.LoginPage .LoginForm .AuthenticationForm form{
				width: 100%;
			}
			.LoginPage .LoginForm .AuthenticationForm h2 {
				font-family: 'Default-Light';
				text-align: left;
				padding-bottom: 15px;
				font-size: 2.8em;
				font-weight: 300;
				letter-spacing: -.025em;
				line-height: 1.2
			}
			
			.LoginPage .LoginForm .AuthenticationForm input {
				line-height: 48px;
				width: 100%;
				padding: 0 15px;
				font-size: 15px;
				margin: 0 0 15px 0;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				border-radius: 3px;
			}
		
			.LoginPage .LoginForm .AuthenticationForm ul {
				margin-bottom: 25px;
			}
				.LoginPage .LoginForm .AuthenticationForm ul li {
					float: left;
					width: 50%;
				}
					.LoginPage .LoginForm .AuthenticationForm ul li:last-child {
						text-align: right;
					}
					.LoginPage .LoginForm .AuthenticationForm ul li a {
						color: #495463;
						font-size: 0.9em;
					}
		
		
		.LoginPage .LoginForm .Footer {
			height: 150px;
		}
			.LoginPage .LoginForm .Footer p {
				font-size: 0.8em;
			}
			.LoginPage .LoginForm .Footer ul {
				margin-bottom: 10px;
			}
				.LoginPage .LoginForm .Footer ul li {
					float: left;
					font-size: 0.8em;
					margin-right: 10px;
				}
					.LoginPage .LoginForm .Footer ul li:last-child {
						margin-right: 0;
					}
					
					.LoginPage .LoginForm .Footer ul li a {
						color: #495463;
					}
					
					
			.LoginPage .LoginForm .ButtonDisplay a.SaveButton {
				float: left;
				display: block;
				padding: 12px 0;
				width: 100%;
				text-align: center;
				color: #FFF;
				background: #8cc63f;
				-moz-border-radius: 3px;
				-webkit-border-radius: 3px;
				border-radius: 3px;
			}		
				.LoginPage .LoginForm .ButtonDisplay a.SaveButton:hover {
					text-decoration: none;
				}
				
			.LoginPage .LoginForm input.ValidateError {
				border: 1px solid #ff6868;
			}*/

/*===========================================
	FORM VALIDATION NOTIFICATION
===========================================*/
.LoginPage .FormValidationNotification .SectionContentNote {
	padding: 10px;
	color: #00b975;
	background: #cdffed;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border-left: 5px solid #00b975;
	margin-bottom: 15px;
}

.LoginPage .FormValidationNotification .SectionContentNote.Failure {
	color: #ff6868;
	background: #ffeded;
	border-left: 5px solid #ff6868;
}

.LoginPage .FormValidationNotification .SectionContentNote h2 {
	font-size: 16px;
	margin-bottom: 3px;
}

.LoginPage .FormValidationNotification .SectionContentNote p {
	font-size: 1em;
	line-height: 1.4em;
	margin: 0;
}

.LoginPage .FormValidationNotification .SectionContentNote .NotificationIcon {
	width: 40px;
	margin-right: 10px;
}

.LoginPage .FormValidationNotification .SectionContentNote .NotificationIcon i {
	font-size: 2em;
}

.LoginPage .FormValidationNotification .SectionContentNote .NotificationDetails {
	width: calc(100% - 50px);
}


/*.LoginPage {
	height: 100%;
	background: #FFF;
}
	.LoginPage .ImageBackground {
		position: relative;
		float: left;
		width: 60%;
		height: 100%;
	}
		.LoginPage .ImageBackground .DisplayImage {
			background-image: url(/Images/Uploaded/images/CompanyBranding/family_time.jpg);
			background-size: cover;
			height: 100%;
		}
		
			.LoginPage .ImageBackground .DisplayImage .HeroContent h2 {
				font-family: 'Default-Light';
				text-align: left;
				color: #FFF;
				font-size: 3.5em;
				line-height: 1.2;
				margin: 0 0 30px 0;
				font-weight: normal;
			}
			.LoginPage .ImageBackground .DisplayImage .HeroContent h3 {
				font-family: 'Default-Light';
				color: #013a71;
				font-size: 2.5em;
				line-height: 1.5em;
				margin: 0;
			}
			.LoginPage .ImageBackground .DisplayImage .HeroContent h4 {
				font-family: 'Default-Light';
				text-align: left;
				color: #FFF;
				font-size: 1.5em;
				font-weight: 400;
				padding: 0 0 10px 0;
				margin: 0;
			}
			.LoginPage .ImageBackground .DisplayImage .HeroContent p {
				font-family: 'Default-Light';
				text-align: left;
				color: #FFF;
				font-size: 1em;
				padding: 0 0 10px 0;
				margin: 0;
			}		
	
	.LoginPage .LoginForm {
		float: left;
		width: 40%;
		height: 100%;
	}
		.LoginPage .LoginForm .ContentContainer_Middle {
			width:80%;
		}
			.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm {
				width: 100%;
			}
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .CompanyLogo {
					width: 100%;
					text-align: center;
					padding-bottom: 30px;
				}
					.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .CompanyLogo img {
						width: 350px;
					}
				
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm h2 {
					font-size: 2em
				}
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm h4 {
					padding-bottom: 20px;
				}
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm p {
					font-size: 0.8em;
				}
				
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm label {
					color: #666666;
					font-size: 0.9em;
					font-weight: normal;
				}
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .ResetPassword {
					padding: 10px 0;
				}
					.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .ResetPassword a {
						color: #666666;
						font-size: 0.8em;
						text-decoration: none;
					}
					
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .LoginResponse-Failure,
				.LoginResponse-Failure {
					border-left: solid 3px #FF4F68;
					margin-bottom: 20px;
					padding: 2px 0 2px 10px;
					font-size: 12px;
					color: #72777A;
				}
				.LoginPage .LoginForm .ContentContainer_Middle .AuthenticationForm .LoginResponse-Success,
				.LoginResponse-Success {
					border-left: solid 3px #23FF7C;
					margin-bottom: 20px;
					padding: 2px 0 2px 10px;
					font-size: 12px;
					color: #72777A;
				}*/


/*===========================================
	LOGIN ACCOUNT APPLICATION PAGE
===========================================*/
.LoginPage.AccountApplication {}

.LoginPage.AccountApplication .LoginForm .ContentContainer_Middle .AuthenticationForm .CompanyLogo {
	padding-bottom: 100px;
}

.LoginPage.AccountApplication .LoginForm .ContentContainer_Middle .AuthenticationForm p {
	font-size: 1em;
}


/*===========================================
	APPLICATION REVIEW
===========================================*/
.ApplicationReview {
	flex-basis: 100%;
	font-family: 'Default-Light';
	font-size: 0.9em;
}

.ApplicationReview .FlexContainer {
	margin-bottom: 20px;
}

.ApplicationReview .FlexContainer:last-child {
	/*margin-bottom: 0px;*/
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin {
	flex-basis: calc(50% - 12px);
	padding: 6px;
	text-align: right;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin:nth-child(2n) {
	text-align: left;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin .IdentificationContainer {
	text-align: center;
	padding: 0 10px;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin .IdentificationContainer p {
	font-size: 1em;
	text-align: center;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin .IdentificationContainer p:last-child {
	margin-bottom: 0;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin .IdentificationContainer i {
	display: block;
	font-size: 3em;
	padding-bottom: 10px;
	color: #086788;
	text-align: center;
}

.ApplicationReview .FlexContainer .FlexOneHalf_NoMargin .IdentificationContainer i.fa-times-circle {
	color: #912323;
}

.ApplicationReview .ButtonManagement {
	display: block;
	text-align: center;
}

.ApplicationReview .ButtonManagement .Button {
	display: inline-block;
	height: 35px;
	line-height: 35px;
	padding: 0 35px;
	border: 1px solid #086788;
	background: #086788;
	color: #FFF;
	text-decoration: none;
	margin-right: 0;
	font-size: 0.9em;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

/*===========================================
	PAGE CONTAINER
===========================================*/
.PageMainContainer {
	background: #FFF;
	min-height: 100%;
}

.PageMainContainer.FlexContainer {
	flex-direction: row;
}

.PageMainContainer.FlexContainer .SideBarContainer {
	flex-basis: 350px;
}

.PageMainContainer.FlexContainer .SideBarContainer .SideBar {
	min-height: 100%;
	margin-bottom: -50px;
}

.PageMainContainer.FlexContainer .SideBarContainer .SideBar .FooterPush {
	height: 50px;
}

.PageMainContainer.FlexContainer .SideBarContainer .FooterContainer {
	height: 50px;
}

.PageMainContainer.FlexContainer .SideBarContainer .FooterContainer .FooterContent {
	line-height: 50px;
	text-align: center;
	font-size: 0.7em
}

.PageMainContainer.FlexContainer .MainContentContainer {
	flex-basis: calc(100% - 350px);
}

.PageMainContainer.FlexContainer .MainContentContainer .MainContent {
	padding: 15px;
	padding: 0 15px 15px 15px;
}


/*===========================================
	RESPONSIVE HEADER CONTAINER
===========================================*/
.responsive-page-header {
	display: none;
}

.responsive-page-header .BrandingLogo {
	display: block;
	text-align: center;
}

.responsive-page-header .BrandingLogo img {
	max-width: 250px;
	padding: 20px 10px;
}


/*===========================================
	SIDE BAR CONTACT DETAILS
===========================================*/
.PageMainContainer .contact-details {
	padding: 30px;
	border-bottom: 1px solid #F2F2F2;
	text-align: center;

	display: flex;
	justify-content: center;
	align-items: center;
}

.PageMainContainer .contact-details .icon-disply {
	margin-right: 15px;
}

.PageMainContainer .contact-details .icon-disply .fa-circle {
	color: #ff6200;
}

.PageMainContainer .contact-details .icon-disply .fa-mobile {
	color: #FFF;
}


.PageMainContainer .contact-details .contact-information {}

.PageMainContainer .contact-details .contact-information p {
	font-size: 0.7em;
	line-height: 1em;
	font-weight: 700;
	margin: 0;
}

.PageMainContainer .contact-details .contact-information h2 {
	font-family: 'Default-Regular';
	font-size: 1em;
	padding-bottom: 0;
}


/*===========================================
	SIDE BAR
===========================================*/
.SideBar .BrandingLogo {
	display: block;
	padding: 30px;
	border-bottom: 1px solid #F2F2F2;
	text-align: center;
}

.SideBar .BrandingLogo img {
	max-width: 350px;
	width: 100%
}

.SideBar .ClientBalance {
	border-bottom: 1px solid #F2F2F2;
}

.SideBar .ClientBalance .FlexFullWidth_NoMargin {
	background: #086788;
	border-bottom: 1px solid #F2F2F2;
}

.SideBar .ClientBalance .FlexFullWidth_NoMargin h2 {
	text-align: center;
	padding: 10px;
	color: #FFF;
	font-size: 1em;
}

.SideBar .ClientBalance .FlexFullWidth_NoMargin h2 span {
	font-family: 'Default-Regular';
	font-size: 0.8em;
	font-weight: normal;
}

.SideBar .ClientBalance .FlexOneHalf_NoMargin {
	text-align: center;
	padding: 15px 0;
	background: #e5e5e5;
}

.SideBar .ClientBalance .FlexOneHalf_NoMargin:nth-child(2n) {
	background: #086788;
	color: #FFF;
}

.SideBar .ClientBalance .FlexOneHalf_NoMargin h2 {
	padding: 0;
}

.SideBar .ClientBalance h3 {
	font-weight: 400;
	font-size: 0.9em;
	padding-bottom: 5px;
}


.SideBar .ClientDetails {
	padding: 30px 0;
	text-align: center;
	color: #484848;
}

.SideBar .ClientDetails h2 {
	font-family: 'Default-Light';
	font-weight: 400;
	font-size: 1.5em;
	padding: 0;
}

.SideBar .ClientDetails h2.SubApplicant {
	font-size: 1em;
}

.SideBar .ClientDetails h3 {
	font-family: 'Default-Light';
	font-weight: 400;
	font-size: 1.25em;
	padding: 10px 0 0 0;
}

.SideBar .ClientDetails .ItemDisplay {
	font-size: 0.8em;
	padding: 10px 0 0 0;
}

.SideBar .ClientDetails .AccountTier {
	background: #d2b936;
	display: inline-block;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin-top: 6px;
	font-size: 0.6em;
	text-transform: uppercase;
	font-weight: 700;
	padding: 2px 5px;
}

.SideBar .ClientDetails .AccountTier.Silver {
	background: #c5c7c9;
}

.SideBar .ClientDetails .AccountTier.Platinum {
	background: #e6e7e5;
}

.SideBar .MainNavigation ul li a {
	display: block;
	text-align: right;
	padding: 0 40px;
	background: #e5e5e5;
	color: #54595F;
	height: 46px;
	line-height: 46px;
	margin-bottom: 1px;
	text-decoration: none;
}

.SideBar .MainNavigation ul li a:hover {
	background: #086788;
	color: #FFF;
	transition: background 0.4s linear;
	-webkit-transition: background 0.4s linear;
	-moz-transition: background 0.4s linear;
}

.SideBar .MainNavigation ul li a.Active {
	background: #086788;
	color: #FFF;
}

.SideBar .SubNavigation ul li a,
.SideBar .SubNavigation ul li span {
	font-family: 'Default-Light';
	display: block;
	text-align: right;
	padding: 0 40px;
	background: #FFF;
	color: #7A7A7A;
	height: 46px;
	line-height: 46px;
	margin-bottom: 1px;
	text-decoration: none;
	cursor: pointer;
}

.SideBar .SubNavigation ul li a:hover,
.SideBar .SubNavigation ul li span:hover {
	color: #086788;
}

.SideBar .SubNavigation ul li a.Active {
	color: #086788;
}

.SideBar .SubNavigation ul li span.Active {
	background: #086788;
	color: #FFF;
	transition: background 0.4s linear;
	-webkit-transition: background 0.4s linear;
	-moz-transition: background 0.4s linear;
}

.PageMainContainer.FlexContainer .SideBarContainer .FooterContainer .FooterContent {
	line-height: 50px;
	text-align: center;
	font-size: 0.7em
}


/*===========================================
	PAGE HERO CONTAINER
===========================================*/
.page-hero-container {
	height: 400px;
	background: url('/asset-general-images/hero-background.svg');
}

.page-hero-container img {
	padding-bottom: 40px;
}

.page-hero-container h2 {
	font-family: Default-Light;
	text-align: center;
	color: #FFF;
	font-size: 2em;
	line-height: 1.4;
	margin: 0 10px;
	font-weight: normal;
}


/*===========================================
	PAGE IMAGE
===========================================*/
.PageImageContainer {
	position: relative;
	width: 100%;
	height: 400px;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	margin-bottom: 15px;
}

.PageImageColorOverlay {
	background-color: rgba(134, 113, 138, 0.85);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.PageImageContainer .HeroContent {
	position: absolute;
	text-align: left;
	max-width: 850px;
	left: 50px;
	bottom: 0px;
}

.PageImageContainer .HeroContent h2 {
	font-family: 'Default-Light';
	text-align: left;
	color: #FFF;
	font-size: 3.5em;
	line-height: 1.2;
	margin: 0 0 30px 0;
	font-weight: normal;
}

.PageImageContainer .HeroContent h3 {
	font-family: 'Default-Light';
	color: #013a71;
	font-size: 2.5em;
	line-height: 1.5em;
	margin: 0;
}

.PageImageContainer .HeroContent p {
	font-family: 'Default-Light';
	text-align: left;
	color: #FFF;
	font-size: 1.5em;
	padding: 0 0 10px 0;
	margin: 0;
}


/*===========================================
	FORM ACTION RESPONSE
===========================================*/
.form-action-response {}

.form-action-response .response-layout {
	color: #54595F;
	background: #f8ebe3;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border-left: 6px solid #19bfc0;
	margin-bottom: 15px;
}

.form-action-response .response-layout.failure {
	border-left: 6px solid #FF4F68;
}

.form-action-response .response-layout .response-icon {
	width: 40px;
	text-align: center;
	padding: 15px 0;
	background: #1acbcc;
}

.form-action-response .response-layout.failure .response-icon {
	background: #fd6d82;
}

.form-action-response .response-layout i {
	color: #f8ebe3;
	font-size: 1.75em;
}

.form-action-response .response-layout .response-message {
	width: calc(100% - 60px);
	padding: 10px;
}

.form-action-response .response-layout .response-message p {
	font-size: 0.9em;
	line-height: 1.4em;
	margin: 0;
}


/*===========================================
	CLIENT TOTALS
===========================================*/
.ClientAccountTotalContainer {}

.ClientAccountTotalContainer .ClientAccountTotalItem.FlexOneQuarter_Margin {
	flex-basis: calc(24.25% - 20px);
	padding: 0 9px 0 10px;
	border-right: 1px solid #e5e6e8;
	text-align: center;
}

.ClientAccountTotalContainer .ClientAccountTotalItem.FlexOneQuarter_Margin:nth-child(4n),
.ClientAccountTotalContainer .ClientAccountTotalItem.FlexOneQuarter_Margin:last-child {
	padding: 0 9px 0 10px;
	/*padding: 0 10px;*/
	border-right: none;
}

.ClientAccountTotalContainer .ClientAccountTotalItem i {
	display: block;
	color: #086788;
	font-size: 4em;
	padding-bottom: 10px;
}

.ClientAccountTotalContainer .ClientAccountTotalItem h2 {
	display: block;
	color: #086788;
	font-size: 2em;
	padding-bottom: 10px;
}

.ClientAccountTotalContainer .ClientAccountTotalItem h3 {
	display: block;
	text-transform: uppercase;
	color: #54595F;
	font-size: 1em;
	padding-bottom: 10px;
}

.ClientAccountTotalContainer .ClientAccountTotalItem p {
	text-align: center;
	color: #54595F;
	font-size: 0.8em;
	padding-bottom: 10px;
}

.ClientAccountTotalContainer .ClientAccountTotalItem a {
	display: inline-block;
	font-size: 0.8em;
	padding: 10px 20px;
	background: #086788;
	color: #FFF;
	text-decoration: none;
}

/*===========================================
	ACCOUNT PROFILE
===========================================*/
.ProfileNavigation {
	float: left;
	width: 300px;
	margin-right: 50px;
}

.ProfileNavigation h2 {
	font-family: 'Default-Light';
	font-weight: 400;
	font-size: 1.5em;
	padding: 0 0 10px 0;
	text-align: center;
}

.ProfileNavigation h3 {
	font-family: 'Default-Light';
	font-weight: 700;
	font-size: 1em;
	padding: 0 0 20px 0;
	text-align: center;
	color: #086788;
}

.ProfileNavigation ul {
	background: #FFF;
}

.ProfileNavigation ul li {
	display: block;
	padding: 0;
	background: #e5e5e5;
	height: 40px;
	line-height: 40px;
	margin-bottom: 1px;
	text-decoration: none;
}

.ProfileNavigation ul li .Icon {
	display: inline-block;
	text-align: center;
	width: 50px;
}

.ProfileNavigation ul li .Icon i {
	display: inline-block;
	text-align: center;
	width: 50px;
	color: #086788;
}

.ProfileNavigation ul li a {
	display: inline-block;
	width: calc(100% - 120px);
	border-left: 1px solid #CCC;
	font-family: 'Default-Light';
	font-size: 0.9em;
	text-align: left;
	color: #7A7A7A;
	padding-left: 10px;
}

.ProfileNavigation ul li a:hover {
	font-weight: 700;
	text-decoration: none;
}

.ProfileNavigation ul li a.Active {
	color: #54595F;
	font-weight: 700;
}

.ProfileNavigation ul li .Chevron {
	display: inline-block;
	text-align: center;
	width: 50px;
	line-height: 40px;
	color: #BBB;
}

.ProfileNavigation ul li:hover .Chevron i {
	color: #7A7A7A;
}

.ProfileNavigation ul li .Chevron.Active i {
	color: #086788;
}


.ProfileContent {
	float: left;
	background: #FFF;
	width: -moz-calc(100% - 350px);
	width: -webkit-calc(100% - 350px);
	width: -o-calc(100% - 350px);
	width: calc(100% - 350px);
	z-index: 1;
}

/*===========================================
	CLIENT DOCUMNETS
===========================================*/
.client-documents-display {
	margin-top: 50px;
}

.client-documents-display .document-list {}

.client-documents-display .document-list .document-item {
	padding: 10px 0;
	border-bottom: 1px dashed #DEDEDE;
}

.client-documents-display .document-list .document-item:nth-child(even) {
	background: #F9F9F9;
}

.client-documents-display .document-list .document-item:hover {
	background: #F1F1F1;
	cursor: pointer;
}

.client-documents-display .document-list .document-item .document-empty {
	text-align: center;
	color: #54595F;
	margin-bottom: 5px;
}

.client-documents-display .document-list .document-item .document-details {
	width: calc(100% - 81px);
	padding-right: 10px;
	border-right: 1px solid #DEDEDE;
}

.client-documents-display .document-list .document-item .document-details .document-name {
	margin-bottom: 5px;
}

.client-documents-display .document-list .document-item .document-details .document-name a {
	font-weight: 700;
	color: #54595F;
	text-decoration: none;
}

.client-documents-display .document-list .document-item .document-details .document-date {
	font-size: 0.8em;
}


.client-documents-display .document-list .document-item .document-icon {
	width: 50px;
	padding: 5px 10px;
}

.client-documents-display .document-list .document-item .document-icon i {
	font-size: 48px;
}

/*.ClientDocuments .DocumentItem {
	text-align: center;
}
	.ClientDocuments .DocumentItem i {
		font-size: 48px;
		padding-bottom: 5px;
	}
	.ClientDocuments  .DocumentItem .FileName a {
		display: block;
		color: #54595F;
		font-size: 0.8em;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		text-decoration: none;
	}
	.ClientDocuments .DocumentItem .ModifiedDate {
		font-size: 0.7em;
		padding-bottom: 5px;
	}
	.ClientDocuments .DocumentItem .EditLink span {
		display: inline-block;
		background: #54595F;
		color: #FFF;
		font-size: 0.7em;
		padding: 5px 15px;
		cursor: pointer;
	}*/


/*===========================================
	TRADINGVIEW LAYOUT
===========================================*/
.TradeViewSelect {
	display: none;
}

.TradeViewSelect select {
	font-family: 'Default-Regular', sans-serif, Arial, 'Hiragino Sans GB', 'Microsoft YaHei';
	color: #495057;
	height: 40px;
	border: 1px solid #BFBFBF;
	background: #F9F9F9;
	width: 100%;
	font-size: 14px;
	padding: 0;
	padding-left: 15px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin: 5px 0 10px 0;

}

.TradeViewSide {
	float: left;
	width: 300px;
	margin-right: 50px;
}

.TradeViewSide .TradeViewList {
	height: 500px;
}

.TradeViewSide .TradeViewList.Scrollable {
	overflow: hidden;
	overflow-y: scroll;
}

.TradeViewSide .TradeViewList li {
	display: flex;
	flex-wrap: wrap;

	padding: 5px 10px;
	border-bottom: 1px solid #CCC;
	background: #e5e5e5;
	transition: 0.3s;
	cursor: pointer;
}

.TradeViewSide .TradeViewList li:last-child {
	border-bottom: 0;
}

.TradeViewSide .TradeViewList li .position {
	width: calc(100% - 40px);
	margin-right: 10px;
}

.TradeViewSide .TradeViewList li .position .stock-code {
	font-family: 'Default-Bold';
}

.TradeViewSide .TradeViewList li .position .company-name {
	font-size: 0.8em;
}

.TradeViewSide .TradeViewList li .icon-display {
	width: 30px;
	display: flex;
	justify-content: right;
	align-items: center;

}

.TradeViewSide .TradeViewList li .icon-display i {
	display: none;
	font-size: 1.5em;
}

.TradeViewSide .TradeViewList li.current,
.TradeViewSide .TradeViewList li:hover {
	background: #382960;
	color: #FFF;
}

.TradeViewSide .TradeViewList li.current .icon-display i,
.TradeViewSide .TradeViewList li:hover .icon-display i {
	display: block;
}



.TradeViewContent {
	float: left;
	background: #FFF;
	width: -moz-calc(100% - 350px);
	width: -webkit-calc(100% - 350px);
	width: -o-calc(100% - 350px);
	width: calc(100% - 350px);
	z-index: 1;
}


/*===========================================
	HEADER FILTER BAR
===========================================*/
.HeaderFilterBar {
	margin-bottom: 20px;
}

.HeaderFilterBar .HeaderTitle {
	background: #FFF;
}

.HeaderFilterBar .HeaderTitle {
	padding: 10px 0;
	color: #086788;
	text-transform: uppercase;
	font-size: 1em;
	font-weight: 700;
}

.HeaderFilterBar .HeaderTitle span.LowerCase {
	text-transform: lowercase;
}

.HeaderFilterBar .FilterBar {
	width: 100%;
	background: #E1E1E1;
}

.HeaderFilterBar .FilterBar .FilterBarItems {
	float: right;
}

.HeaderFilterBar .FilterBar .FilterTile {
	float: left;
	height: 100px;
	background: #d5d5d5;
	padding: 0 20px;
	border-left: 1px solid #DEDEDE;
	border-right: 1px solid #D1D1D1;
}

.HeaderFilterBar .FilterBar .FilterTile:first-child {
	border-left: none;
}

.HeaderFilterBar .FilterBar .FilterTile:last-child {
	border-right: none;
}

.HeaderFilterBar .FilterBar .FilterTile:hover {
	background: #D1D1D1;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterLable {
	text-align: center;
	padding-bottom: 5px;
	color: #72777A;
	display: block;
	font-weight: bold;
	width: 100%;
	font-size: 0.65em;
}

.HeaderFilterBar .FilterBar .FilterTile .IconDisplay {
	float: left;
	margin-right: 0px;
	padding: 3px 5px 2px 0;
}

.HeaderFilterBar .FilterBar .FilterTile .IconDisplay i {
	font-size: 1.25em;
	color: #003B95;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay {
	float: left;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay input,
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay select {
	width: 100%;
	padding: 5px;
	margin: 0;
	box-sizing: border-box;
	border: none;
	font-size: 0.9em;
	background: #F1F1F1;
	color: #72777A;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay select {
	background: none;
	padding: 5px 15px 5px 5px;
	cursor: pointer;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay a,
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay span {
	display: block;
	min-width: 80px;
	text-align: center;
	padding: 5px 10px;
	margin: 1px 0;
	background: #003B95;
	color: #FFF;
	font-size: 0.8em;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	cursor: pointer;
	text-decoration: none;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay a i,
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay span i {
	margin-right: 6px;
}

/* Export Data 	*/
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons button {
	background: none;
	padding: 0;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons button span i {
	font-size: 24px;
	cursor: pointer;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons a,
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons span {
	background: none;
	min-width: unset;
	padding: 2px 6px 2px 0;
	margin: 0;
	color: #FFF;
}

.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons a i,
.HeaderFilterBar .FilterBar .FilterTile .FilterDisplay .ExportButtons span i {
	margin-right: 0px;
	font-size: 36px;
}


/*===========================================
	BANNER APPLICATION HEADER
===========================================*/
.BannerHeader {
	background: #FFF;
}

.BannerHeader .HeaderStripe {
	background: #086788;
	height: 24px;
}

.BannerHeader .CenterContainer {}

.BannerHeader .CenterContainer .CompanyLogo {
	padding: 30px 0;
}

.BannerHeader .CenterContainer .CompanyLogo img {
	max-width: 300px;
}

/*===========================================
	TERMS & CONDITIONS
===========================================*/
.TermsAndConditions ol {
	list-style-type: none;
	counter-reset: item;
	margin: 0;
	padding: 0;
}

.TermsAndConditions ol>li {
	display: table;
	counter-increment: item;
	margin-bottom: 1.2em;
}

.TermsAndConditions ol>li:before {
	content: counters(item, ".") ". ";
	display: table-cell;
	padding-right: 0.6em;
}

.TermsAndConditions li ol>li {
	margin: 0;
	padding-bottom: 5px;
}

.TermsAndConditions li ol>li:before {
	content: counters(item, ".") " ";
}


/*===========================================
	INVESTMENT DISPLAY
===========================================*/
.InvestmentDisplayContainer {
	background: #F2F2F2;
	padding: 10px;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader {
	cursor: pointer;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader:hover {
	box-shadow: 0px 4px 8px 0px rgb(0 0 0 / 20%);
}

.InvestmentDisplayContainer.FundingPaymentPlan {
	/*margin-bottom: 20px;*/
}

.InvestmentDisplayContainer .InvestmentContentMiddle {
	display: flex;
	justify-content: left;
	align-items: center;
	height: 100%;
}

.InvestmentDisplayContainer .InvestmentContentMiddle.TextCenter {
	justify-content: center;
}

.InvestmentDisplayContainer .InvestmentContent .InvestmentName {
	display: inline-block;
	font-size: 1em;
	font-weight: 700;
	padding-bottom: 5px;
}

.InvestmentDisplayContainer .InvestmentContent .DisplayItem {
	font-size: 0.8em;
	padding-bottom: 2px;
}

.InvestmentDisplayContainer .InvestmentContent .DisplayItem.AnnualReturn {
	display: none
}


.InvestmentDisplayContainer .ZeroCountItems {}

.InvestmentDisplayContainer .ZeroCountItems p {
	font-size: 0.9em;
	color: #54595F;
	margin: 0;
	text-align: center;
	font-family: 'Default-Light';
}

/***	Investment Header Section	***/
.InvestmentDisplayContainer .InvestmentHeaderContainer {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 10px;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer {
	padding-bottom: 0;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer {
	padding-bottom: 0;
}


/***	Set Sizes	***/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth200 {
	width: 200px;
	flex-shrink: 0;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth150 {
	width: 150px;
	flex-shrink: 0;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135 {
	width: 135px;
	flex-shrink: 0;
	text-align: center;
	color: #FFF;
}

/***	Custom Sizes	***/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow {
	width: calc(100% - 490px);
	padding: 0 10px;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow {
	width: calc(100% - 320px);
	flex-shrink: 0;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .InvestmentOptionsHolder {
	width: 100%;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .InvestmentOptionsHolder .OneQuarterFlexItem {
	float: left;
	width: calc(25% - 11px);
	padding: 0 5px;
	border-right: 1px solid #E0E0E0;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .InvestmentOptionsHolder .OneFifthFlexItem {
	float: left;
	width: calc(20% - 11px);
	padding: 0 5px;
	border-right: 1px solid #E0E0E0;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerHeaderGrow {
	width: calc(100% - 575px);
	flex-shrink: 0;
}


/***	Custom Header Section Layouts	***/
/*	Investment Name	*/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow .InvestmentName {
	display: inline-block;
	font-size: 1em;
	font-weight: 700;
	padding-bottom: 5px;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayItem {
	font-size: 0.8em;
	padding-bottom: 2px;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayItem a {
	color: #54595F;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayItem.AnnualReturn {
	display: none;
}

/*	Bond Purchase Agreement */
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayItem a {
	display: inline-block;
	margin-top: 10px;
	padding: 10px 35px;
	background: #382960;
	color: #FFF;
	text-decoration: none;
}


/*	Investment Options Layput */
.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayLable {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	color: #999999;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayData {
	font-size: 13px;
	color: #113f60;
	padding: 5px 0;
	word-wrap: break-word;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayData.LimitedAvailability,
.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayData.FullyAllocated {
	margin-top: 6px;
	text-align: center;
	line-height: 1em;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	background: #FFBF00;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayData.FullyAllocated {
	color: #FFF;
	background: #D2222D;
}

/*	Total Return	*/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentTotal {
	background: #BBB;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentTotal .DisplayItem {
	font-size: 1em;
	color: #FFF;
	padding: 5px;
	text-align: right;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentTotal .DisplayItem:Last-child {
	padding: 5px;
	border-top: 1px solid #DEDEDE;
	border-bottom: 1px solid #DEDEDE;
}

/*	Annual Return	*/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentAnnualReturn {
	background: #086788;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentAnnualReturn .DisplayItem {
	display: block;
	font-size: 2.25em;
	color: #FFF;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentAnnualReturn .DisplayItem span {
	font-size: 0.5em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentAnnualReturn .DisplayItem.ipo-percentage span {
	font-size: 1em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.InvestmentAnnualReturn .DisplayLable {
	display: block;
	color: #FFF;
	font-size: 13px;
}

/*	IPO Investment Current Price	*/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentCurrentPrice {
	background: #086788;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentCurrentPrice .DisplayItem {
	display: block;
	font-size: 2em;
	color: #FFF;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentCurrentPrice .DisplayItem span {
	font-size: 0.5em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentCurrentPrice .DisplayItem.ipo-percentage span {
	font-size: 1em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentCurrentPrice .DisplayLable {
	display: block;
	color: #FFF;
	font-size: 13px;
}

/*	IPO Investment Stock Value	*/
.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue {
	background: #086788;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue .DisplayItem {
	display: block;
	font-size: 2em;
	color: #FFF;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue .DisplayItem span {
	font-size: 1em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue .DisplayItem span i {
	font-size: 0.5em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue .DisplayItem span span {
	font-size: 0.5em;
}

.InvestmentDisplayContainer .InvestmentHeaderContainer .ContainerWidth135.IPOInvestmentStockValue .DisplayLable {
	display: block;
	color: #FFF;
	font-size: 13px;
}

/*	Investment Option - Annual Return	*/
.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionAnnualReturn {}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionAnnualReturn .DisplayData {
	font-size: 2.5em;
	color: #0072bc;
	padding: 0;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionAnnualReturn .DisplayData span.Symbol {
	font-size: 0.75em;
	color: #0072bc;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionAnnualReturn .DisplayLable {
	font-size: 0.7em;
	font-weight: 700;
	text-transform: uppercase;
	color: #999999;
	padding: 0 0 5px 0;
}

/*	Investment Option - Responsive Display	*/
.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay {
	display: none;
	width: 100%;
	margin-top: 10px;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay .InvestmentOptionResponsiveItem {
	float: left;
	width: calc(50% - 11px);
	padding: 0 5px;
	margin-bottom: 10px;
	border-right: 1px solid #E0E0E0;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay .InvestmentOptionResponsiveItem:nth-child(2n),
.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay .InvestmentOptionResponsiveItem:last-child {
	width: calc(50% - 10px);
	border-right: none;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay .InvestmentOptionResponsiveItem .DisplayLable {
	font-weight: 700;
	font-size: 0.6em;
	text-transform: uppercase;
	color: #999999;
}

.InvestmentDisplayContainer.InvestmentOptionsHeader .InvestmentHeaderContainer .InvestmentOptionResponsiveDisplay .InvestmentOptionResponsiveItem .DisplayData {
	font-size: 0.7em;
	color: #113f60;
	padding: 5px 0;
	word-wrap: break-word;
}


/*	Funding Payment Plan	*/
/*	Main Header	*/
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerHeaderGrow .DisplayItemLarge {
	padding: 5px 0;
	font-size: 1.15em;
	font-weight: 700;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerHeaderGrow .ResponsiveDate,
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerHeaderGrow .ResponsiveStatus,
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerHeaderGrow .ResponsiveAmount {
	display: none;
}

/*	Funding Date	*/
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135.FundingDate {
	background: #0a3443;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135 .DisplayLable {
	font-size: 0.7em;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135 .SubPaymentValue {
	font-size: 0.7em;
	padding-bottom: 5px;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135 .TotalledItem {
	margin-top: 5px;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135 .TotalledItem .PaymentValue {
	font-family: 'Default-Bold';
	margin-top: 5px;
	padding: 2px 0;
	border-top: 1px solid #54595F;
	border-bottom: 1px solid #54595F;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135 .DisplayItem {
	font-size: 0.9em;
}

/*	Funding Amount	*/
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135.FundingAmount {
	color: #54595F;
	background: #BBB;
}

/*	Funding Status	*/
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135.FundingStatus {
	color: #FFF;
	background: #086788;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135.FundingStatus.Complete {
	background: #4caf50;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth135.FundingStatus.Overdue {
	background: #c00000;
}


/*	Funding Proof	*/
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof {
	background: #5892a6;
	padding: 20px 0;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayIcon {
	font-size: 36px;
	padding-bottom: 10px;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayIcon .fa-check-circle,
.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayIcon .fa-file-signature {
	color: #4caf50;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayIcon .fa-file-upload {
	color: #FFF;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayLable {
	font-size: 0.8em;
	color: #FFF;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayLable a {
	color: #FFF;
}

.InvestmentDisplayContainer.FundingPaymentPlan .InvestmentHeaderContainer .ContainerWidth150.FundingProof .DisplayLable a:hover {
	text-decoration: none;
}

/***	/Custom Header Section Layouts	***/


/***	Investment Dividend Payment Section	***/
.InvestmentDisplayContainer .InvestmentDividendPaymentsContainer {}

/***	/Investment Dividend Payment Section	***/


/***	Investment Options Details Container	***/
.InvestmentOptionDetailsContainer {
	position: relative;
	padding: 20px;
	background: #444444;
	color: #ffffff;
}

.InvestmentOptionDetailsContainer .CompanyProfile {
	color: #ffffff;
	font-size: 0.9em;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown {
	display: flex;
	flex-wrap: wrap
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow {
	width: calc(33.33% - 20px);
	padding: 10px 20px 10px 0;
	align-self: center;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayLable {
	font-size: 0.8em;
	font-weight: 400;
	text-transform: uppercase;
	color: #ffffff;
	opacity: 0.7;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayData {
	color: #ffffff;
	padding: 3px 0;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayData a {
	color: #ffffff;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayData.Tooltip {
	position: relative;
	display: inline-block;
	border-bottom: 1px dotted #FFF;
	cursor: pointer;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayData.Tooltip .TooltipText {
	visibility: hidden;
	width: 600px;
	background-color: #FFF;
	color: #000;
	text-align: center;
	border-radius: 6px;
	padding: 5px 0;
	margin-right: 20px;

	/* Position the tooltip */
	position: absolute;
	z-index: 1;
	top: -210px;
	left: 50px;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .FlexItemGrow .DisplayData.Tooltip:hover .TooltipText {
	visibility: visible;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .TooltipContainer {
	display: flex;
	padding: 5px 0;
	margin: 0 20px 5px 20px;
	border-bottom: 1px solid #E0E0E0;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .TooltipContainer:last-child {
	display: flex;
	padding: 5px 0;
	margin: 0 20px;
	border-bottom: none;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .TooltipContainer .FlexItemCode {
	width: 60px;
	flex-shrink: 0;
	font-size: 1.5em;
	color: #0072bc;
	align-self: center;
	text-align: left;
}

.InvestmentOptionDetailsContainer .InvestmentOptionBreakdown .TooltipContainer .FlexItemDescription {
	flex-grow: 1;
	text-align: left;
	align-self: center;
	font-size: 0.8em;
	color: #7A7A7A;
}

/***	/ Investment Options Details Container	***/



/***	Investment Control Section	***/
.InvestmentControlsContainer {
	margin-bottom: 50px;
}

.InvestmentControlsContainer .ControlButtons {
	float: right;
	font-family: 'Default-Light';
	background: #F2F2F2;
	padding-left: 10px;
	padding-bottom: 10px;
}

.InvestmentControlsContainer .ControlButtons a,
.InvestmentControlsContainer .ControlButtons span {
	float: left;
	color: #FFF;
	background: #086788;
	padding: 10px 10px;
	font-size: 0.8em;
	margin-right: 10px;
	cursor: pointer;
}

.InvestmentControlsContainer .ControlButtons a:hover,
.InvestmentControlsContainer .ControlButtons span:hover {
	text-decoration: none
}

.InvestmentControlsContainer .ControlButtons a.Active,
.InvestmentControlsContainer .ControlButtons span.Active {
	background: #323946;
}

/***	/Investment Control Section	***/


/*===========================================
	INVESTMENT DISPLAY
===========================================*/
/*	Investment Dividends */
.InvestmentDividendPayments {
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 10px;
	background: #F2F2F2;
}


/*===========================================
	FUNDING
===========================================*/
/*	Funding Information 	*/
.FundPaymentInformation {
	margin: 50px 0;
}

.FundPaymentInformation.FlexContainer .FlexOneThird_Margin {
	flex-basis: 32%;
	margin: 0 2% 0 0;

}

.FundPaymentInformation.FlexContainer .FlexOneThird_Margin:nth-child(3n),
.FundPaymentInformation.FlexContainer .FlexOneThird_Margin:last-child {
	margin: 0 0 0 0;
}

.FundPaymentInformation h2 {
	font-family: 'Default-Regular';
	font-size: 1em;
	font-weight: 700;
}

.FundPaymentInformation p {
	font-family: 'Default-Light';
	font-size: 0.8em;
}

.FundPaymentInformation ul {
	font-family: 'Default-Light';
	font-size: 0.8em;
	margin: 0 0 0 1em;
}

.FundPaymentInformation li {
	margin: 0 0 1em 0;
}


/*	PROGRESS BAR 	*/
.ProgressBarContianer {
	margin-bottom: 20px;
}

.ProgressBarContianer .ProgressBar {
	height: 50px;
	position: relative;
	background: #e5e5e5;
	padding: 0px;
	-webkit-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
	-moz-box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
	box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
	margin-bottom: 0px;
}

.ProgressBarContianer .ProgressBar:last-child {
	margin-bottom: 0px;
}

.ProgressBarContianer .ProgressBar>span {
	font-size: 0.8em;
	display: block;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.ProgressBarContianer .ProgressBarDisplay small {
	font-size: 0.8em;
	font-weight: 400;
	padding-bottom: 6px;
}

.ProgressBarContianer .ProgressBarDisplay .DisplayCount {
	font-size: 0.7em;
	font-weight: 400;
	padding-bottom: 6px;
}

.ProgressBarContianer .FloatRight {
	float: right;
}

/*	Bottom Values 	*/
.ProgressBarContianer .ProgressValues {
	padding-top: 5px;
	width: 100%;
	font-size: 0.7em;
	background: #F5F5F5;
}

.ProgressBarContianer .ProgressValues .StartValue {
	float: left;
	width: 33%;
	text-align: left;
}

.ProgressBarContianer .ProgressValues .MiddleValue {
	float: left;
	width: 34%;
	text-align: center;
}

.ProgressBarContianer .ProgressValues .FinishValue {
	float: right;
	width: 33%;
	text-align: right;
}

.ProgressBarContianer .BarColour {
	background: #086788;
}


.FundPaymentPlan {
	padding: 50px 0;
	border-bottom: 2px solid #F2F2F2;
}

.FundPaymentPlan.responsive-display {
	display: none;
}


/*===========================================
	DIRECT DEBIT FORM
===========================================*/
.direct-debit-request-form {}

.direct-debit-request-form .flex-container .flex-one-half-margin {
	width: calc(48% - 20px);
	padding: 0 10px;
	margin: 0 4% 0 0;
}

.direct-debit-request-form .flex-container .flex-one-half-margin:nth-child(2n),
.direct-debit-request-form .flex-container .flex-one-half-margin:last-child {
	margin: 0;
}


.direct-debit-request-form .direct-debit-terms {}

.direct-debit-request-form .direct-debit-terms p {
	font-size: 0.8em;
	line-height: 1.57em;
}

.direct-debit-request-form .direct-debit-terms ul {
	margin-left: 15px;
	list-style: none;
	padding-bottom: 1em;
}

.direct-debit-request-form .direct-debit-terms ul li {
	font-size: 0.8em;
	line-height: 1.3em;
	list-style-type: none;
	padding-bottom: 0.5em;
}

.direct-debit-request-form .direct-debit-terms ul ul {
	padding-bottom: 0;
}

.direct-debit-request-form .direct-debit-terms ul ul li {
	font-size: 1em;
}

.direct-debit-request-form .direct-debit-terms ul ul li:last-child {
	padding-bottom: 0;
}

.direct-debit-request-form .direct-debit-terms .divide-line {
	border-bottom: 3px solid #cccccc;
	margin-bottom: 1.5em;
}


/*===========================================
	SIGNATURE DISPLAY
===========================================*/
.signature-display {}

.signature-display .signature-title {
	font-size: 0.8em;
	padding-bottom: 10px;
}

.signature-display .client-signature {}

.signature-display .client-signature img {
	border-bottom: 3px solid #CCC;
	margin-bottom: 10px;
}

.signature-display .signature-name {}

.signature-display .signature-dated {
	font-size: 0.8em;
}


/*===========================================
	INVESTMENT CALCULATOR
===========================================*/
.InvestmentCalculatorContainer {
	background-color: #086788;
	font-family: 'Default-Light';
}

.InvestmentCalculatorContainer .InvestmentCalculator {
	width: calc(100% - 440px);
	padding: 20px;
}

.InvestmentCalculatorContainer .InvestmentCalculator .ButtonControl,
.InvestmentCalculatorContainer .InvestmentCalculatorDetails .ButtonControl {
	float: right;
}

.InvestmentCalculatorContainer .InvestmentCalculator .ButtonControl span.Button,
.InvestmentCalculatorContainer .InvestmentCalculatorDetails .ButtonControl span.Button {
	float: left;
	display: block;
	width: 175px;
	margin-right: 10px;
	background-color: #043444;
	text-align: center;
	font-size: 0.8em;
	padding: 10px;
	cursor: pointer;
	color: #FFF;
}

.InvestmentCalculatorContainer .InvestmentCalculator .ButtonControl span.Button:last-child,
.InvestmentCalculatorContainer .InvestmentCalculatorDetails .ButtonControl span.Button:last-child {
	margin-right: 0;
}


.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorLabel {
	width: calc(100% - 220px);
	margin-right: 20px;
}

.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorLabel label {
	color: #FFF;
	display: block;
	font-weight: 400;
	text-align: left;
	width: 100%;
	font-size: 16px;
	line-height: 40px;
}

.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorInput {
	background: #FFF;
	width: 198px;
	height: 40px;
	border: 1px solid #FFF;
}

.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorInput.ValidateError {
	border: 1px solid #912323;
}

.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorInput .CalculatorCurrency {
	float: left;
	background: #FFF;
	width: 20px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-weight: 700;
}

.InvestmentCalculatorContainer .InvestmentCalculator .CalculatorInput input {
	float: left;
	font-family: 'Default-Regular', sans-serif, Arial, 'Hiragino Sans GB', 'Microsoft YaHei';
	color: #495057;
	height: 40px;
	border: 1px solid #FFF;
	background: #FFF;
	width: calc(100% - 20px);
	font-size: 16px;
	padding: 0;
	margin: 0;
}



.InvestmentCalculatorContainer .InvestmentCalculator .SectionHeader {
	padding: 10px 0;
	color: #FFF;
}

.InvestmentCalculatorContainer .InvestmentCalculator .FormValidationError {
	background: #FF0000;
	color: #FFF;
	text-align: center;
	font-size: 0.8em;
	padding: 10px;
	margin-bottom: 10px;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem {
	width: calc(32.66% - 20px);
	padding: 10px;
	margin: 0 1% 10px 0;
	text-align: center;
	background: #FFF;
	cursor: pointer;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem:hover {
	background: #CCC;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem.Active {
	background: #CCC;
}

.InvestmentCalculatorContainer .InvestmentOptions .InvestmentItem:nth-child(3n),
.InvestmentCalculatorContainer .InvestmentOptions .InvestmentItem:last-child {
	width: calc(32.68% - 20px);
	margin-right: 0;
}


.InvestmentCalculatorContainer .FlexContainer .InvestmentItem img {
	float: left;
	max-width: 75px;
	padding: 0 5px 5px 0;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem .InvestmentReturn {
	float: right;
	font-size: 2em;
	line-height: 42px;
	padding: 0 0 0 5px;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem .InvestmentReturn span {
	font-size: 0.6em;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem .InvestmentName {
	font-size: 0.8em;
	padding: 0 5px 5px 5px;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem .InvestmentItemLabel {
	font-size: 0.6em;
	padding: 0 5px 0 5px;
}

.InvestmentCalculatorContainer .FlexContainer .InvestmentItem .InvestmentItemDetail {
	font-size: 0.7em;
	padding: 0 5px 5px 5px;
}



.InvestmentCalculatorContainer .InvestmentCalculatorDetails {
	font-family: 'Default-Light';
	width: 360px;
	padding: 20px;
	background-color: #e4edf0;
	text-align: center;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails p {
	text-align: center;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown {
	padding: 10px;
	background-color: #FFF;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown p {
	font-size: 0.8em;
	margin: 0 0 5px 0;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown p:first-child {
	margin: 0 0 20px 0;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown .IssuerContainer {
	background: #FFF;
	text-align: center;
	border-top: 1px solid #e5e6e8;
	border-left: 1px solid #e5e6e8;
	border-right: 1px solid #e5e6e8;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown .IssuerContainer .IssuerLogo img {
	width: 100px;
	padding-bottom: 5px;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown .IssuerContainer .IssuerDetails {
	padding-bottom: 5px;
}

.InvestmentCalculatorContainer .InvestmentCalculatorDetails .DetailsBreakdown .IssuerContainer .IssuerAPRRate {
	font-family: 'Default-Regular';
	font-size: 2em;
}


/*===========================================
	INVESTMENT CALCULATOR COMPARE TABLE
===========================================*/
.InvestmentCalculatorCompareContainer {
	font-family: 'Default-Light';
	margin: 20px 0 20px 0;
	padding: 20px;
	background-color: #e4edf0;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare {
	padding: 10px;
	background-color: #FFF;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare td img {
	max-width: 100px;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare span.Button {
	display: inline-block;
	background-color: #043444;
	text-align: center;
	font-size: 0.8em;
	padding: 7px 10px;
	cursor: pointer;
	color: #FFF;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare span.Button:hover {
	background-color: #292c2b;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare label {
	font-size: 0.8em;
	font-weight: 400;
	color: #5C596D;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare label.ValidateError {
	color: #720000;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare input {
	min-height: 40px;
	border: 1px solid #BFBFBF;
	background: #F9F9F9;
	width: 100%;
	font-size: 14px;
	padding: 0;
	padding-left: 15px;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
	margin: 5px 0 10px 0;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare input.ValidateError {
	border: 1px solid #720000;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare .ButtonControl {
	padding: 10px 0;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare .ButtonControl span {
	display: block;
	background-color: #086788;
	color: #FFF;
	padding: 10px 0;
	text-align: center;
	cursor: pointer;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}

.InvestmentCalculatorCompareContainer .InvestmentCalculatorCompare .ButtonControl span:hover {
	background-color: #043444;
}


/*===========================================
	INVESTMENT CALCULATOR COMPARE
===========================================*/
.CompareInvestmentsResponsive {
	background: #FFF;
}

.CompareInvestmentsResponsive .CompareItem {
	width: calc(20% - 21px);
	padding: 10px;
	border-right: 1px solid #e5e6e8;
	border-bottom: 1px solid #e5e6e8;
	text-align: center;
}

.CompareInvestmentsResponsive .CompareItem:nth-child(5n) {
	width: calc(20% - 20px);
	border-right: none;
}

.CompareInvestmentsResponsive .CompareItem .CompareBreakdown {
	padding: 5px 0;
	background: #FFF;
}

.CompareInvestmentsResponsive .CompareItem .CompareBreakdown.IssuesName {
	height: 52px;
}

.CompareInvestmentsResponsive .CompareItem .CompareBreakdown:nth-child(odd) {
	background: #F1F1F1;
}

.CompareInvestmentsResponsive .CompareItem .CompareBreakdown .CompareLable {
	font-size: 0.7em;
}

.CompareInvestmentsResponsive .ClearAllButton {
	padding: 10px 0;
	text-align: center;
}

.CompareInvestmentsResponsive .ClearAllButton span {
	display: block;
	background-color: #086788;
	color: #FFF;
	padding: 10px 0;
	text-align: center;
	cursor: pointer;
}

.CompareInvestmentsResponsive .ClearAllButton span:hover {
	background-color: #043444;
}


/*===========================================
	RESPONSIVE NAVIGATION
===========================================*/
.ResponsiveNavigation {
	display: none;
	margin: 0 0 10px 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.ResponsiveNavigation ul,
.ResponsiveNavigation ul li,
.ResponsiveNavigation ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.ResponsiveNavigation {
	width: 100%;
	color: #ffffff;
	;
}

.ResponsiveNavigation ul ul {
	display: none;
}

.align-right {
	float: right;
}

.ResponsiveNavigation>ul>li>a {
	padding: 15px 20px;
	cursor: pointer;
	z-index: 2;
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
	color: #ffffff;
}

.ResponsiveNavigation>ul>li>a:hover,
.ResponsiveNavigation>ul>li.active>a,
.ResponsiveNavigation>ul>li.open>a {
	color: #FFF;
	background: #086788;
}

.ResponsiveNavigation>ul>li.open>a {}

.ResponsiveNavigation>ul>li:last-child>a,
.ResponsiveNavigation>ul>li.last>a {}

.holder {
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	right: 0;
}

.holder::after,
.holder::before {
	display: block;
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	right: 20px;
	z-index: 10;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

.holder::after {
	top: 17px;
	border-top: 2px solid #ffffff;
	border-left: 2px solid #ffffff;
}

.ResponsiveNavigation>ul>li>a:hover>span::after,
.ResponsiveNavigation>ul>li.active>a>span::after,
.ResponsiveNavigation>ul>li.open>a>span::after {
	border-color: #eeeeee;
}

.holder::before {
	top: 18px;
	border-top: 2px solid;
	border-left: 2px solid;
	border-top-color: inherit;
	border-left-color: inherit;
}

.ResponsiveNavigation ul ul li a {
	cursor: pointer;
	padding: 10px 20px;
	z-index: 1;
	text-decoration: none;
	font-size: 13px;
	font-weight: normal;
	color: #54595F;
	background: #e5e5e5;
	border-top: 1px solid #FFF;
}

.ResponsiveNavigation ul ul li:hover>a,
.ResponsiveNavigation ul ul li.open>a,
.ResponsiveNavigation ul ul li.active>a {
	background: #086788;
	color: #FFF;
}

.ResponsiveNavigation ul ul li:first-child>a {
	box-shadow: none;
}

.ResponsiveNavigation ul ul ul li:first-child>a {
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.ResponsiveNavigation ul ul ul li a {
	padding-left: 30px;
}

.ResponsiveNavigation>ul>li>ul>li:last-child>a,
.ResponsiveNavigation>ul>li>ul>li.last>a {
	border-bottom: 0;
}

.ResponsiveNavigation>ul>li>ul>li.open:last-child>a,
.ResponsiveNavigation>ul>li>ul>li.last.open>a {
	border-bottom: 1px solid #32373e;
}

.ResponsiveNavigation>ul>li>ul>li.open:last-child>ul>li:last-child>a {
	border-bottom: 0;
}

.ResponsiveNavigation ul ul li.has-sub>a::after {
	display: block;
	position: absolute;
	content: "";
	width: 5px;
	height: 5px;
	right: 20px;
	z-index: 10;
	top: 11.5px;
	border-top: 2px solid #086788;
	border-left: 2px solid #086788;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}

.ResponsiveNavigation ul ul li.active>a::after,
.ResponsiveNavigation ul ul li.open>a::after,
.ResponsiveNavigation ul ul li>a:hover::after {
	border-color: #ffffff;
}