#xxtest {
  position: sticky;
  top: 80; /* Jarak dari atas */
  z-index: 100; /* Pastikan elemen ini berada di atas elemen lain */
}
.radio-wrapperx {
  display: flex;
  width: 100%;
  gap: 10px;
}
.custom-radiox {
  flex: 1; /* Membuat setiap label mengambil ruang yang sama */
  display: flex; /* Mengaktifkan Flexbox pada label */
  justify-content: center; /* Rata tengah secara horizontal */
  align-items: center; /* Rata tengah secara vertikal */
  padding: 5px 10px;
  border: 1px solid #DBDBDC;
  border-radius: 5px;
  cursor: pointer;
  font-weight: normal;
  box-sizing: border-box;
}
.custom-radio1x {
  flex: 1; /* Membuat setiap label mengambil ruang yang sama */
  display: flex;
  flex-direction: column; /* Mengatur teks dalam dua baris */
  justify-content: center;
  align-items: flex-start;
  padding: 5px 10px;
  border: 1px solid #DBDBDC;
  border-radius: 5px;
  cursor: pointer;
  box-sizing: border-box;
  text-align: left;
  font-weight: bold;
  font-size: 12px;
}
.custom-radio1x .harga {
  font-size: 0.85em; /* Ukuran font lebih kecil untuk baris kedua */
  color: #555; /* Warna abu-abu untuk membedakan */
}
input[type="radio"] {
  display: none;
}
input[type="radio"]:checked + .custom-radiox {
  border-color: black;
}
input[type="radio"]:checked + .custom-radio1x {
  border-color: black;
}
.custom-input-group {
  display: flex;
  align-items: center;
}
.custom-input-group .custom-btn {
  border: 1px solid #E5E7F0;
  color: black;
  width: 30px;
  height: 30px; /* Atur tinggi menjadi 30px */
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ECF1F5;
  cursor: pointer;
  margin: 0; /* Pastikan tidak ada margin */
}
/* Border radius kiri 50% untuk minusBtn */
#minusBtn {
  border-radius: 50% 0 0 50%;
}
/* Border radius kanan 50% untuk plusBtn */
#plusBtn {
  border-radius: 0 50% 50% 0;
}
.custom-input-group .custom-btn:hover {
  background-color: #6c757d;
  color: #fff;
}
.custom-input-group .custom-input {
  text-align: center;
  height: 30px; /* Atur tinggi input menjadi 30px */
  border: 1px solid #E5E7F0;
  border-left: none; /* Menghilangkan border kiri agar menyatu dengan tombol minus */
  border-right: none; /* Menghilangkan border kanan agar menyatu dengan tombol plus */
  width: 60px;
  margin: 0; /* Pastikan tidak ada margin antara tombol dan input */
  border-radius: 0;
  background-color: #ECF1F5;
}
.gallery-container {
  display: flex;
  align-items: flex-start;
}
.thumbnail-container {
  display: flex;
  flex-direction: column;
}
.thumbnail-container .thumbnail1 {
  width: 100px;
  height: 100px;
  margin: 0px;
  border: 1px solid transparent; /* Default tanpa border */
  cursor: pointer;
	margin-bottom: 5px;
}
.thumbnail.selected {
  border: 1px solid red; /* Border merah saat thumbnail dipilih */
}
.main-image-container img {
  width: 100%;
  height: 100%;
  margin-left: 5px;
}

/* Media query untuk layar dengan lebar maksimum 600px */
@media (max-width: 600px) {
  .thumbnail {
    width: 50px;
    height: 50px;
  }
}

