@font-face {
	font-family: 'Roboto Serif Regular';
	src: url('../fonts/RobotoSerif-Regular.ttf');
}

body {
	font-size: 17px;
	font-family: 'Roboto Serif Regular';
}

@media (min-width: 1200px){
	.container, .container-lg {
		max-width: 1400px;
	}
}

h2 {
	color: #0085CA;
}

.afi-subtitle {
	font-size: 1.2rem;
}

a {
	cursor: pointer;
}

.w-12{
	width: 12%;
}

.w-30 {
	width: 30%;
}

.adj-padding {
	padding-left: 40px;
}

/*Stepper*/
.stepper ul, .medium-stepper ul, .short-stepper ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
}

.stepper li {
	float: left;
}

.short-stepper li {
	float: left;
	width: 25%;
}

.medium-stepper li {
	float: left;
	width: 20%;
}

.stepper li .step, .medium-stepper li .step, .short-stepper li .step {
	display: block;
	font-size: 1.5rem;
	color: white;
	text-align: center;
	padding: 10px;
	text-decoration: none;
	border: 1px solid #ccc;
	background-color: #ccc;
	border-radius: 35px;
	width: 60px;
	height: 60px;
	line-height: 1;
	margin: 0 20px;
}

.stepper .active .step, .medium-stepper .active .step, .short-stepper .active .step {
	color: #0085CA;
	border: 1px solid #0085CA;
	background-color: #FFF;
	font-weight: 700;
}

.stepper .completed .step, .medium-stepper .completed .step, .short-stepper .completed .step {
	color: #FFF;
	border: 1px solid #0085CA;
	background-color: #0085CA;
}

.stepper .disabled .step, .medium-stepper .disabled .step, .short-stepper .disabled .step {
	pointer-events: none;
}

.btn.focus, .btn:focus {
	box-shadow: none;
}

button:focus {
	outline: none;

}

.stepper:before {
	top: 30px;
	left: 40px;
	bottom: 0;
	position: absolute;
	content: " ";
	width: 84%;
	height: 3px;
	background-color: #ccc;
	z-index: -10;
}

.medium-stepper:before {
	top: 30px;
	left: 40px;
	bottom: 0;
	position: absolute;
	content: " ";
	width: 80%;
	height: 3px;
	background-color: #ccc;
	z-index: -10;
}

.short-stepper:before {
	top: 30px;
	left: 40px;
	bottom: 0;
	position: absolute;
	content: " ";
	width: 80%;
	height: 3px;
	background-color: #ccc;
	z-index: -10;
}

.logo-header {
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 50%;
	border-radius: .1875rem;
}

.disabled .logo-header.step1, .logo-header.person-step {
	background-image: url("../rcs/step1.svg");
	background-size: 2.25rem;
}

