

/** HEADER **/
.static-titles blockquote {
	margin: 20px 0px 0px 0px;
	padding: 20px;
	background-color: #FFFFFF;
	border-left: 5px solid var(--secondaryColour);
	color: var(--primaryColour);
	text-shadow: none;
}

.static-titles blockquote h2 {
	margin: 0px;
	padding: 0px 0px 10px 0px;
}

.static-titles blockquote strong {
	text-transform: uppercase;
}



/** DATE PICKER **/
input[type="date"] {
    position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    color: transparent;
    background: transparent;
}



/** CHECKBOXES **/
.form-field.form-checkbox {
	position: relative;
}

.form-field.form-checkbox input {
	position: absolute;
	top: 5px;
	left: 0;
	width: 15px;
	height: 15px;
}

.form-field.form-checkbox label {
	position: relative;
	display: block;
	padding: 0px 0px 0px 30px;
}



/** LEFT & RIGHT **/
.mortgage-page-left					{ float:left; width:65%; }
.mortgage-page-left .full-padding	{ padding:40px; }
.mortgage-page-right				{ float:right; width:30%; }



/** MORTGAGES TOP **/
.mortgages-top .left h1						{ text-transform:uppercase; font-size:1.8em; font-weight:400; margin:0px 0px 20px 0px; }
.mortgages-top .left .mortgage-service		{ width:45%; margin:0px 0px 20px 0px; }
.mortgages-top .left .ms-odd				{ float:left; }
.mortgages-top .left .ms-even				{ float:right; }
.mortgages-top .left span					{ display:block; clear:both; font-size:1.1em; }
.mortgages-top .right						{ padding:40px 0px; }
.mortgages-top .right .btn					{ margin:10px 0px 0px 0px;}

.mortgages-top								{ background:var(--lightGrey); }
.mortgages-top .left h1						{ color:var(--primaryColour); }
.mortgages-top .left h2						{ color:var(--primaryColour); }


.form-row-error .textbox,
.form-row-error textarea,
.form-row-error .styledd { border-color:var(--secondaryColour) !important; }


/** MORTGAGES MID **/
.mortgages-mid .left h2				{ text-transform:uppercase; font-size:1.8em; font-weight:400; margin:0px 0px 20px 0px; }
.mortgages-mid .left h3				{ font-size:1.5em; }
.mortgages-mid .left p				{ margin:0px 0px 20px 0px; font-size:1.2em; }

