Update style.css

style.css

@@ -9,11 +9,12 @@ body {
   background: linear-gradient(135deg, #F3F4F9, #C9D6E3);
   display: flex;
   flex-direction: column; /* Menyusun elemen secara vertikal */
-  justify-content: flex-start; /* Pastikan konten dimulai dari atas */
+  justify-content: flex-start;
   align-items: center;
-  min-height: 100vh; /* Agar tinggi halaman memenuhi layar */
+  min-height: 100vh;
   color: #333;
   position: relative;
+  padding-top: 20px; /* Menambahkan ruang untuk header */
 }
 
 .container {
@@ -25,7 +26,7 @@ body {
   max-width: 600px;
   text-align: center;
   position: relative;
-  margin-bottom: 20px; /* Tambahkan jarak agar footer tidak tumpang tindih */
+  margin-bottom: 20px;
 }
 
 h1 {
@@ -44,9 +45,9 @@ input, select {
   border: 1px solid #E0E0E0;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
   transition: all 0.3s ease;
-  appearance: none; /* Menghapus tampilan default dropdown */
-  -webkit-appearance: none; /* Untuk Safari */
-  -moz-appearance: none; /* Untuk Firefox */
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
   background-color: #fff;
   color: #555;
 }
@@ -57,16 +58,14 @@ input:focus, select:focus {
   box-shadow: 0 0 8px rgba(0, 180, 50, 0.2);
 }
 
-/* Gaya untuk elemen select agar lebih modern */
 select {
-  background-image: url('https://img.icons8.com/ios/452/down-squared.png'); /* Ikon dropdown */
+  background-image: url('https://img.icons8.com/ios/452/down-squared.png');
   background-repeat: no-repeat;
   background-position: right 10px center;
   background-size: 16px;
-  padding-right: 40px; /* Memberikan ruang untuk ikon di kanan */
+  padding-right: 40px;
 }
 
-/* Styling untuk selector mata uang */
 .currency-selectors {
   display: flex;
   justify-content: center;
@@ -109,7 +108,6 @@ button:hover {
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }
 
-/* Footer - Letakkan di bawah */
 footer {
   width: 100%;
   text-align: center;
@@ -117,14 +115,13 @@ footer {
   font-size: 14px;
   color: #333;
   background-color: #fff;
-  border-top: 1px solid #ddd; /* Memberikan garis pembatas */
+  border-top: 1px solid #ddd;
 }
 
 footer p {
   margin: 0;
 }
 
-/* Responsif untuk Mobile */
 @media (max-width: 768px) {
   .container {
     padding: 30px;
@@ -144,7 +141,6 @@ footer p {
   }
 }
 
-/* Responsif untuk tampilan yang lebih besar (Tablet ke atas) */
 @media (min-width: 769px) {
   .container {
     max-width: 700px;