.calculator-web {
  display: block;
}

.calculator-mob {
  display: none;
}

.calculator-input {
  outline: none;
}

.explore-slider .slick-list {
  padding-top: 25px !important;
  padding-left: 15px !important;
}

.slick-dots-container {
  width: 6.5rem;
  overflow: hidden;
  display: block;
  padding: 0;
  margin: 0.625rem auto;
  height: 1.3rem;
  position: absolute;
  bottom: 0;
  right: 42%;
}

.slick-dots-container > ul {
  padding: 0;
  display: flex;
  transition: all 0.25s;
  position: relative;
  margin: 0;
  list-style: none;
  transform: translateX(0);
  align-items: center;
  bottom: unset;
  height: 100%;
}

.slick-dots-container > ul li {
  width: 0.625rem;
  height: 0.625rem;
  margin: 0 0.25rem;
  background-color: #ffffff;
  border: 1px solid #db620a;
  border-radius: 50%;
}

.slick-dots-container > ul li button,
.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  padding: 0.3125rem;
  cursor: pointer;
  color: transparent;
  border: 0;
  outline: 0;
  background: 0 0;
}

.slick-dots-container > ul li.p-small-1,
.slick-dots-container > ul li.n-small-1 {
  transform: scale(0.8);
}

.slick-dots-container > ul li.slick-active {
  transform: scale(1.1);
  transform-origin: center;
  background: #db620a;
}

.balance-transfer-list .slick-dots li button,
.recommended-product-list .slick-dots li button,
.video-slider .slick-dots li button,
.hlbt-steps-list .slick-dots li button,
.hl-reviews-slider .slick-dots li button,
.related-blog-list .slick-dots li button,
.Explore .slick-dots li button,
.features-list .slick-dots li button,
.al-slide-list .slick-dots li button,
.steps-slide .slick-dots li button {
  width: 0.625rem;
  height: 0.625rem;
  margin: 0 0.25rem;
  background-color: #ffffff;
  border: 1px solid #db620a;
  border-radius: 50%;
}

.balance-transfer-list .slick-dots li.slick-active button,
.recommended-product-list .slick-dots li.slick-active button,
.video-slider .slick-dots li.slick-active button,
.hlbt-steps-list .slick-dots li.slick-active button,
.hl-reviews-slider .slick-dots li.slick-active button,
.related-blog-list .slick-dots li.slick-active button,
.Explore .slick-dots li.slick-active button,
.features-list .slick-dots li.slick-active button,
.al-slide-list .slick-dots li.slick-active button,
.steps-slide .slick-dots li.slick-active button {
  transform: scale(1.1);
  transform-origin: center;
  background: #db620a;
}

.balance-transfer-list .slick-dots li button:before,
.recommended-product-list .slick-dots li button:before,
.video-slider .slick-dots li button:before,
.hlbt-steps-list .slick-dots li button:before,
.hl-reviews-slider .slick-dots li button:before,
.related-blog-list .slick-dots li button:before,
.Explore .slick-dots li button:before,
.features-list .slick-dots li button:before,
.feal-slide-list .slick-dots li button:before,
.steps-slide .slick-dots li button:before {
  display: none;
}