.mortgages-mid						{ background:#FFFFFF url(../style/backgrounds/mab-titanic-quarter.jpg) no-repeat 50% 50%; }
.mortgages-mid .left				{ background:rgb(255,255,255); background:rgba(255,255,255,0.9); }
.mortgages-mid .left h2,
.mortgages-mid .left h3				{ color:var(--primaryColour); }



/** MORTGAGES BASE **/
.mortgages-base							{ padding:30px 0px; }
.mortgages-base .mort-calc-title		{ text-transform:uppercase; font-size:1.8em; font-weight:400; }
.mortgages-base .mort-calc-title span	{ display:inline-block; vertical-align:middle; }
.mortgages-base small					{ font-size:0.9em; }

.mortgages-base							{ background:#FFFFFF; }
.mortgages-base .mort-calc-title		{ color:var(--primaryColour); }



/** CALCULATOR **/
.mortgagecalc								{ text-align:left !important; }
.mortgagecalc .mortgagecalc-form,
.mortgagecalc .mortgagecalc-arrow,
.mortgagecalc .mortgagecalc-result			{ float:left; padding:20px; margin:0px; }
.mortgagecalc .mortgagecalc-form			{ width:50%; }
.mortgagecalc .mortgagecalc-form .styledd	{ width:100%; padding:5px; }
.mortgagecalc .mortgagecalc-arrow			{ width:15px; cursor:pointer; }
.mortgagecalc .mortgagecalc-result			{ width:auto; }
.mortgagecalc .mortgagecalc-field			{ margin:0px 0px 20px 0px; }
.mortgagecalc .mortgagecalc-label			{ display:block; clear:both; width:100%; font-size:1.3em; font-weight:400; }
.mortgagecalc .mortgagecalc-value			{ display:block; clear:both; width:100%; font-size:2em; font-weight:700; }

.mortgagecalc								{ background:#DDDDDD; color:var(--darkGrey); }
.mortgagecalc .mortgagecalc-form			{ background:var(--lightGrey); }
.mortgagecalc .mortgagecalc-form .styledd	{ background:#FFFFFF; }
.mortgagecalc .mortgagecalc-arrow			{ background:transparent url(icons/arrow-red-right.png) no-repeat 50% 50%; border-right:1px solid #CCCCCC; }
.mortgagecalc .mortgagecalc-result			{ color:var(--darkGrey); }
.mortgagecalc .mortgagecalc-label			{ color:var(--darkGrey); }
.mortgagecalc .mortgagecalc-value			{ color:var(--primaryColour); }

/** MORTGAGE AGREEMENT **/
.mortgages-agreement									{ padding:30px 0px; font-size:1.3em; }
.agreement-form											{ padding:30px 0px; font-size:1.3em; }
.mortgages-agreement h2,
.agreement-form h2										{ padding:20px 0px 5px 0px; }
.form .styledd											{ width:100%; }
.form .form-row.form-row-strech							{ margin:0px 0px 10px 0px; }
form .form-row-half										{ display:inline-block; vertical-align:top; width:49%; }
.agreement-form .applicant-details-01					{ float:left; }
.agreement-form .applicant-details-02					{ float:right; }
.agreement-form .agreement-table						{ margin:20px 0px;}
.agreement-form .agreement-table .title					{ text-transform:uppercase; padding:10px; }
.agreement-form .agreement-table .sub-title				{ padding:10px; }
.agreement-form .agreement-table dt,
.agreement-form .agreement-table dd						{ display:inline-block; vertical-align:top; padding:10px; }
.agreement-form .agreement-table dt						{ width:200px; }
.agreement-form .agreement-table dd						{ margin:0px 0px 0px 0px; width:16%; }

.mortgages-agreement									{ background:var(--lightGrey); }
.mortgages-agreement h2,
.agreement-form h2										{ color:var(--primaryColour); font-size:22px; text-transform:uppercase; }
.agreement-form											{ background:#FFFFFF; }
.agreement-form .agreement-table						{ border:1px solid #CCCCCC; }
.agreement-form .agreement-table .title					{ background:var(--primaryColour); color:#FFFFFF; }
.agreement-form .agreement-table dl:nth-child(odd)		{ background:var(--lightGrey); }



/** CONFIRMATION BOX **/
.ConfirmationBox {
	padding: 20px;
	background-color: var(--lightGrey);
}

.ConfirmationBox h3 {
	font-weight: 400;
	color: var(--primaryColour);
}

.ConfirmationBox strong {
	color: var(--secondaryColour);
}



/** RESPONSIVE **/
@media screen and (max-width:880px){

	.mortgage-page-left						{ width:50%; }
	.mortgage-page-right					{ width:45%; }
	.mortgages-top .left .mortgage-service	{ width:100%; }
	.mortgages-top .left .ms-odd			{ float:none; }
	.mortgages-top .left .ms-even			{ float:none; }

}

@media screen and (max-width:600px){

	.mortgage-page-left							{ width:100%; }
	.mortgage-page-left .full-padding			{ padding:40px 20px; }
	.mortgages-top .right						{ display:none; }
	.mortgagecalc .mortgagecalc-form,
	.mortgagecalc .mortgagecalc-result			{ float:left; padding:20px 5%; margin:0px; }
	.mortgagecalc .mortgagecalc-form			{ width:45%; }
	.form .form-row-narrow 						{ width:100%; float:none; }
	.mortgagecalc .mortgagecalc-arrow			{ display:none; }
	.mortgagecalc .mortgagecalc-result			{ width:35%; }

}

@media screen and (max-width:450px){

	.mortgagecalc .mortgagecalc-form,
	.mortgagecalc .mortgagecalc-result			{ float:none; height:auto !important; }
	.mortgagecalc .mortgagecalc-form			{ width:90%; }
	.mortgagecalc .mortgagecalc-result			{ width:90%; }

}
