File size: 1,832 Bytes
b8b80bc d26d78d b8b80bc 138f2f5 b8b80bc d302e50 b8b80bc d302e50 b8b80bc d302e50 b8b80bc 492db51 d302e50 b8b80bc d302e50 b8b80bc d302e50 b8b80bc 492db51 b8b80bc 492db51 b8b80bc 4f6b6be b8b80bc 492db51 b8b80bc 492db51 b8b80bc 42b530b b8b80bc 42b530b b8b80bc 42b530b b8b80bc |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
/* Reset margin dan padding untuk body */
body {
margin: 0;
padding: 0;
overflow-x: hidden; /* Menonaktifkan geser horizontal */
font-family: Arial, sans-serif;
}
/* Navbar */
.navbar {
display: flex;
justify-content: space-between;
align-items: center;
background-color: #004d00; /* Warna hijau tua */
padding: 10px 20px;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 100;
width: 100%;
}
/* Logo */
.logo img {
height: 40px; /* Atur ukuran logo sesuai keinginan */
width: auto;
}
/* Nama Brand */
.brand-name h1 {
color: white;
margin: 0;
font-size: 24px;
}
/* Menambahkan padding pada konten agar tidak tertutup navbar */
.content {
margin-top: 60px; /* Disesuaikan dengan tinggi navbar */
padding: 20px;
}
/* Menyesuaikan warna latar belakang konten */
.headline {
background-color: #004d00; /* Warna hijau tua */
color: white;
padding: 20px;
text-align: center;
}
/* Styling untuk footer */
.footer {
background-color: #808080; /* Warna abu-abu */
color: white;
padding: 20px;
text-align: center;
}
/* Styling untuk box How To Use */
.steps {
background-color: #004d00;
color: white;
padding: 20px;
margin-top: 20px;
border-radius: 10px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
/* Styling untuk kotak Step-by-Step */
.step-box {
background-color: #cccccc;
padding: 20px;
margin: 10px 0;
border-radius: 10px;
text-align: center;
}
/* Untuk desktop (web mode) */
@media screen and (min-width: 768px) {
.steps {
display: flex;
justify-content: space-between;
}
.step-box {
width: 30%;
}
}
/* Untuk mobile (mode vertikal) */
@media screen and (max-width: 767px) {
.steps {
display: block;
} |