@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap);
.card-content-bg-linear-gradient {
  background: linear-gradient(270deg, rgba(55, 55, 55, 0.3) 0%, rgba(6, 6, 6, 0) 100%);
  background: -webkit-linear-gradient(270deg, rgba(55, 55, 55, 0.3) 0%, rgba(6, 6, 6, 0) 100%);
}

.card-box-installment-top {
  background: rgba(103, 122, 136, 0);
  border: none;
  color: #ffffff;
  font-weight: 900 !important;
  text-transform: uppercase;
  border-radius: 15px;
  margin: 3px !important;
}
.card-box-installment-top .card-body {
  padding-top: 3px;
  padding-bottom: 3px;
}
.card-box-installment-top .text-installment-shadow {
  text-shadow: 1px 2px 3px #454f5b;
}
.card-box-installment-top .text-installment-first {
  font-size: 20px;
}
.card-box-installment-top .text-installment-two {
  font-weight: bold;
  line-height: 15px;
  font-size: 12px;
}
.card-box-installment-top .text-installment-three {
  font-size: 42px;
}
.card-box-installment-top .text-installment-three .text-installment-three-comma {
  font-size: 15px;
}
.card-box-installment-top .text-installment-four {
  font-size: 17px !important;
}
.card-box-installment-top .text-strike::before {
  border-color: #eb1c23;
}
.card-box-installment-top hr {
  display: block;
  border-right: 1px solid #e4e4e4;
  height: 30px;
  margin-top: -30px;
  margin-left: 0px;
  border-top: 0px;
}
.card-box-installment-top .card-body {
  padding-left: 0.5rem;
}
.card-box-installment-top .card-body .tenor-item {
  margin-top: -5px;
  font-size: 10px;
}
.card-box-installment-top .percent-item {
  font-size: 15px;
}
.card-box-installment-top .tenor-item-desc {
  font-size: 15px;
}

.card-content-renew {
  position: relative;
  border: none;
  border-radius: 12px;
  background-color: rgba(255, 255, 255, 0.3);
}
.card-content-renew .white-card {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.44) 0%, #ffffff 100%);
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.15);
  border-radius: 9px;
}
.card-content-renew .img-content {
  width: 84px;
  height: 84px;
}
.card-content-renew .btn-close-collapse {
  z-index: 99;
  position: absolute;
  border-radius: 50%;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.25);
  width: 30px;
  height: 30px;
  top: -5px;
  right: -5px;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
