@media (max-width: 575.98px) {
  h1 {
    font-size: 20px;
  }
  h2 {
    font-size: 18px;
  }
  p {
    font-size: 15px;
  }
  .text-see-all {
    display: flex;
  }
  .form-control {
    font-size: 15px;
  }
  /* home */
  .home-1-title {
    font-size: 24px;
  }
  .home-3-card {
    margin-right: 0;
    margin: 0 15px;
    flex-direction: column;
  }
  .job-card {
    margin-right: 0;
    margin: 0 10px;
  }
  .latest-job-tag {
    min-width: 120px;
  }
  .auth .modal-content {
    width: 96%;
  }
  .btn-filter {
    width: 26px;
    height: 26px;
  }
  /* job detail  */
  .job-detail {
    justify-content: end;
    height: auto;
    min-height: 80dvh;
    padding-bottom: 2rem;
  }
  /* blog */
  .blog .fw-bold {
    font-size: 24px;
  }
  /* about-us */
  .about-us p {
    font-size: 24px;
  }
  /* .about-us-3 {
    padding: 20px 0;
  }
  .about-us-4 {
    padding: 20px 0;
  } */

  .profile-email {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .detail-profile .nav-link {
    min-width: max-content;
  }
  .hero-pencari-telent {
    flex-flow: column-reverse;
    gap: 20px;
  }
  .card-overlay {
    position: relative !important;
    overflow: hidden;
    transform: none;
    left: auto;
    margin-top: 30px;
    flex-direction: column;
    width: 90% !important;
    gap: 20px;
  }
  .top-talent-awal .card-item {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
  .top-talent-awal {
    padding-bottom: 30px;
  }
  .mid-talent-awal {
    padding-top: 30px;
  }
  .mid-talent-awal .row {
    flex-flow: column-reverse;
    gap: 30px;
  }
  .img-women-cpb {
    width: 100%;
  }
  .card-post-info-loker {
    padding-bottom: 1.5rem !important;
  }
  .home-2,
  .home-3,
  .home-4,
  .contact-us,
  .blog-2,
  .job-list,
  .about-us-2,
  .about-us-3,
  .about-us-4,
  .job-detail-des {
    padding: 30px 0;
  }
  .home-1 {
    padding-bottom: 30px;
  }
  .footer {
    padding: 30px 0;
  }
  .footer-logo {
    margin-bottom: 30px;
  }
  #navbarNav {
    margin-top: 30px;
  }

  .contact-us-content img {
    width: 100%;
  }
  .btn-post-loker {
    position: relative;
    bottom: auto;
  }

  .job .search-box {
    margin-top: 60px;
  }
  .right-talent-awal img {
    width: 100%;
  }
  .testi-img {
    margin-bottom: 30px;
  }
  .box-auth-btn {
    margin-top: 20px;
  }
  .box-action-filter {
    display: flex;
    flex-direction: row;
    gap: 20px;
    position: fixed;
    bottom: 10px;
    left: 0;
    width: 100%;
    align-self: center;
    padding: 0 20px;
  }
  .box-action-filter button {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
  }
  .btn-clear {
    border: 1px solid #1559a6;
    color: #1559a6;
    background-color: #fff;
  }
  .btn-aplly {
    background: linear-gradient(71.63deg, #1559a6 25.34%, #008cff 113.59%);
    color: #fff;
  }
  #boxActSubQuest {
    flex-flow: column;
  }
  .btn-delete-question {
    max-width: 140px;
  }
  .detail-exp-top-left {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .detail-exp-top-right {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
  }
  .job-list-scroll {
    overflow: visible;
  }
  /* lamaran */
  .lamaran-saya {
    min-height: 30dvh;
  }
  .lamaran-saya .title {
    margin-top: 0 !important;
  }
  .card-lamaran {
    padding: 10px 0;
  }
  .card-lamaran .left {
    margin-bottom: 20px;
  }
  .card-lamaran .middle {
    display: flex;
    flex-direction: column !important;
    margin-bottom: 20px;
    align-items: flex-start;
  }
  .card-lamaran .middle .box-calender {
    margin-bottom: 10px;
  }
  .card-lamaran .status {
    margin-top: 0;
    margin-left: 0px;
    min-width: 120px;
  }
  .card-lamaran .right {
    justify-content: flex-start;
  }
  .card-padding {
    padding: 10px;
  }
  .card-kandidat {
    padding: 10px;
  }
  .card-kandidat .middle {
    margin-top: 20px;
    flex-direction: column;
    align-items: flex-start;
  }
  .card-kandidat .right {
    padding-left: 0;
    justify-content: flex-end;
    gap: 20px;
    margin-top: 20px;
  }
  .action-kandidat .box-img {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
  }
  .action-kandidat .text-kandidat {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
  }
  .box-sosmed {
    display: flex;
    flex-direction: column;
    gap: 0px;
  }
  .box-photo{
    flex-direction: column;
  }
   .upload-box {
    width: 100%;
    height: 160px;
    margin-bottom: 10px;
  }
  .edit-profile-rekruter {
    padding-bottom: 30px;
}
.rekruter-form-edit {
  max-height: max-content; /* tinggi area scroll */
  overflow-y: visible;}
}
@media (max-width: 767.98px) {
  .btn-btn-search {
    width: 100% !important;
    margin-top: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  /* home */
  .home-1-title {
    font-size: 24px;
  }
  .search-box {
    display: block;
  }
  .select-exp {
    width: 100%;
  }
  .btn-btn-search {
    width: 100%;
    margin-top: 12px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  /* home */
  .home-1-title {
    font-size: 40px;
  }
  .search-box {
    display: flex;
  }
  .search-divider {
    border-left: 1px solid #ddd;
  }
  .select-exp {
    width: 20%;
  }
  .card-keuntungan {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .card-keuntungan .btn {
    width: max-content;
  }
  .job {
    height: 26vh;
    padding-top: 4vh;
  }
  .auth .modal-content {
    width: 50%;
  }
  .hero-pencari-telent {
    flex-flow: column-reverse;
    gap: 20px;
  }
  .card-overlay {
    position: relative !important;
    overflow: hidden;
    transform: none;
    left: auto;
    margin-top: 60px;
  }
  .top-talent-awal {
    padding-bottom: 60px;
  }

  .top-talent-awal .card-item {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }
  .top-talent-awal .card-item .text-center {
    margin-top: 10px;
  }
  .mid-talent-awal {
    padding-top: 60px;
  }
  .mid-talent-awal .row {
    flex-flow: column-reverse;
    gap: 30px;
  }
  .profile-email {
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .contact-us-content img {
    width: 100%;
  }
  .btn-post-loker {
    position: relative;
    bottom: auto;
  }
  .blog {
    height: 30dvh;
  }
  .job {
    height: 30dvh;
  }
  .about-us {
    height: 30dvh;
  }
  .home-3-card {
    flex-direction: column;
    margin-right: 0;
    margin: 0 15px;
  }
  .testi-img {
    margin-bottom: 30px;
  }
  .box-auth-btn {
    margin-top: 20px;
  }
  .detail-profile .nav-link {
    width: max-content;
  }
  .lamaran-saya {
    min-height: 30dvh;
  }
  .lamaran-saya .title {
    margin-top: 0 !important;
  }
  .card-lamaran .left {
    margin-bottom: 20px;
  }
  .card-lamaran .middle {
    display: flex;
    flex-direction: row;
  }
  .card-lamaran .status {
    margin-top: 0;
    margin-left: 40px;
  }
  .card-kandidat {
    padding: 20px;
  }
  .card-kandidat .middle {
    margin-top: 20px;
  }
  .card-kandidat .right {
    padding-left: 0;
    justify-content: flex-end;
    gap: 20px;
    margin-top: 20px;
  }
  .action-kandidat .box-button {
    justify-content: flex-end;
    padding-right: 140px;
  }
  .box-sosmed {
    gap: 0px;
  }
  .upload-box {
    width: 49%;
    height: 160px;
  }
  .rekruter-form-edit {
  max-height: 80vh; /* tinggi area scroll */
  overflow-y: scroll;}

}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .search-box {
    display: flex;
  }
  .search-divider {
    border-left: 1px solid #ddd;
  }
  .select-exp {
    width: 20%;
  }
}
@media (min-width: 1200px) {
  .search-box {
    display: flex;
  }
  .search-divider {
    border-left: 1px solid #ddd;
  }
  .select-exp {
    width: 20%;
  }
  /* .input-location {
    width: 20%;
  } */
}

@media (min-width: 992px) {
  .talent .col-lg-3 {
    flex: 0 0 auto;
    width: 20%;
  }
}