/* Tablet */
@media (max-width: 768px) {
	.mainContainer {
		flex-direction: column;
		display: flex;
		width: 100%;
		margin: 20px 0px;
	}

	.rightSection {
		/* width: 100%; */
		border-radius: 20px;
	}

	.leftSection img {
		border-radius: 20px;
	}

	.page-container {
		display: flex;
		flex-direction: column;
	}

	.loanCardBox,
	.loanCardBox {
		display: flex;
		flex-direction: column;
	}
}



/* Desktop */
@media screen and (min-width: 1450px) and (max-width: 2000px) {
	.rightSection {
		width: 510px !important;
	}
}

@media screen and (min-width: 769px) and (max-width: 1500px) {


	.select-box span {
		font-size: 10px !important;
	}

	.form-control,
	.select2-search input[type="text"] {
		height: 38px;
	}

	.form-group {
		margin-bottom: 7px;
		border-radius: 6px;
	}

	.select-box {
		border-radius: 6px;
		height: 34px;
	}

	.rightSection {
		/* background-color: red; */
		width: 400px;
		padding: 35px 22px;
	}

	.custom-header {
		height: 70px;
	}

	.header-logo-section img {
		width: 100px;
	}

	.stepIcon {
		width: 20px;
		height: 20px;
	}


	.stepIcon.checkmark span {
		font-size: 12px;
	}

	.progressLine {
		position: absolute;
		top: 9px;
		left: 19%;
		right: 19%;
	}

	.stepLabel {
		font-size: 11px;
	}

	.nav-line {
		border: 2px solid transparent;
	}

	.fs-title,
	.rightTitle {
		font-size: 20px;
	}

	.kyc-section {
		font-size: 10px;
		margin-top: 7px;
	}

	.leftSection img {
		width: 420px;
	}

	.labelPlaceholder {
		font-size: 11px;
	}

	.form-control,
	.select2-search input[type="text"] {
		height: 34px;
		border-radius: 6px !important;
	}

	#msform {
		margin-top: 5px;
	}

	.buttonSection {
		margin: 0px;
	}

	.credit-form-section {
		margin-top: 15px;
	}


	.form-group .form-control {
		border-radius: 6px !important;
		font-size: 11px !important;
	}

	.calendar-icon {
		font-size: 15px;
	}

	.nextBtn {
		font-size: 15px;
	}

	.error_txt_new {
		font-size: 10px;
		padding: 0px;
	}



	.loan-info span:last-child,
	.loan-info span:first-child {
		font-size: 11px;
	}


	.loan-logo img {
		width: 35px;
	}

	.apply-btn {
		padding: 6px;
		font-size: 11px;
	}

	.loanInfoBlue span {
		text-align: center;
	}

	.loan-info {
		align-items: center;
	}

	.loan-logo {
		padding: 11px;
		height: auto;
	}

	.loanCardBox {
		grid-template-columns: 10% 70% 17%;
	}

	.buttonBox {
		height: auto;
	}

	.left-box h3 {
		font-size: 15px;
	}

	.slider-label {
		font-size: 11px;
	}

	/* loan details page css end */

	/* cc page css start */
	.contentTitle {
		font-size: 16px;
	}

	.bank-list .bankTitle {
		font-size: 11px;
	}

	.bankSelectBtn {
		width: fit-content;
		font-size: 11px;
	}

	.bankImg {
		width: 20px;
		height: 20px;
	}

	.contentSubTitle {
		margin-top: 11px;
		margin-bottom: 18px;
	}

	.nextbtnData {
		width: 30%;
	}


	#chosseBankModal .bankLogoName {
		font-size: 11px;
	}

	#chosseBankModal .bankImgContainer img {
		width: 20px;
		height: 20px;
	}

	.modal-TopHead h3 {
		font-size: 12px;
	}

	#chosseBankModal .bank-container {
		padding: 0px 10px;
	}

	.bankTitleC {
		font-size: 13px;
	}

	#chosseBankModal .bankListCards {
		gap: 0px !important;
	}

	#selectBankModal .bankListCards {
		gap: 0px !important;
	}

	.modal-TopHead span {
		font-size: 11px;
	}

	.bank-search {
		min-height: 30px;
		font-size: 12px;
	}

	.clear-text {
		top: 60px;
	}

	.occDropdown label,
	.selectDropdown label {
		font-size: 11px;
	}

	.loanDetailsContainer {
		width: 1047px;
		margin: 0 auto;
	}

	.custmHeader {
		margin-left: 60px !important;
	}

	.bannerSection img {
		width: 1040px;
	}

	#elSearchCompanyInput {
		font-size: 11px;
	}

	.selectDropdown .selectInputS {
		width: 15px !important;
		height: 28px !important;
	}

	.occDropdown .occInput {
		height: 28px !important;
	}

	.card-form-select {
		border-radius: 6px !important;
		height: 34px !important;
	}

	.consent-checkbox,
	#termsLink {
		font-size: 9px;
	}

	.bankLogoName p {
		font-size: 11px;
		margin: 0px;
	}

	/* cc page css end */

	/* cc details page css start */
	/* .cardWrapper {
		height: 610px;
	} */

	.cardWrapper .card-badges span {
		font-size: 11px;
	}

	.cardWrapper .cardTitle {
		font-size: 13px;
	}

	.cardWrapper .fee-item p {
		font-size: 12px;
	}

	.cardWrapper .fee-item h4 {
		font-size: 14px;
	}

	.cardWrapper .feat-label {
		font-size: 12px;
	}

	.cardWrapper .feat-icons img {
		width: 22px;
		height: 22px;
		padding: 4px;
	}

	.cardWrapper .benefits-list li div {
		margin: 3px 0;
		font-size: 11px;
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}

	.cardWrapper .btn {
		font-size: 11px;
	}

	.filterSection .bankFilter,
	.filterSection .BankFilterRow .catFilter {
		font-size: 11px
	}

	.title-row h2 {
		font-size: 16px;
	}

	.detailSection .apply-btn {
		font-size: 13px;
	}

	.detailSection .sub {
		font-size: 12px;
	}

	#elTopCat,
	.features h3,
	.fees h3 {
		font-size: 12px;
	}

	.detailSection .icon-box img {
		width: 35px;
		height: 35px;
	}

	.fee-box .colorSection p {
		font-size: 12px;
	}

	.colorSection h4 {
		font-size: 12px;
	}

	.detailSection .fee-box .colorSection {
		gap: 6px;
		padding: 8px;
	}

	.detailSection .fee-box {
		padding: 6px;
	}

	.detailSection .description {

		font-size: 12px;
	}

	.detailSection .tab.active {
		font-size: 12px;
	}

	.detailSection .tab {
		font-size: 12px;
	}

	.detailSection .tabs {
		padding: 6px;
	}

	#highlights ul li {
		font-size: 12px;
	}

	.content-section {
		margin-top: 10px;
	}

	.content-section h2 {
		font-size: 12px;
	}

	.semi2Title {
		font-size: 14px;
	}

	.faqAccordion .accordion-button {
		font-size: 12px;
	}

	.accordion-body p {
		font-size: 12px;
		margin: 0;
	}

	.cardListSection,
	.filterSection,
	.bannerSection {
		width: 1050px;
	}

	#elEligibilityBankList {
		/* width: 1050px !important; */
		margin: 0 auto;
	}

	#elEligibilityBankList .bankListContainer {
		display: flex;
		gap: 20px;
		margin-top: 30px;
	}

	#elCardListBackBtn {
		width: 1050px;
	}

	/* cc details page css end */

	/* header */
	.headerNavCstm {
		display: flex;
		justify-content: space-between;
		width: 1050px;
		margin: 0 auto;
	}

	.progressTracker {
		margin-right: 30px;
	}

	.loan-card {
		margin-bottom: 30px;
	}

	.span2 {
		max-width: 160px;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		cursor: pointer;
		display: inline-block;
	}

	.span2 {
		max-width: 110px;
	}

	.loan-info span:last-child {
		line-height: 100%;
	}

	.fast-badge {
		position: absolute;
		top: -19px;
		right: 27px;
	}

	/* header  */
}



/* Tablets (portrait & landscape) */
@media (min-width: 700px) and (max-width: 1000px) {
	.bannerImgLeft {
		display: none;
	}

	.loanDetailsContainer {
		width: 100%;

	}

	.mainContainer {
		padding: 20px 20px !important;
		justify-content: center;
	}

	.custmHeader {
		margin: 0px !important;
	}

	.progressTracker {
		margin: 0px !important;
	}

	.labelPlaceholder {
		font-size: 12px !important;
	}

	.card-form-select {
		font-size: 10px !important;
	}

	.select-box span {
		font-size: 10px !important;
	}

	.rightSection {
		padding: 25px 20px;
	}

	.leftSection img {
		border-top-right-radius: unset;
		border-bottom-right-radius: unset;
	}
	.rightSection{
			border-top-left-radius: unset;
		border-bottom-left-radius: unset;
	}
	.leftImageBank, .rightImageBank{
		display: none;
	}
	#elEligibilityBankList{
		width: 100% !important;
	}
}