@media only screen and (min-width: 320px) and (max-width: 768px) {
  .related-blog-list .card {
    min-height: 340px;
    border-radius: 45px !important;
  }

  .MainWrapper .BlockWrapper .card-img-top {
    height: auto !important;
  }

  .MainWrapper .BlockWrapper .card-body {
    height: 90px !important;
  }

  .MainWrapper .BGimage .headerContent {
    height: 60px !important;
  }

  .MainWrapper .BGimage .headerContent .LogoWrap {
    height: 30px !important;
  }

  .MainWrapper .BGimage .headerContent .Slogen {
    width: 100%;
    font-size: 13px !important;
  }

  .navbar-dark {
    --bs-navbar-toggler-border-color: transparent;
  }

  .navbar-dark .navbar-toggler {
    font-size: 22px;
    padding: 0px;
  }

  .head-content {
    display: flex;
    justify-content: space-between;
    padding-left: 0;
    --bs-gutter-x: 0rem;
  }

  .head-content .LogoWrap img {
    margin-top: 0px !important;
    width: auto !important;
  }

  .header-nav-mob {
    position: absolute;
    width: 100%;
    z-index: 1;
  }

  .header-nav-mob .accordion-collapse {
    background-color: #f37e20;
  }

  .header-nav-mob .accordion-item .accordion-button {
    background-color: #f37e20;
    height: 50px;
  }

  .header-nav-mob .accordion-item .accordion-button::after {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/></svg>") !important;
  }

  .header-nav-mob .accordion-item .accordion-button:active span {
    color: #b12a30;
  }

  .header-nav-mob .accordion-item .accordion-button:focus span {
    color: #b12a30;
  }

  .header-nav-mob .accordion-item span {
    color: #ffffff;
    font-size: large;
  }

  .header-nav-mob .accordion-item img {
    height: 30px;
    width: 30px;
    margin-right: 15px;
  }

  .header-nav-mob .accordion-item .accordion-body {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    background-color: #eee4db;
  }

  .header-nav-mob .accordion-item .accordion-body .smenu {
    padding-left: 50px;
  }

  .footer-mob .accordion-item {
    background-color: #fff0e5;
  }

  .footer-mob .accordion-item .accordion-button {
    background-color: #fff0e5;
  }

  .footer-mob .accordion-item .accordion-button span {
    font-size: large;
  }

  .footWrap .MediaIcon {
    width: 35px !important;
    height: 35px !important;
  }

  .footWrap .callWrapper {
    width: 150px !important;
  }

  .footWrap .imageBG {
    height: 45px !important;
    width: 45px !important;
  }

  .footWrap .callWrapper .CallNumber {
    line-height: 40px;
  }

  .footWrap .StoreIcons {
    height: 40px !important;
  }

  /*!* Calculator styles for mobile view - Start *!*/
  /*.MainWrapper .CalculatorWrapper {*/
  /*    padding: 15px !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .CalculatorBach {*/
  /*    width: 70vw !important;*/
  /*    padding: 5px !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .Image1 {*/
  /*    height: 30px !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .CalculatorBach .CalculatorTitle h5 {*/
  /*    font-size: 13px !important;*/
  /*    padding-left: 5px;*/
  /*    padding-right: 5px;*/
  /*}*/
  /*.MainWrapper*/
  /*.CalculatorWrapper*/
  /*.CalculatorBach*/
  /*.CalculatorTitle*/
  /*.calculator-sub-title {*/
  /*    font-size: 12px !important;*/
  /*}*/
  /*.heading-graph {*/
  /*    font-size: 14px !important;*/
  /*    margin-left: 0px !important;*/
  /*}*/
  /*.button-graph {*/
  /*    width: 35% !important;*/
  /*    border-radius: 20px !important;*/
  /*    font-size: 14px !important;*/
  /*    background-color: transparent !important;*/
  /*    color: #000000 !important;*/
  /*    border: 2px solid #ffffff !important;*/
  /*    padding: 5px 15px !important;*/
  /*    margin-right: 0 !important;*/
  /*}*/
  /*.range-slider {*/
  /*    appearance: auto !important;*/
  /*    -webkit-appearance: auto;*/
  /*    background: transparent !important;*/
  /*    accent-color: #b12a30;*/
  /*    padding: 0px !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .WrapperDiv {*/
  /*    border-radius: 15px !important;*/
  /*    padding: 15px !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .EmiCard {*/
  /*    width: auto !important;*/
  /*    height: 90px !important;*/
  /*    border-radius: 15px !important;*/
  /*    display: flex;*/
  /*    justify-content: start;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .EmiCard .RupeeBatch {*/
  /*    !* right: 0 !important;*/
  /*        top: 60% !important;*/
  /*        left: 0 !important; *!*/
  /*    font-size: 15px !important;*/
  /*    width: auto !important;*/
  /*    position: static !important;*/
  /*    font-weight: 700 !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .EmiCard h5 {*/
  /*    font-size: 15px !important;*/
  /*    font-weight: 700 !important;*/
  /*    float: left !important;*/
  /*}*/
  /*.MainWrapper .CalculatorWrapper .ApplyCTA,*/
  /*.MainWrapper .BGimage .CalculatorWrapper .remainBalance {*/
  /*    font-size: 14px;*/
  /*}*/
  /*!* Calculator styles for mobile view - End *!*/
  /*.MainWrapper .ServiceWrapper .slick-dots-container {*/
  /*    bottom: -6% !important;*/
  /*}*/
  .MainWrapper .VIEWCTA {
    /* width: auto !important; */
    padding: 14px !important;
    font-size: 14px !important;
  }

  .MainWrapper .buttonWrap {
    font-size: 14px !important;
    width: 200px !important;
  }
}

