.edukasi,
.edukasi * {
  box-sizing: border-box;
}
.edukasi {
  background: #ffffff;
  height: 832px;
  position: relative;
  overflow: hidden;
  width: 100%;
}
.div {
  color: #ffffff;
  text-align: left;
  font-family: "Inter-Regular", sans-serif;
  font-size: 48px;
  font-weight: 400;
  position: absolute;
  left: 1184px;
  top: 731px;
  width: 24px;
  height: 42px;
}
.frame-333 {
  padding: 14px;
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: flex-end;
  justify-content: flex-start;
  width: 494px;
  height: 253px;
  position: absolute;
  left: 605px;
  top: 466px;
  overflow: hidden;
}
.tempat-sampah-berwarna-memiliki-fungsi-berbeda-untuk-memudahkan-pemilahan-merah-untuk-sampah-berbahaya-seperti-baterai-dan-obat-kuning-untuk-sampah-anorganik-yang-bisa-didaur-ulang-seperti-plastik-kaca-dan-kertas-sedangkan-hijau-untuk-sampah-organik-seperti-sisa-makanan-dan-daun-yang-bisa-dijadikan-kompos-dengan-memilah-sampah-sesuai-warna-kita-ikut-menjaga-kebersihan-dan-mendukung-daur-ulang-demi-lingkungan-yang-lebih-sehat {
  color: #000000;
  text-align: justified;
  font-family: "Inter-Regular", sans-serif;
  font-size: 20px;
  font-weight: 400;
  position: relative;
  width: 475px;
  height: 239px;
}
.frame-328 {
  opacity: 0.5;
  flex-shrink: 0;
  width: 446px;
  height: 510px;
  position: relative;
  overflow: visible;
}
.image {
  padding: 5px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 313px;
  height: 288px;
  position: absolute;
  left: 285px;
  top: 140px;
  overflow: hidden;
}
.image-5 {
  align-self: stretch;
  flex-shrink: 0;
  height: 301.65px;
  position: relative;
  object-fit: cover;
  aspect-ratio: 303/301.65;
}
.sampah-bukan-sekadar-limbah-tetapi-juga-bisa-menjadi-sumber-nilai-ekonomi-jika-dikelola-dengan-benar-dengan-memilah-dan-mendaur-ulang-barang-bekas-dapat-diubah-menjadi-produk-baru-yang-bermanfaat-atau-bahkan-bernilai-jual-selain-membantu-menjaga-kebersihan-lingkungan-kebiasaan-ini-juga-bisa-menambah-pemasukan-mari-jadikan-daur-ulang-sebagai-langkah-cerdas-untuk-menjaga-bumi-sekaligus-meningkatkan-kesejahteraan {
  color: #000000;
  text-align: justified;
  font-family: "Inter-Regular", sans-serif;
  font-size: 20px;
  font-weight: 400;
  position: absolute;
  left: 615px;
  top: 173px;
  width: 522px;
}
.primary-600 {
  background: #98a2b3;
  border-radius: 40px;
  width: 236px;
  height: 236px;
  position: absolute;
  left: 18px;
  top: 266px;
}
.edukasi-sampah {
  color: #ffffff;
  text-align: left;
  font-family: "Inter-Regular", sans-serif;
  font-size: 36px;
  font-weight: 400;
  position: absolute;
  left: 55px;
  top: 74px;
  width: 144px;
}
.frame-342 {
  background: #388e3c;
  padding: 10px;
  width: 100%;
  height: 114px;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: hidden;
}
.frame-341 {
  display: flex;
  flex-direction: row;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  width: 690px;
  position: absolute;
  left: 42px;
  top: 57px;
}
.frame-334 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 103px;
  position: relative;
  overflow: hidden;
}
.image2 {
  flex-shrink: 0;
  width: 103px;
  height: 44px;
  position: relative;
  overflow: hidden;
}
.beranda {
  color: #ffffff;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 14px;
  top: 11px;
  width: 75px;
  height: 23px;
}
.frame-339 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 103px;
  position: relative;
  overflow: hidden;
}
.edukasi2 {
  color: #ffffff;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 14px;
  top: 11px;
  width: 75px;
  height: 23px;
}
.frame-335 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 103px;
  position: relative;
  overflow: hidden;
}
.layanan {
  color: #ffffff;
  text-align: center;
  font-family: "Poppins-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 14px;
  top: 11px;
  width: 75px;
  height: 23px;
}
.frame-336 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 103px;
  position: relative;
  overflow: hidden;
}
.kontak {
  color: #ffffff;
  text-align: center;
  position: absolute;
  left: 14px;
  top: 11px;
  width: 75px;
  height: 23px;
}
.kontak-span {
  font-family: "Poppins-Bold", sans-serif;
  font-size: 15px;
  font-weight: 700;
}
.kontak-span2 {
  font-family: "Poppins-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
}
.frame-340 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 166px;
  position: relative;
  overflow: hidden;
}
.tentang-kami {
  color: #ffffff;
  text-align: center;
  font-family: "Inter-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 32px;
  top: 4px;
  width: 120px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.frame-3422 {
  border-radius: 8px;
  display: flex;
  flex-direction: row;
  gap: 28px;
  align-items: center;
  justify-content: flex-start;
  position: absolute;
  left: 1009px;
  top: 57px;
}
.frame-3362 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 103px;
  height: 36px;
  position: relative;
  overflow: hidden;
}
.login {
  color: #ffffff;
  text-align: center;
  font-family: "Inter-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 11px;
  top: 6px;
  width: 81.9px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.frame-3392 {
  background: #388e3c;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 124px;
  height: 36px;
  position: relative;
  overflow: hidden;
}
.image3 {
  align-self: stretch;
  flex-shrink: 0;
  height: 44px;
  position: relative;
  overflow: hidden;
}
.register {
  color: #ffffff;
  text-align: center;
  font-family: "Inter-Bold", sans-serif;
  font-size: 16px;
  font-weight: 700;
  position: absolute;
  left: 21px;
  top: 6px;
  width: 81.9px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.image-4 {
  width: 339px;
  height: 226px;
  position: absolute;
  left: 260px;
  top: 478px;
  object-fit: cover;
  aspect-ratio: 3/2;
}