html,body{font-family: 'Montserrat', sans-serif; font-weight: 400; color:#353535;}
body{background: url(../img/bk-page.jpg) center top/100% auto #fff no-repeat;}

/* ---------------------------------- BANNER ---------------------------------- */
.wrap-logo-img{position: relative;}
.logo-page{max-width: 100px; position: absolute; top: 20px;}
.img-banner{margin-top: 50px; position: relative; z-index: 1;}

.txt-banner{font-size: 40px; color:#3D1596; font-weight: 400; max-width: 540px; padding-left: 30px; position: relative; margin-bottom: 20px; margin-left:10px;}
.txt-banner::before{content:''; position:absolute; width:5px; top: 2px; bottom: 0; left: 0; background-color: #CF96D9;}
.cant-inversion{font-size: 60px; display: block;}
/* ---------------------------------- BANNER ---------------------------------- */


/* -------------------------------- CALCULADORA ------------------------------- */
.section-calculadora{margin-top: -50px; margin-bottom: 60px;}
.bk-calculadora{background: url(../img/bk-calculator.jpg) center/cover no-repeat; border-radius: 20px; padding:60px 10px 40px; margin:0 15px; color: #fff; display: flex; flex-wrap: wrap; width: calc(100% - 30px);}
.wrap-paso-calc{padding: 0 20px 0 72px; position: relative;}
.wrap-paso-calc::before{content:'';font-size: 100px; color:rgba(255, 255, 255, 0.4); position: absolute; top: 0; left: 10px; line-height: 0.5; font-weight: 300;}
.wrap-paso-calc.paso01::before{content: '1'; left: 30px;}
.wrap-paso-calc.paso02::before{content: '2';}
.wrap-paso-calc.paso03::before{content: '3';}


.wrap-paso-calc p{font-size: 18px;}
.wrap-paso-calc .form-select{background-color: transparent; color: #fff; border-radius: 0; border-top: none; border-left: none; border-right: none; border-bottom-width: 2px; --bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23adb5bd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); transition: all ease-in-out .3s;}
.wrap-paso-calc .form-select:focus{box-shadow: none; background-color: rgba(255, 255, 255, 0.14) !important; border-color: #fff; border-radius: 10px 10px 0 0 !important;}
.btn-calc{font-size: 18px; text-transform: uppercase; letter-spacing: 1px; color:#3D1596; display: block; background-color: rgba(255, 255, 255, 0.9); text-decoration: none; padding: 8px 24px; text-align: center; font-weight: 600; border-radius: 8px; max-width: 1060px; margin: 20px auto 0; transition: all ease-in-out .3s;}
.btn-calc:hover, .btn-calc:focus{background-color: rgba(255, 255, 255, 1); box-shadow:rgba(0, 0, 0, 0.3) 0 0 30px;}
/* -------------------------------- CALCULADORA ------------------------------- */


/* ------------------------------- FELICITACION ------------------------------- */
.felicitaciones{margin-bottom: 40px;}
.tit-felicidades{font-size: 40px; color:#3D1596; font-weight: 400; margin-bottom: 22px;}
.txt-felicidades{font-size: 20px; margin-bottom: 32px;}
.txt-felicidades strong{color:#3D1596;}
.btn-solicitud{text-transform: uppercase; font-size: 18px; color: #3D1596; text-decoration: none; font-weight: 500; background-color: #fff; display: inline-block; padding: 8px 24px; border-radius: 6px; margin: 0 10px 20px; border: 1px solid #3D1596; transition: all ease-in-out .3s; letter-spacing: 1;}
.btn-solicitud:hover, .btn-solicitud:focus{background-color: #3D1596; color:#fff;}
/* ------------------------------- FELICITACION ------------------------------- */



/* -------------------------------- RESULTADOS -------------------------------- */
.wrap-tabs-resultados{background-color: #fff; box-shadow: 0px 10px 30px rgba(61, 21, 150, 0.25); border-radius: 20px; padding: 24px 20px; margin-bottom: 60px;}
.tabs-resultados{border-bottom: 1px solid #d7d7d7; margin-bottom: 32px;}
.tabs-resultados li {width: 25%;}
.tabs-resultados li > button{background-color: transparent; color:rgba(53, 53, 53, 0.6); border:none; font-size: 18px; text-transform: uppercase; letter-spacing: 1px; font-weight: 500; width:100%; padding: 12px 10px; position: relative; transition: all ease-in-out .3s;}
.tabs-resultados li > button:hover, .tabs-resultados li > button.active{color:#3D1596;}
.tabs-resultados li > button::before{content:''; height: 4px; position: absolute; bottom: 0; left: 50%; right: 50%; background-color: #3D1596; opacity: 0;transition: all ease-in-out .3s;}
.tabs-resultados li > button:hover::before, .tabs-resultados li > button.active::before{left: 0; right: 0; opacity: 1;}

.row-resultado{min-height: 520px;}

.table-resumen td{padding: 14px 24px;}
.table-striped{--bs-table-striped-bg:#F3F1FC;  font-size: 18px;}
.table-resumen > .table-striped thead{border-color:#3D1596; border-bottom-width: 2px; text-align: center; text-transform: uppercase; letter-spacing: 1px; font-size: 16px; color:rgba(61, 21, 150, .5); font-weight: 500;}
.table-resumen > .table-striped > tbody > tr > td:last-child{text-align: center;}

.table-pagos {height: 520px; overflow-y: scroll;}
.table-pagos > .table-striped thead{border-color:#3D1596; border-bottom-width: 2px; text-transform: uppercase; letter-spacing: 1px; font-size: 16px; color:rgba(61, 21, 150, .5);  font-weight: 600;}
/* -------------------------------- RESULTADOS -------------------------------- */



/* ----------------------------- MENU BOTTOM MOVIL ---------------------------- */
.menu-bottom-xs{background-color:#3D1596; color:#fff; position: fixed; bottom: 0; left: 0; right: 0; padding-top: 18px; border-radius: 30px 30px 0 0; z-index: 1;}
.menu-bottom-xs h3{font-size: 18px; font-weight: 600;}
.btn-solicitud-xs{display: inline-block; width: 128px; color: #fff; text-decoration: none; padding: 8px 8px 14px; font-size: 16px; margin: 0 10px; border-radius: 10px; transition: all ease-in-out .3s;}
.btn-solicitud-xs:hover{text-decoration: none; background-color: rgba(255, 255, 255, 0.1);}
.btn-solicitud-xs img{display: block; width: 40px; height: 40px; margin: 4px auto;}
/* ----------------------------- MENU BOTTOM MOVIL ---------------------------- */



/* ---------------------------------------------------------- MEDIA QUERY  ---------------------------------------------------------- */
@media (max-width: 1399px){
	/* -------------------------------- RESULTADOS -------------------------------- */
	.tabs-resultados li {width: auto; margin: 0 auto;}
	/* -------------------------------- RESULTADOS -------------------------------- */
}

@media (max-width: 1199px){
	/* -------------------------------- CALCULADORA ------------------------------- */
	.wrap-paso-calc {padding: 0 10px 0 72px;}
	/* -------------------------------- CALCULADORA ------------------------------- */

	/* ------------------------------- FELICITACION ------------------------------- */
	.btn-solicitud{margin:0 5px 20px; padding: 8px 18px;}
	/* ------------------------------- FELICITACION ------------------------------- */
}

@media (max-width: 991px){
	/* ---------------------------------- BANNER ---------------------------------- */
	.logo-page {max-width: 52px;top: 24px; left: 24px;}
	.txt-banner {font-size: 32px; margin-left: 0;}
	.cant-inversion {font-size: 44px;}
	/* ---------------------------------- BANNER ---------------------------------- */

	/* -------------------------------- CALCULADORA ------------------------------- */
	.section-calculadora {margin-top: -30px;}
	.bk-calculadora{padding-top: 34px; padding-bottom: 34px;}
	.wrap-paso-calc {padding-left:43px; padding-bottom: 50px;}
	.wrap-paso-calc p {font-size: 16px; margin-bottom: 4px; min-height: 74px;}
	.wrap-paso-calc::before{font-size: 62px; left: 4px; top:10px;}
	.wrap-paso-calc.paso01::before {left: 16px;}
	.wrap-paso-calc .form-select{position: absolute; right: 20px; width: 82%; font-size: 1.12rem;}
	.btn-calc {font-size: 16px; margin-top: 16px;}
	/* -------------------------------- CALCULADORA ------------------------------- */

	/* ------------------------------- FELICITACION ------------------------------- */
	.tit-felicidades {font-size: 32px; margin-bottom: 18px;}
	.txt-felicidades {font-size: 18px;max-width: 720px; margin-left: auto; margin-right: auto; padding: 0 20px;}
	.btn-solicitud{font-size: 16px; padding: 8px 14px;}
	/* ------------------------------- FELICITACION ------------------------------- */

	/* -------------------------------- RESULTADOS -------------------------------- */
	.ocultar-xs{display: none;}
	.wrap-tabs-resultados{padding: 20px;}
	.tabs-resultados li > button{font-size: 16px;}
	.row-resultado{margin-left: 0; margin-right: 0;}

	.table-resumen > .table-striped{font-size: 16px;}
	.table-resumen > .table-striped thead{font-size: 15px}

	/* -------------------------------- RESULTADOS -------------------------------- */
}

@media (max-width: 767px){
	/* ---------------------------------- BANNER ---------------------------------- */
	.logo-page {max-width: 38px;}
	.txt-banner{font-size: 28px; margin-bottom: 0;}
	.cant-inversion {font-size: 32px;}
	/* ---------------------------------- BANNER ---------------------------------- */

	/* -------------------------------- CALCULADORA ------------------------------- */
	.section-calculadora {margin-top: 18px;}
	.bk-calculadora {padding-top: 30px;padding-bottom: 30px;width: 100%;border-radius: 0;margin: 0;}
	.wrap-paso-calc {padding-bottom: 30px;}
	.wrap-paso-calc p{min-height:auto;}
	.wrap-paso-calc .form-select {position: inherit;right: auto;}
	.btn-calc{margin-top: 0;}
	/* -------------------------------- CALCULADORA ------------------------------- */

	/* ------------------------------- FELICITACION ------------------------------- */
	.tit-felicidades {font-size: 28px;}
	.txt-felicidades {font-size: 16px;}
	/* ------------------------------- FELICITACION ------------------------------- */

	/* -------------------------------- RESULTADOS -------------------------------- */
	.seccion-tabs-resultado{padding-bottom: 120px;}
	.seccion-tabs-resultado > .container-xl > .row > .col-12{padding: 0;}
	.wrap-tabs-resultados {padding: 10px 0; border-radius: 12px;}
	.controles-tabs-resultados{width: 100%; overflow-x: scroll; padding-bottom: 4px;}
	.tabs-resultados{min-width: 800px; margin: 0; padding:0 30px;}
	.row-resultado {min-height: auto;}

	.table-resumen, .grafica-resultado, .table-pagos{margin: 30px 0;}
	.table-pagos thead > tr > td:last-child, .table-pagos tbody > tr > td:last-child{display: none;}

	/* -------------------------------- RESULTADOS -------------------------------- */
}


@media (max-width: 575px){
	/* ---------------------------------- BANNER ---------------------------------- */
	.txt-banner{text-align: center; padding: 40px 10px 10px}
	.txt-banner::before{display: none;}
	.cant-inversion {font-size: 30px;}
	/* ---------------------------------- BANNER ---------------------------------- */
	
	/* ----------------------------- MENU BOTTOM MOVIL ---------------------------- */
	.menu-bottom-xs{padding-top: 12px; border-radius: 20px 20px 0 0;}
	.menu-bottom-xs h3 {font-size: 15px; margin-bottom: 4px;}
	.btn-solicitud-xs{font-size: 12px; width: 92px; padding: 4px 4px 10px; margin: 0 4px;}
	.btn-solicitud-xs img{width: 30px; height: 30px; margin: 0 auto;}

	.seccion-tabs-resultado { padding-bottom: 80px;}
	/* ----------------------------- MENU BOTTOM MOVIL ---------------------------- */
}