@media only screen and (min-width: 320px) and (max-width: 1024px) {
  .calculator-web {
    display: none;
  }

  .calculator-mob {
    display: block;
  }

  /* Calculator styles for mobile view - Start */
  .MainWrapper .CalculatorWrapper {
    padding: 15px !important;
  }

  .MainWrapper .CalculatorWrapper .CalculatorBach {
    width: 65vw !important;
    padding: 5px !important;
  }

  .MainWrapper .CalculatorWrapper .Image1 {
    height: 30px !important;
  }

  .MainWrapper .CalculatorWrapper .CalculatorBach .CalculatorTitle h5 {
    font-size: 13px !important;
    padding-left: 5px;
    padding-right: 5px;
  }

  .MainWrapper
    .CalculatorWrapper
    .CalculatorBach
    .CalculatorTitle
    .calculator-sub-title {
    font-size: 12px !important;
  }

  .heading-graph {
    font-size: 14px !important;
    margin-left: 0px !important;
  }

  .button-graph {
    width: 35% !important;
    border-radius: 20px !important;
    font-size: 14px !important;
    background-color: transparent !important;
    color: #000000 !important;
    border: 2px solid #ffffff !important;
    padding: 5px 7px !important;
    margin-right: 0 !important;
  }
  .button-graph-second {
    width: 35% !important;
    border-radius: 20px !important;
    font-size: 14px !important;
    background-color: transparent !important;
    color: #000000 !important;
    border: 2px solid #ffffff !important;
    padding: 5px 16px !important;
    margin-right: 0 !important;
  }
  .range-slider {
    appearance: auto !important;
    -webkit-appearance: auto;
    background: transparent !important;
    accent-color: #b12a30;
    padding: 0px !important;
  }

  .MainWrapper .CalculatorWrapper .WrapperDiv {
    border-radius: 15px !important;
    padding: 15px !important;
  }

  .MainWrapper .CalculatorWrapper .EmiCard {
    width: auto !important;
    height: 90px !important;
    border-radius: 15px !important;
    display: flex;
    justify-content: start;
  }

  .MainWrapper .CalculatorWrapper .EmiCard .RupeeBatch {
    /* right: 0 !important;
            top: 60% !important;
            left: 0 !important; */
    font-size: 15px !important;
    width: auto !important;
    position: static !important;
    font-weight: 700 !important;
  }

  .MainWrapper .CalculatorWrapper .EmiCard h5 {
    font-size: 15px !important;
    font-weight: 700 !important;
    float: left !important;
  }

  .MainWrapper .CalculatorWrapper .ApplyCTA,
  .MainWrapper .BGimage .CalculatorWrapper .remainBalance {
    font-size: 14px;
  }

  /* Calculator styles for mobile view - End */
  .MainWrapper .ServiceWrapper .slick-dots-container {
    bottom: -6% !important;
  }
}

@media only screen and (max-width: 425px) {
  .related-blog-list .card {
    margin-left: 15px;
    margin-right: 15px;
  }
}