.carousel-inner img {
  width: 100%;
  height: auto;
}
.carousel-control {
  visibility: hidden;
}
.carousel:hover .carousel-control {
  visibility: visible;
}
.carousel-control.left, .carousel-control.right {
  visibility: hidden;
}
.carousel:hover .carousel-control.left, .carousel:hover .carousel-control.right {
  visibility: visible;
}
.carousel-control.left .fa, .carousel-control.right .fa {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.carousel-control.left .fa {
  left: 15px; /* Adjust this value as needed */
}
.carousel-control.right .fa {
  right: 15px; /* Adjust this value as needed */
}
.MultiCarousel {
  float: left;
  overflow: hidden;
  padding: 10px;
  width: 100%;
  position: relative;
}
.MultiCarousel .MultiCarousel-inner {
  transition: 1s ease all;
  float: left;
}
.MultiCarousel .MultiCarousel-inner .item1 {
  float: left;
}
.MultiCarousel .MultiCarousel-inner .item1 > div {
  text-align: center;
  padding: 5px;
  margin: 10px;
  background: #F9F9F9;
  color: #666;
  border-radius: 10px;
}
.MultiCarousel .leftLst, .MultiCarousel .rightLst {
  position: absolute;
  border-radius: 50%;
  top: 40%; /* Ini menempatkan tombol di tengah vertikal */
  transform: translateY(-50%); /* Ini menyesuaikan posisi secara sempurna ke tengah */
  background-color: white; /* Pastikan tombol terlihat dengan latar belakang */
}
@media (max-width: 1085px) {
  .MultiCarousel .leftLst, .MultiCarousel .rightLst {
    top: 35%;
  }
}
.MultiCarousel .leftLst {
  left: 0;
}
.MultiCarousel .rightLst {
  right: 0;
}
.MultiCarousel .leftLst.over, .MultiCarousel .rightLst.over {
  pointer-events: none;
  color: aliceblue;
  display: none;
}
.btn-default:focus, .btn-default.focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default {
  outline: none !important;
}
.containertrak {
  display: flex;
  align-items: center;
  border: #3F3434
}
.imagew {
  flex: 0 0 50px; /* Menetapkan lebar tetap */
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 50px;
  border: 1px solid #FFD9D9;
  border-radius: 50%; /* Membuat elemen berbentuk bulat */
  background: #FFD9D9;
}
.imagew i {
  font-size: 30px;
  color: #FF0000;
}
.content {
  flex: 2;
  padding: 0 10px; /* Mengatur ruang antara judul dan deskripsi */
}
.title {
  font-size: 14px;
  margin-top: 0px;
  font-weight: bold;
  margin-bottom: 2px; /* Mengatur jarak antara judul dan deskripsi */
}
.description {
  font-size: 10px;
  line-height: 10px;
  color: #9A9999;
}
.reversed-icon {
  transform: scaleX(-1); /* Memutar ikon secara horizontal */
  display: inline-block; /* Membuat ikon berada dalam satu baris dengan teks */
}
.image-container {
  padding: 5px;
}
.rekta {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px;
  border-radius: 10px;
}
.rekta svg path, .rekta svg circle {
  transition: fill 0.3s; /* Efek transisi saat hover */
}
.rekta:hover svg path, .rekta:hover svg circle {
  fill: white;
}
.rekta-container:hover .rekta {
  background-color: #2C3C4A;
  color: aliceblue;
}
.rekta-container:hover .text-container1 {
  color: #D1D1D1;
}
.text-container {
  margin: 10px 0;
}
.text-container1 {
  margin: 10px 0;
  font-size: 10px;
  color: #605F5F;
}
.mudah {
  height: 600px;
  border-radius: 10px;
  background: linear-gradient(to bottom, #F2F2F2 10%, #FFFFFF 40%);
  padding: 10px 20px;
}
.tblord {
  border: #FC0004 1px solid;
  height: 28px;
  border-radius: 10px;
  padding: 5px;
  font-size: 11px;
  color: #CC0A0D;
  font-weight: bold;
  width: 100px;
  text-align: center;
}
.tblord:hover {
  color: aliceblue;
  background: #FF0000;
}
.col-md-9 {
  width: 66.66666667%;
}
.col-md-8 {
  width: 66.66666667%;
}
.col-md-3 {
  width: 33.33333333%;
}
.col-md-4 {
  width: 33.33333333%;
}
@media (max-width: 1085px) {
  .col-md-9 {
    width: 60%;
  }
  .col-md-8 {
    width: 60%;
  }
  .col-md-3 {
    width: 40%;
  }
  .col-md-4 {
    width: 40%;
  }
}
.containerbarufix {
  max-width: 1250px !important;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
	flex: 1; 
}
@media (max-width: 1085px) {
  .containerbarufix {
    max-width: 980px !important;
  }
  #f1 {
    display: none;
  }
  #f2 {
    display: none;
  }
  #f3 {
    display: none;
  }
  .col-md-9 {
    width: 50%;
  }
  .col-md-8 {
    width: 50%;
  }
  .col-md-3 {
    width: 50%;
  }
  .col-md-4 {
    width: 50%;
  }
}
@media (max-width: 1400px) {
  .containerbarufix {
    max-width: 980px !important;
  }
}
.tombolorder {
  padding: 10px;
  border-radius: 10px;
  background: black;
  color: aliceblue;
}
#deskripsiList {
  height: 30px; /* Sesuaikan dengan tinggi 3 baris */
  overflow: hidden;
}
#deskripsiList1 {
  height: 80px; /* Sesuaikan dengan tinggi 3 baris */
  overflow: hidden;
}
/* Jika tombol diklik, maka seluruh daftar ditampilkan */
#deskripsiList.expanded {
  height: auto; /* Tampilkan seluruh daftar */
}
#deskripsiList1.expanded {
  height: auto; /* Tampilkan seluruh daftar */
}