.hbfc-hidden {
	display: none;
}

/* Add your CSS styles here */
.loancalc-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border: 1px solid black;
    padding: 40px 40px 20px 40px;
}

.btn.btn-success.btn-cstm.w-100 {
    background-color: #0c998e;
    border-color: #0c998e;
}

span#basic-addon1 {
    background-color: #0C998E;
    border-radius: 0;
    color: white;
    font-weight: 600;
}

.error {
    color: #ee4040;
    font-size: 12px;
    font-weight: 600;
/*     margin-bottom: 10px; */
}

.form-control {
    height: 50px !important;
    border-radius: 0;
    border: 1px solid #cccccc;
    background-color: #0c998e21;
}
 
.elementor-element.elementor-element-f87920b.e-con-full.e-flex.e-con.e-parent .elementor-element.elementor-element-ed6d3c2.elementor-widget.elementor-widget-shortcode {
    background-color: #fff;
    padding: 30px;
	border: 1px solid #000;
}
 
form#loanCalculator {
    width: 100%;
}

.cal-title {
    font-size: 20px !important;
    text-align: center;
    font-weight: 700;
    margin-bottom: 40px;
}
 
.btn.btn-success.btn-cstm.w-100 {
    min-height: 60px;
    border-radius: 5px;
}

div#emiResult {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

/* .emicalculatortxt h2.elementor-heading-title.elementor-size-default {
    display: flex;
}

.emicalculatortxt h2.elementor-heading-title.elementor-size-default span.colr-red {
    margin-right: 5px;
} */

h2#emiHeading {
    color: #0c998e;
    font-size: 18px;
    padding: 0 !important;
    /* margin-bottom: -2px; */
    text-align: center;
}

.emivlauetxt {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #0c998e !important;
    text-align: center;
}

span#emiValue {
    color: #515151;
}

div.input-group-addon {
	position: absolute;
	bottom: -20px;
	font-size: 12px;
}

/*radio*/
.radio label {
	cursor: pointer;
	padding-left: 18px;
	padding-right: 12px;
	position: relative;
	color: #2F2F2F;
	font-size: 14px;
}

.rateOfInterestarea {
display: none;
}

fieldset[disabled] .form-group.is-focused .radio label {
	color: rgba(0, 0, 0, 0.26);
}

.radio label span {
	display: block;
	position: absolute;
	left: 2px;
	top: 3px;
	transition-duration: 0.2s;
}

.radio label .circle {
	border: 1px solid #707070;
	height: 15px;
	width: 15px;
	border-radius: 100%;
	background-color: #fff;
}

.radio label .check {
	height: 15px;
	width: 15px;
	border-radius: 100%;
	background-color: #eccf00;
	transform: scale3d(0, 0, 0);
}

.radio label .check:after {
	display: block;
	position: absolute;
	content: "";
	background-color: rgba(0, 0, 0, 0.87);
	left: -18px;
	top: -18px;
	height: 50px;
	width: 50px;
	border-radius: 100%;
	z-index: 1;
	opacity: 0;
	margin: 0;
}

.radio label input[type=radio]:not(:checked) ~ .check:after {
	animation: rippleOff 500ms;
}


.radio input[type=radio] {
	opacity: 0;
	height: 0;
	width: 0;
	overflow: hidden;
}

.radio input[type=radio]:checked ~ .check,
.radio input[type=radio]:checked ~ .circle {
	opacity: 1;
}

.radio input[type=radio]:checked ~ .check {
	background-color: #0c998e;
}

.radio input[type=radio]:checked ~ .circle {
	border-color: #0c998e;
}

.radio input[type=radio]:checked ~ .check {
	transform: scale3d(0.65, 0.65, 1);
}

.radio input[type=radio][disabled] ~ .check,
.radio input[type=radio][disabled] ~ .circle {
	opacity: 0.26;
}

.radio input[type=radio][disabled] ~ .check {
	background-color: #000000;
}

.radio input[type=radio][disabled] ~ .circle {
	border-color: #000000;
}

/* Calender CSS Start */

.flatpickr-calendar {
	background-color: #333; /* Set background color to matte black */
	color: #fff; /* Set text color to white */
	border: none; /* Remove borders */
}

.flatpickr-day, .flatpickr-month, .flatpickr-year {
	color: #fff; /* Set text color for day, month, and year */
}

.flatpickr-monthDropdown-months, .flatpickr-yearDropdown-years {
	background-color: #333; /* Set background color for month and year dropdowns */
}

.flatpickr-prev-month, .flatpickr-next-month {
	color: #fff; /* Set color for the previous and next month arrows */
}

.flatpickr-weekdays {
	background-color: #ffffff; /* Set background color for weekdays */
	height: 40px;
}

.flatpickr-weekday, .flatpickr-day {
	border: none; /* Remove borders for weekdays and days */
}

.flatpickr-current-month, .flatpickr-time-separator {
	color: #fff; /* Set color for the current month and time separator */
}

.flatpickr-calendar.animate.open.arrowBottom.arrowLeft {
    width: fit-content;
}

.flatpickr-current-month {
    font-size: 16px;
    font-weight: 600;
    color: white;
    position: sticky;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* .flatpickr-rContainer {
	width: 100%;
}

.flatpickr-calendar .flatpickr-days {
    width: 100%;
}

.flatpickr-calendar .dayContainer {
    min-width: 100%;
    max-width: 100%;
} */

.flatpickr-months {
	background-color: #0C998E;
	align-items: center;
	padding: 20px 5px;
}

.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
	position: relative;
	color: rgb(255 255 255 / 90%);
	fill: rgb(255 255 255 / 90%);
}

.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month {
	background-color: #0C998E;
}

/* Calender CSS End */

@keyframes rippleOn {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 0.2;
	}

	100% {
		opacity: 0;
	}
}

@keyframes rippleOff {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 0.2;
	}

	100% {
		opacity: 0;
	}
}
/* End radio*/

#loanCalculator .form-control {
    min-height: 55px !important;
    height: auto !important;
    background-color: #f9fafb;
    border: 1px solid #e2e8f0 !important;
	box-shadow: inherit !important;
	outline: inherit !important
}