.bg-purple-isu-paling-dicari {
  background: url("../img/static/bg-purple-isu-paling-dicari.png") no-repeat left center;
  background-size: cover;
}
.bg-pink-sumber-lain {
  background: url("../img/static/bg-pink-sumber-lain.png") no-repeat left center;
  background-size: cover;
}
.accordion-item{
  border: none;
}
.accordion-button{
  font-size: 20px;
}
.custom-accordion-btn::after {
    content: "";
    background-image: url('../img/static/isu-maximize.png'); /* Replace with your image */
    background-size: contain;
    background-repeat: no-repeat;
    width: 20px;  /* Adjust as needed */
    height: 20px; /* Adjust as needed */
    transform: rotate(0deg); /* Default state */
}

.custom-accordion-btn:not(.collapsed)::after {
    background-image: url('../img/static/isu-minimize.png'); /* Different image when expanded */
    transform: rotate(0deg); /* Keep upright */
}

td span{
  display: contents;
}

.arrow-is{
  margin-top: 10px;
  width: 3rem;
}
.contnt{
  font-size: 18px;
}
.accordion-button:not(.collapsed) {
  color: #610399;
}
.txt-sumber{
  font-size: 8rem;
}
.txt-lain {
  font-size: 6rem;
  line-height: 0;
  letter-spacing: 10px;
  margin-left: -1rem;
}
.txt-title-1{
  font-size: 5rem;
}
.txt-title-2{
  font-size: 3rem;
  letter-spacing: 0.8rem;
  line-height: 0;
}
.txt-umur{
  font-size: 18px;
  font-weight: bold;
}
.txt-umur-2{
  font-size: 26px;
  font-weight: bold;
}

.lh-0k{
  line-height: 0.3;
}
.lh-tit{
  line-height: 0.7;
}

.card-wrapper {
  width: 100%;
  margin-bottom: 15vh;
}
button{
  border: none;
  font-weight: 700;
}
.img-foto{
  width: 100% !important;
}
.card-xxx {
  overflow: hidden;
}

.card-xxx img {
  float: left;
  width: 37%;
  height: auto;
  border-radius: 8px;
  margin-right: 20px;
}

.card-xxx .card-title {
  font-size: 20px;
  line-height: 1;
}

.card-xxx .card-text {
  margin-top: 10px;
}

.card-xxx .card-link {
  font-weight: bold;
  border: none;
  box-shadow: none;
}
.modal-content {
  border-radius: 0 !important;
  
}
.modal-body{
  height: 83vh;
  overflow-y: auto;
}
.modal-header{
  border:none;
}
.modal-title-name{
  font-size: 3rem;
  line-height: 1;
}
.modal-title-profession{
  font-size: 1.5rem;
  line-height: 1;
  font-weight: 700;
}
.btn-icon-close{
  width: 40px;
  height: 40px;
}
.mt-n-title{
  margin-top: -8px;
}
.lh-0{
  line-height: 0 !important;
}
.px-modal{
  padding: 0px 165px;
}
.card-title-2{
  font-size: 1rem;
}

/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {

}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
  .txt-sumber{
    font-size: 4rem;
  }
  .txt-lain {
    font-size: 4rem;
    margin-left: 1rem;
  }
  .txt-title-1{
    font-size: 3rem;
  }
  .txt-title-2{
    font-size: 2rem;
    letter-spacing: 0.2rem;
    line-height: 1;
  }
 
  .mb-1-5{
    margin-bottom: 0;
  }
  .img-foto{
    width: 70% !important;
  }
  .card-title{
    font-size: 1.5rem;
  }
  .mt-n-title{
    margin-top: -5px;
  }
  .title-tagline{
    font-size: 18px !important;
  }
  .rbl-tagline{
    font-size: 22px !important;
  }
  .txt-umur{
    margin-bottom: 20px !important;
  }
  
}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
  .modal-body{
    height: 86.5vh;
  }
  .px-modal{
    padding: 0 !important;
  }
}

/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
  /* .card-xxx{
    text-align: center;
  } */
  .card-xxx img{
    width: 65% !important;
    float: none;
    margin:auto;
  }
  .px-modal{
    padding: 0 30px;
  }
  
}

/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
 
}