.completed .logo-header.person-step, .logo-header.person-step:hover {
	background-image: url("../rcs/step1_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.motivation-step, .logo-header.motivation-step {
	background-image: url("../rcs/step2.svg");
	background-size: 2.25rem;
}

.completed .logo-header.motivation-step, .logo-header.motivation-step:hover {
	background-image: url("../rcs/step2_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.house-step, .logo-header.house-step {
	background-image: url("../rcs/step3.svg");
	background-size: 2.25rem;
}

.completed .logo-header.house-step, .logo-header.house-step:hover {
	background-image: url("../rcs/step3_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.finance-step, .logo-header.finance-step {
	background-image: url("../rcs/step4.svg");
	background-size: 2.25rem;
}

.completed .logo-header.finance-step, .logo-header.finance-step:hover {
	background-image: url("../rcs/step4_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.account-step, .logo-header.account-step {
	background-image: url("../rcs/step5.svg");
	background-size: 2.25rem;
}

.completed .logo-header.account-step, .logo-header.account-step:hover {
	background-image: url("../rcs/step5_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.contact-step, .logo-header.contact-step {
	background-image: url("../rcs/step6.svg");
	background-size: 2.25rem;
}

.completed .logo-header.contact-step, .logo-header.contact-step:hover {
	background-image: url("../rcs/step6_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.mortgage-step, .logo-header.mortgage-step {
	background-image: url("../rcs/results1.svg");
	background-size: 2.25rem;
}

.completed .logo-header.mortgage-step, .logo-header.mortgage-step:hover {
	background-image: url("../rcs/results1_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.conditions-step, .logo-header.conditions-step {
	background-image: url("../rcs/conditions_list.svg");
	background-size: 2.25rem;
}

.completed .logo-header.conditions-step, .logo-header.conditions-step:hover {
	background-image: url("../rcs/conditions_list_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.simulation-step, .logo-header.simulation-step {
	background-image: url("../rcs/results2.svg");
	background-size: 2.25rem;
}

.completed .logo-header.simulation-step, .logo-header.simulation-step:hover {
	background-image: url("../rcs/results2_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.comparative-step, .logo-header.comparative-step {
	background-image: url("../rcs/results3.svg");
	background-size: 2.25rem;
}

.completed .logo-header.comparative-step, .logo-header.comparative-step:hover {
	background-image: url("../rcs/results3_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.disabled .logo-header.summary-step, .logo-header.summary-step {
	background-image: url("../rcs/results4.svg");
	background-size: 2.25rem;
}

.completed .logo-header.summary-step, .logo-header.summary-step:hover {
	background-image: url("../rcs/results4_white.svg");
	background-color: #0085CA;
	background-size: 2.25rem;
}

.back-header {
	line-height: 45px;
}

.muted {
	color: #ababab;
}

/*Pestañas*/
.btn-link, .btn-link:focus, .btn-link:active {
	color: #0085CA;
	text-decoration: none;
	font-weight: 600;
	font-size: 1.2rem;
	outline: none;
	box-shadow: none;
}

.btn-link:hover {
	color: #0085CA;
}

/*Inputs*/
.form-control.required:after, label.required:after {
	content: "*";
}

.disabled-input{
	pointer-events:none;
}

.afi-input {
	width: 100%;
	height: 38px;
	border-radius: 3px;
	border: 1px solid;
	padding: 0px 10px;
}

.afi-input-simcode {
	width: 93%;
	height: 38px;
	border-radius: 3px;
	border: 1px solid;
	padding: 0px 10px;
}

.link-input {
	border: none;
	background-color: inherit !important;
}

#upload{
	width:93%;
}


textarea {
	resize: none;
}

.incorrect-input {
	border: 2px solid #CC0000;
	background-color: #f8d7da;
	color: #cc0000;
}

	.incorrect-input::placeholder {
		color: #cc0000;
	}

.incorrect-input-label {
	color: #cc0000;
}

/*Checkbox*/
.checkbox-v-align, .v-align {
	display: inline-flex;
	align-items: center;
}

	.checkbox-v-align .checkmark {
		top: 50% !important;
	}

.container.radio-img, .container.radio-btn-label {
	position: relative;
	padding-left: 30px;
}

.container input[type=checkbox], .container input[type=radio] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.disabled-input .checkmark {
	background-color: #e9ecef !important;
	border: 2px solid #ced4da;
	cursor: none;
}

.checkmark {
	position: absolute;
	top: 3px;
	left: 3px;
	height: 20px;
	width: 20px;
	background-color: #FFF;
	border: 2px solid #0085CA;
	cursor: pointer;
}

	.checkmark.radio-btn {
		border-radius: 15px;
	}

	.checkmark.radio-btn-img {
		border-radius: 15px;
		top: 2px;
	}

	.checkmark.radio-btn-img.with-img {
		border-radius: 15px;
		top: 160px;
	}

.container input:checked ~ .checkmark {
	background-color: #0085CA;
}

.checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

.container input:checked ~ .checkmark:after {
	display: block;
}

.container .checkmark:after {
	left: 6px;
	top: 2px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 2px 2px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.container .checkmark.radio-btn:after {
	top: 4px;
	left: 4px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}

.complex-radio-container {
	width: 55%;
}

.afi-important label {
	position: relative;
	padding-left: 30px;
}

.afi-checkbox label {
	cursor: pointer;
}

.afi-checkbox {
	width: auto;
	cursor: pointer;
}
/*END Checkbox*/

/*Radio buttons*/
.radio-img {
	content: "";
	background-repeat: no-repeat;
	display: inline-block;
	width: 100%;
	height: 150px;
	background-size: 155px 150px;
	margin-right: 5px;
	background-position: center;
}

.radio-btn-label {
	content: "";
	display: inline-block;
	width: 100%;
	margin-right: 5px;
}

.afi-radiobutton {
	cursor: pointer;
	width: auto;
}

.alert-info {
	color: #062D3F !important;
	background-color: #C8DAE2 !important;
	border-color: #062D3F !important;
}

.radio-img.contact0 {
	background-image: url("../rcs/phone_contact.png");
}

.radio-img.contact1 {
	background-image: url("../rcs/whatsapp_contact.png");
}

.radio-img.contact2 {
	background-image: url("../rcs/mail_contact.png");
}

.radio-img.meeting0 {
	background-image: url("../rcs/afi_meeting.png");
}

.radio-img.meeting1 {
	background-image: url("../rcs/home_meeting.png");
}

.radio-img.meeting2 {
	background-image: url("../rcs/online_meeting.png");
}

/*END Radio buttons*/

/*Botones*/
.afi-btn, .afi-input:active {
	background-color: #0085CA !important;
	border-color: #0085CA !important;
}

	.afi-btn:focus, .afi-secondary-btn:focus {
		box-shadow: none;
	}

.afi-secondary-btn {
	background-color: #FFF !important;
	border-color: #0085CA !important;
	color: #0085CA !important;
}

	.afi-btn:focus {
		box-shadow: none;
	}

.disabled-btn {
	pointer-events: none;
	background-color: #0085CA !important;
	border-color: #0085CA !important;
	opcaity: 0.65;
}

.delete-btn {
	width: unset !important;
}

.forget-password-btn {
	border: 0;
	font-size: 1rem;
	color: #0085CA !important;
	background-color: transparent;
}

	.forget-password-btn.link {
		margin-top: .0625rem;
		cursor: pointer;
	}

.forget-password-btn:hover {
	text-decoration: underline;
}

/*Avisos*/
.afi-important {
	border: 1px solid #0085CA;
	border-radius: 4px;
	background-color: #FFFFFF;
	padding: 10px;
	display: inline-flex;
	align-items: center;
}

.afi-warning {
	border: 1px solid #0085CA;
	border-radius: 4px;
	background-color: #C8DAE2;
	padding: 10px;
	display: inline-flex;
	align-items: center;
	font-size: 0.9rem;
}

	.afi-warning:before {
		content: "";
		background-image: url("../rcs/info-afi.png");
		background-repeat: no-repeat;
		display: inline-block;
		width: 35px;
		height: 35px;
		background-size: 35px 35px;
		margin-right: 5px;
	}

.afi-warning-no-card {
	border-radius: 4px;
	padding: 10px;
	display: inline-flex;
	align-items: center;
	font-size: 0.9rem;
}

	.afi-warning-no-card:before {
		content: "";
		background-image: url("../rcs/info-afi-no-bg.svg");
		background-repeat: no-repeat;
		display: inline-block;
		width: 50px;
		height: 35px;
		background-size: 33px 33px;
		margin-right: 0px;
	}

.option-title {
	font-size: 1.3rem;
	font-weight: 600;
	color: #0085CA;
}

.change-view {
	font-size: 0.9rem;
}

.result-title {
	font-size: 1.2rem;
	font-weight: 600;
}

.important-result {
	font-size: 2rem;
}

.result {
	font-size: 0.8rem;
}

	.result label {
		margin-bottom: 0;
	}

.table td, .table th {
	text-align: right;
	padding: 0.5rem !important;
}

.table.descriptions td, .table.descriptions th {
	text-align: left;
	vertical-align: middle;
}

.table.files td, .table.files th {
	text-align: left;
	vertical-align: middle;
}

.description-header {
	width: 20%;
	font-weight: 500;
}

.table th {
	border-top: none;
}

.total-row {
	font-weight: bold;
}

.costs-table {
	font-size: 0.9rem;
}

.footer {
	font-size: 0.8rem;
}

.footer-policy {
	font-size: 0.8rem;
	border-top: 1px solid rgba(0,0,0,.125);
}

.afi-link {
	color: #0085CA !important;
	text-decoration: underline;
}

.afi-link.disabled, .afi-link:disabled {
	color: inherit !important;
}

.afi-link.disabled:hover, .afi-link:disabled:hover {
	text-decoration: none;
}

.afi-link-absolute {
	color: #0085CA !important;
	position: absolute;
	right: 2%;
}

.view-icon {
	display: inline-block;
	background-image: url("../rcs/eye.svg");
	width: 25px;
	height: 25px;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 90%;
	cursor: pointer;
	margin: 0px 5px;
}

.delete-icon {
	display: inline-block;
	background-image: url("../rcs/delete.svg");
	width: 34px;
	height: 25px;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 90%;
	cursor: pointer;
	margin: 0px 5px;
}

.d-inherit {
	display: inherit;
}

.results-header-img {
	content: "";
	background-repeat: no-repeat;
	display: inline-block;
	width: 40px;
	height: 40px;
	background-size: 40px 40px;
	margin-right: 5px;
	background-position: center;
}

	.results-header-img.term {
		background-image: url("../rcs/calendar.svg");
		background-size: 3.125rem;
	}

	.results-header-img.lifelong {
		background-image: url("../rcs/heart.svg");
		background-size: 3.125rem;
	}

	.results-header-img.rent {
		background-image: url("../rcs/coin.svg");
		background-size: 3.125rem;
	}

.extra-results {
	font-size: 0.8rem;
	text-align: center;
}

.costs-box {
	background-color: #F4F4F4;
}

.icon {
	display: inline-block;
	width: 22px;
	height: 22px;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 90%;
	
}
.icon.x {
	background-image: url("../rcs/x-circle.svg");
}
.icon.check {
	background-image: url("../rcs/check-circle.svg");
}

.logo-state {
	display: inline-block;
	width: 30px;
	height: 25px;
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	background-size: 90%;
	cursor: pointer;
}

	.logo-state.prior {
		background-image: url("../rcs/prior.svg");
	}

	.logo-state.complete {
		background-image: url("../rcs/complete.svg");
	}

	.logo-state.analysis {
		background-image: url("../rcs/analysis.svg");
	}

	.logo-state.summary {
		background-image: url("../rcs/summary.svg");
	}

	.logo-state.edit {
		background-image: url("../rcs/edit.svg");
	}

	.logo-state.send-pwd {
		background-image: url("../rcs/send.svg");
	}

	.logo-state.lock-icon {
		background-image: url("../rcs/lock.svg");
	}

	.logo-state.gear {
		background-image: url("../rcs/gear.svg");
	}

.disabled .logo-state.prior {
	background-image: url("../rcs/prior_disabled.svg");
	pointer-events: none;
	cursor: default !important;
}

.disabled .logo-state.complete {
	background-image: url("../rcs/complete_disabled.svg");
	pointer-events: none;
	cursor: default !important;
}

.disabled .logo-state.analysis {
	background-image: url("../rcs/analysis_disabled.svg");
	pointer-events: none;
	cursor: default !important;
}

.disabled .logo-state.summary {
	background-image: url("../rcs/summary_disabled.svg");
	pointer-events: none;
	cursor: default !important;
}

.complete-step .logo-state.prior {
	background-image: url("../rcs/prior_complete.svg");
}

.complete-step .logo-state.complete {
	background-image: url("../rcs/complete_complete.svg");
}

.complete-step .logo-state.analysis {
	background-image: url("../rcs/analysis_complete.svg");
}

.complete-step .logo-state.summary {
	background-image: url("../rcs/summary_complete.svg");
}

.page-link {
	color: #0085CA !important;
}

.page-selector {
	border-color: #dee2e6;
	border-width: 1px;
	border-style: solid;
	border-radius: 4px;
	color: #0085CA;
}

	.page-selector option {
		color: #000000;
	}


/* Drag & drop */
.drop-zone {
	max-width: 600px;
	height: 200px;
	padding: 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-family: "Quicksand", sans-serif;
	font-weight: 500;
	font-size: 18px;
	cursor: pointer;
	color: #999999;
	border: 4px dashed #0085CA;
	border-radius: 10px;
	margin: auto;
}

.drop-zone--over {
	border-style: solid;
}

.drop-zone__input {
	display: none;
}

.drop-zone__thumb {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	overflow: hidden;
	background-color: #cccccc;
	background-size: cover;
	position: relative;
}

.drop-zone__thumb::after {
	content: attr(data-label);
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 5px 0;
	color: #ffffff;
	background: rgba(0, 0, 0, 0.75);
	font-size: 14px;
	text-align: center;
}

.file-name {
	background-color: inherit !important;
	border: none !important;
}

.file-name:not(:disabled):not(.disabled) {
	cursor: pointer;
}

.file-name:not(:disabled):not(.disabled):hover {
	text-decoration: underline;
}

.desc-list {
	font-weight: 600;
	font-size: 16px;
}