.card-content-renew .btn-close-red {
  background: linear-gradient(180deg, #f4021b 0%, #b51119 100%);
}
.card-content-renew .text-brown {
  color: #b56637;
}
.card-content-renew .btn-close-brown {
  background: linear-gradient(180deg, #e1a873 0%, #885140 100%);
}
.card-content-renew .btn-close-blue {
  background: linear-gradient(180deg, #1b487a 0%, #091858 100%);
}
.card-content-renew .text-toggle[aria-expanded=false] .text-expanded {
  display: none;
}
.card-content-renew .text-toggle[aria-expanded=true] .text-collapse {
  display: none;
}

.collapse-manual:hover, .collapse-manual:focus {
  cursor: pointer;
}

.card-body-rule {
  display: block;
  border-right: 2px solid #686868;
  height: 30px;
  margin-left: 0px;
  border-top: 0px;
}

.card-content {
  background: none;
  border: none;
  height: 100%;
  color: #ffffff;
}
.card-content .card-body {
  padding-left: 0;
  padding-right: 0;
}
.card-content .card-body-content {
  min-height: 57px;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.card-content .card-text {
  margin-bottom: 0;
  line-height: 18px;
}
.card-content .box-img-content {
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}
.card-content .img-content {
  max-width: 100%;
  max-height: 125px;
}

.box-content-wrap {
  background: rgba(255, 255, 255, 0.2);
  padding: 30px;
  border-radius: 15px;
  border: 2px solid #fff;
  margin-bottom: 15px;
}
.box-content-wrap .box-content-present {
  margin-bottom: -15px;
}
.box-content-wrap.box-content-wrap-bg-1 {
  background-image: url(/images/bg-section-1.png?0ab548478b9a90f9ef2fc3c725c3351a);
  background-repeat: no-repeat;
  background-size: cover;
}
.box-content-wrap.box-content-wrap-step {
  margin-top: 0px;
  margin-bottom: 50px;
}
.box-content-wrap.box-content-wrap-step-two {
  margin-top: -120px;
}
.box-content-wrap .box-img-step {
  height: 150px;
}
.box-content-wrap .box-tenor {
  margin: 0 5px 0 5px;
}

.box-installment .card-deck {
  margin-left: 0;
  margin-right: 0;
}

.collapse-simulation {
  margin-bottom: 90px;
}

.box-main-simulation {
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100vh;
}
.box-main-simulation label {
  width: 100%;
  font-size: 1.2rem;
}
.box-main-simulation .card-input-element + .card {
  height: calc(36px + 2rem);
  color: #495057;
  box-shadow: none;
  border: 2px solid transparent;
  border-radius: 4px;
}
.box-main-simulation .card-input-element + .card:hover {
  cursor: pointer;
}
.box-main-simulation .card-input-element:checked + .card {
  border: 2px solid rgb(241, 41, 57);
  transition: border 0.3s;
}
.box-main-simulation .box-content {
  margin-top: 40px;
  margin-bottom: 50px;
}
.box-main-simulation .box-content-wrap {
  border-radius: 15px;
  border: 2px solid #fff;
  height: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 0px !important;
}
.box-main-simulation .box-content-wrap .box-img-content {
  height: 290px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}
.box-main-simulation .box-content-wrap .box-img-step {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}
.box-main-simulation .box-content-wrap .box-img-cs {
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.25rem;
}
.box-main-simulation .box-content-wrap .img-content {
  max-width: 100%;
  max-height: 80%;
}
.box-main-simulation .box-content-wrap .card-body-content {
  min-height: 57px;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.box-main-simulation .box-content-wrap .text-simulation {
  color: rgb(241, 41, 57);
  font-size: 16px !important;
  margin: 0px;
}
.box-main-simulation .box-content-wrap .content-space {
  width: 100%;
}
.box-main-simulation .box-content-wrap .content-space h5 {
  font-weight: bold;
  font-size: 1.3rem;
}
.box-main-simulation .box-content-wrap .content-space .text-center {
  padding-left: 3rem;
  padding-right: 3rem;
}
.box-main-simulation .box-content-wrap .btn-danger-gradient {
  border-radius: 10px;
}
.box-main-simulation .box-content-wrap .invalid-feedback {
  display: inline;
}
.box-main-simulation .box-content-wrap .container {
  text-align: center;
}
.box-main-simulation .box-content-wrap .btn-calculation {
  position: absolute;
  top: 94%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.box-main-simulation .description {
  color: rgba(0, 0, 0, 0.5);
}
.box-main-simulation .head-title {
  font-size: 30px;
  line-height: 45px;
  color: #000000;
  margin-bottom: 20px;
}
.box-main-simulation label {
  font-size: 16px;
  line-height: 24px;
  color: rgba(0, 0, 0, 0.5);
}
.box-main-simulation .btn-danger-cs {
  background: #c00800;
  font-family: "Poppins";
  font-style: normal;
  font-weight: bold;
  font-size: 16px;
  line-height: 24px;
  color: #ffffff;
  display: flex;
  justify-content: center;
}
.box-main-simulation .select2-nosearch {
  width: 100%;
}
.box-main-simulation .btn-disable {
  color: #b1b7bc !important;
}

.min-height-40 {
  min-height: 40px;
}

.line-height-12 {
  line-height: 12px;
}

.line-height-18 {
  line-height: 18px;
}

.line-height-46 {
  line-height: 46px;
}

.height-unset {
  height: unset !important;
}

.bg-section {
  background-image: url(/images/BG_new.png?fd95561b9403aefde958a034691aa3ba);
  background-size: cover;
  background-repeat: no-repeat;
  margin-bottom: -60px;
}

.box-img {
  height: 100%;
  background-image: url(/images/special-bonus-xpander.png?5cdfa3adea4eb51fcb7de934009ebe47);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.col-bonus {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 16.6%, rgba(255, 255, 255, 0.536458) 38.19%, #ffffff 60.23%);
  border-radius: 15px;
}
.col-bonus .card {
  background-color: transparent;
}

.img-card-body {
  right: -65px;
  position: relative;
}

/* ---------------------------------------------------
    UNORDERED LIST
----------------------------------------------------- */
ul.circle {
  list-style-type: circle;
  color: #eb1c23;
}

/* ---------------------------------------------------
    BUTTON
----------------------------------------------------- */
.btn-danger-cs-2 {
  background: linear-gradient(180deg, #ff001b 0%, #ad1319 100%);
  text-shadow: rgb(170, 5, 20) 3px 0px 0px, rgb(170, 5, 20) 2.83487px 0.981584px 0px, rgb(170, 5, 20) 2.35766px 1.85511px 0px, rgb(170, 5, 20) 1.62091px 2.52441px 0px, rgb(170, 5, 20) 0.705713px 2.91581px 0px, rgb(170, 5, 20) -0.287171px 2.98622px 0px, rgb(170, 5, 20) -1.24844px 2.72789px 0px, rgb(170, 5, 20) -2.07227px 2.16926px 0px, rgb(170, 5, 20) -2.66798px 1.37182px 0px, rgb(170, 5, 20) -2.96998px 0.42336px 0px, rgb(170, 5, 20) -2.94502px -0.571704px 0px, rgb(170, 5, 20) -2.59586px -1.50383px 0px, rgb(170, 5, 20) -1.96093px -2.27041px 0px, rgb(170, 5, 20) -1.11013px -2.78704px 0px, rgb(170, 5, 20) -0.137119px -2.99686px 0px, rgb(170, 5, 20) 0.850987px -2.87677px 0px, rgb(170, 5, 20) 1.74541px -2.43999px 0px, rgb(170, 5, 20) 2.44769px -1.73459px 0px, rgb(170, 5, 20) 2.88051px -0.838247px 0px;
}

.btn-blue,
.btn-blue:hover {
  background: #6ba0d9;
  color: #fff;
}

.btn-blue-cs {
  background: #344aa6;
  box-shadow: unset !important;
  text-shadow: rgb(35, 52, 116) 3px 0px 0px, rgb(35, 52, 116) 2.83487px 0.981584px 0px, rgb(35, 52, 116) 2.35766px 1.85511px 0px, rgb(35, 52, 116) 1.62091px 2.52441px 0px, rgb(35, 52, 116) 0.705713px 2.91581px 0px, rgb(35, 52, 116) -0.287171px 2.98622px 0px, rgb(35, 52, 116) -1.24844px 2.72789px 0px, rgb(35, 52, 116) -2.07227px 2.16926px 0px, rgb(35, 52, 116) -2.66798px 1.37182px 0px, rgb(35, 52, 116) -2.96998px 0.42336px 0px, rgb(35, 52, 116) -2.94502px -0.571704px 0px, rgb(35, 52, 116) -2.59586px -1.50383px 0px, rgb(35, 52, 116) -1.96093px -2.27041px 0px, rgb(35, 52, 116) -1.11013px -2.78704px 0px, rgb(35, 52, 116) -0.137119px -2.99686px 0px, rgb(35, 52, 116) 0.850987px -2.87677px 0px, rgb(35, 52, 116) 1.74541px -2.43999px 0px, rgb(35, 52, 116) 2.44769px -1.73459px 0px, rgb(35, 52, 116) 2.88051px -0.838247px 0px;
}

.btn-success-cs,
.btn-danger-cs,
.btn-danger-cs-2,
.btn-brown-cs,
.btn-transparent,
.btn-warning-cs,
.btn-blue-cs {
  border: 1.5px solid #ffffff;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
  border-radius: 8px;
  font-weight: 900;
  color: #ffffff;
  font-style: italic;
}
.btn-success-cs:hover,
.btn-danger-cs:hover,
.btn-danger-cs-2:hover,
.btn-brown-cs:hover,
.btn-transparent:hover,
.btn-warning-cs:hover,
.btn-blue-cs:hover {
  color: #ffffff;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
}

.btn-label-group {
  padding-top: 0;
  padding-bottom: 0;
  line-height: 18px;
}
.btn-label-group.btn-blue-label .label-main {
  background: #6ba0d9;
}
.btn-label-group.btn-blue-label .label-icon-right {
  background: #e33749;
}
.btn-label-group.btn-blue-label .bg-red-2 {
  background: linear-gradient(190deg, rgb(133, 191, 249) 0%, rgb(107, 160, 217) 100%);
}
.btn-label-group.btn-blue-label {
  color: #ffffff;
}
.btn-label-group.btn-blue-label .label-main {
  display: flex;
  justify-content: center;
  padding-top: 5px;
  padding-bottom: 5px;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
}
.btn-label-group.btn-blue-label .label-main .label-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
}
.btn-label-group.btn-blue-label .label-main .label-text {
  line-height: 14px;
}
.btn-label-group.btn-blue-label .label-icon-right {
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
}
.btn-label-group.btn-blue-label .text-shadow {
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25);
}
.btn-label-group.btn-danger-label .label-main {
  background: linear-gradient(180deg, #ff001b, #ad1319);
}
.btn-label-group.btn-danger-label .label-icon-right {
  background: #e33749;
}
.btn-label-group.btn-danger-label .bg-red-2 {
  background: #c40e19 !important;
}
.btn-label-group.btn-danger-label {
  color: #ffffff;
}
.btn-label-group.btn-danger-label .label-main {
  display: flex;
  justify-content: center;
  padding-top: 5px;
  padding-bottom: 5px;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
}
.btn-label-group.btn-danger-label .label-main .label-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
}
.btn-label-group.btn-danger-label .label-main .label-text {
  line-height: 14px;
}
.btn-label-group.btn-danger-label .label-icon-right {
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
}
.btn-label-group.btn-danger-label .text-shadow {
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25);
}
.btn-label-group.btn-cs-label-blue {
  color: #ffffff;
}
.btn-label-group.btn-cs-label-blue .label-main {
  display: flex;
  justify-content: center;
  background: linear-gradient(180deg, #1b487a 0%, #091858 100%);
  padding-top: 5px;
  padding-bottom: 5px;
  border-top-left-radius: 7px;
  border-bottom-left-radius: 7px;
}
.btn-label-group.btn-cs-label-blue .label-main .label-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
}
.btn-label-group.btn-cs-label-blue .label-main .label-text {
  line-height: 14px;
}
.btn-label-group.btn-cs-label-blue .label-icon-right {
  background: #1b487a;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top-right-radius: 7px;
  border-bottom-right-radius: 7px;
}
.btn-label-group.btn-cs-label-blue .text-shadow {
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25);
}

.btn-border-cs {
  background: rgba(219, 219, 219, 0.9);
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 5px;
  padding-bottom: 5px;
  border-radius: 10px;
}

.btn-danger-gradient {
  background: linear-gradient(0deg, #b6060d 0%, #e80811 100%);
  color: #ffffff;
  border-radius: 30px;
}
.btn-danger-gradient:hover {
  color: #ffffff;
}

.dashed {
  border-top: 2px dashed #c0bcbc;
}

/* ---------------------------------------------------
    ROUNDED
----------------------------------------------------- */
.rounded-10 {
  border-radius: 10px;
}

/* ---------------------------------------------------
    FONTS
----------------------------------------------------- */
.font-montserrat {
  font-family: "Montserrat", sans-serif;
}

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

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

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

.font-18 {
  font-size: 18px;
}

.font-30 {
  font-size: 30px;
}

.font-1-25-rem {
  font-size: 1.25rem !important;
}

.font-weight-bold-700 {
  font-weight: 700;
}

.font-weight-bold-900 {
  font-weight: 900;
}

/* ---------------------------------------------------
    TEXTS
----------------------------------------------------- */
.text-red {
  color: #eb1c23;
}

.text-shadow-xs {
  text-shadow: 0px 1.8054710627px 3.6109421253px rgba(0, 0, 0, 0.2);
}

.text-shadow-sm {
  text-shadow: 1px 2px 3px #454f5b;
}

.text-stroke-shadow {
  text-shadow: rgb(95, 81, 74) 2px 0px 0px, rgb(95, 81, 74) 1.75517px 0.958851px 0px, rgb(95, 81, 74) 1.0806px 1.68294px 0px, rgb(95, 81, 74) 0.141474px 1.99499px 0px, rgb(95, 81, 74) -0.832294px 1.81859px 0px, rgb(95, 81, 74) -1.60229px 1.19694px 0px, rgb(95, 81, 74) -1.97998px 0.28224px 0px, rgb(95, 81, 74) -1.87291px -0.701566px 0px, rgb(95, 81, 74) -1.30729px -1.5136px 0px, rgb(95, 81, 74) -0.421592px -1.95506px 0px, rgb(95, 81, 74) 0.567324px -1.91785px 0px, rgb(95, 81, 74) 1.41734px -1.41108px 0px, rgb(95, 81, 74) 1.92034px -0.558831px 0px, 1px 1px 2px rgb(83, 83, 83), 0 0 1em rgb(83, 83, 83), 0 0 0.2em rgb(83, 83, 83);
}

.text-stroke-blue-weight-2-shadow {
  text-shadow: rgb(91, 119, 143) 2px 0px 0px, rgb(91, 119, 143) 1.75517px 0.958851px 0px, rgb(91, 119, 143) 1.0806px 1.68294px 0px, rgb(91, 119, 143) 0.141474px 1.99499px 0px, rgb(91, 119, 143) -0.832294px 1.81859px 0px, rgb(91, 119, 143) -1.60229px 1.19694px 0px, rgb(91, 119, 143) -1.97998px 0.28224px 0px, rgb(91, 119, 143) -1.87291px -0.701566px 0px, rgb(91, 119, 143) -1.30729px -1.5136px 0px, rgb(91, 119, 143) -0.421592px -1.95506px 0px, rgb(91, 119, 143) 0.567324px -1.91785px 0px, rgb(91, 119, 143) 1.41734px -1.41108px 0px, rgb(91, 119, 143) 1.92034px -0.558831px 0px, 1px 2px 5px #000;
}

.text-stroke-default-shadow {
  text-shadow: rgb(122, 122, 122) 2px 0px 0px, rgb(122, 122, 122) 1.75517px 0.958851px 0px, rgb(122, 122, 122) 1.0806px 1.68294px 0px, rgb(122, 122, 122) 0.141474px 1.99499px 0px, rgb(122, 122, 122) -0.832294px 1.81859px 0px, rgb(122, 122, 122) -1.60229px 1.19694px 0px, rgb(122, 122, 122) -1.97998px 0.28224px 0px, rgb(122, 122, 122) -1.87291px -0.701566px 0px, rgb(122, 122, 122) -1.30729px -1.5136px 0px, rgb(122, 122, 122) -0.421592px -1.95506px 0px, rgb(122, 122, 122) 0.567324px -1.91785px 0px, rgb(122, 122, 122) 1.41734px -1.41108px 0px, rgb(122, 122, 122) 1.92034px -0.558831px 0px, 1px 2px 5px #000;
}

/* ---------------------------------------------------
    BACKGROUND
----------------------------------------------------- */
.bg-content-transparent,
.bg-content-transparent-grey {
  margin: 4px -4px -2px 3px;
}

.box-content-transparent,
.box-content-transparent-grey {
  margin: 4px 4px -2px -4px;
}

.bg-content-transparent-grey,
.box-content-transparent-grey {
  background: linear-gradient(180deg, #ffffff 0%, rgba(190, 190, 190, 0.97) 51.04%, rgba(6, 6, 6, 0) 100%);
}

.bg-content-transparent,
.box-content-transparent,
.bg-content-transparent-grey,
.box-content-transparent-grey {
  padding: 15px 30px;
  border-radius: 15px;
  border: none;
}

.bg-red-light {
  background: #faefef;
}

/* ---------------------------------------------------
    Desktop
----------------------------------------------------- */
@media (min-width: 768px) {
  .img-card-body-sm {
    display: none;
  }
  .font-1-5-md-rem {
    font-size: 1.5rem !important;
  }
}
/* ---------------------------------------------------
    Mobile
----------------------------------------------------- */
@media (max-width: 767.98px) {
  .card-box-installment-top .text-installment-three {
    font-size: 25px;
  }
  .card-box-installment-top .text-installment-three .text-installment-three-comma {
    font-size: 12px;
  }
  .card-box-installment-top .card-body .tenor-item {
    font-size: 7px;
  }
  .card-box-installment-top .percent-item {
    font-size: 8px;
    top: -5px;
  }
  .card-box-installment-top .tenor-item-desc {
    font-size: 9px;
  }
  .card-content {
    height: unset;
  }
  .card-body-rule {
    display: none !important;
  }
  .box-content-wrap {
    padding: 20px;
  }
  .box-content-wrap.box-content-wrap-step {
    margin-top: 25px;
  }
  .box-content-wrap .box-img-step {
    height: 100px;
  }
  .box-content-wrap .box-tenor {
    margin: 0;
  }
  .btn-label-group .label-main {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .btn-label-group .label-icon-right {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .img-card-body {
    display: none;
  }
  .collapse-simulation {
    margin-bottom: 0;
  }
}
/* ---------------------------------------------------
    iPad 1, 2, Mini and Air
----------------------------------------------------- */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
  .card-box-installment-top .text-installment-three {
    font-size: 25px;
  }
  .card-box-installment-top .text-installment-three .text-installment-three-comma {
    font-size: 12px;
  }
  .card-box-installment-top .card-body .tenor-item {
    font-size: 7px;
  }
  .card-box-installment-top .percent-item {
    font-size: 8px;
    top: -5px;
  }
  .card-box-installment-top .tenor-item-desc {
    font-size: 9px;
  }
}
@media (max-width: 1024px) {
  .box-content-wrap.box-content-wrap-step {
    margin-top: 25px;
  }
  .box-content-wrap.box-content-wrap-step-two {
    margin-top: 25px;
  }
}
