GarGerry commited on
Commit
3a64621
·
verified ·
1 Parent(s): d5cf11c

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +54 -24
style.css CHANGED
@@ -3,21 +3,39 @@ body {
3
  font-family: Arial, sans-serif;
4
  margin: 0;
5
  padding: 0;
 
 
 
 
 
 
 
 
 
 
 
 
6
  }
7
 
8
  /* Header */
9
  header {
10
  background: #6a0dad;
11
  color: white;
12
- padding: 1.5rem 0;
13
  text-align: center;
14
  }
15
 
16
  nav ul {
 
17
  display: flex;
18
  justify-content: center;
19
- gap: 1rem; /* Menambahkan jarak antar link */
20
- list-style: none;
 
 
 
 
 
21
  }
22
 
23
  nav ul li a {
@@ -26,37 +44,47 @@ nav ul li a {
26
  font-weight: bold;
27
  }
28
 
 
 
 
 
29
  /* Section Styling */
30
  section {
31
- margin: 2rem 0; /* Tambahkan margin antar section */
32
  padding: 0 1rem;
 
 
 
 
 
 
33
  }
34
 
35
  h2 {
36
- color: #6a0dad;
37
- font-size: 1.5rem;
38
  margin-bottom: 1rem;
39
  }
40
 
41
- p, ul li {
42
- font-size: 1rem;
43
- line-height: 1.5; /* Menambahkan ruang antar teks */
 
 
44
  }
45
 
46
  /* Form Styling */
47
  form {
48
- max-width: 90%;
49
- margin: 0 auto;
50
  display: flex;
51
  flex-direction: column;
52
  gap: 1rem;
 
 
53
  }
54
 
55
  form input, form textarea {
56
- width: 100%;
57
  padding: 0.8rem;
58
  border: 1px solid #ccc;
59
  border-radius: 5px;
 
60
  }
61
 
62
  form button {
@@ -77,30 +105,32 @@ form button:hover {
77
  footer {
78
  text-align: center;
79
  padding: 1rem;
80
- background: #f8f8f8;
 
81
  font-size: 0.9rem;
82
  }
83
 
84
  /* Responsive */
85
  @media (max-width: 768px) {
86
- header {
87
- padding: 1rem 0;
88
- }
89
-
90
  nav ul {
91
- flex-direction: column; /* Navigasi menjadi vertikal */
92
  gap: 0.5rem;
93
  }
94
 
95
- h2 {
96
- font-size: 1.2rem;
 
97
  }
98
 
99
- form input, form textarea {
100
- padding: 0.5rem; /* Perkecil padding */
101
  }
102
 
103
- form button {
104
- font-size: 0.9rem;
 
 
 
 
105
  }
106
  }
 
3
  font-family: Arial, sans-serif;
4
  margin: 0;
5
  padding: 0;
6
+ line-height: 1.6;
7
+ background-color: #f4f4f9;
8
+ }
9
+
10
+ h1, h2 {
11
+ color: #6a0dad;
12
+ text-align: center;
13
+ }
14
+
15
+ p, ul, li {
16
+ margin: 0;
17
+ padding: 0;
18
  }
19
 
20
  /* Header */
21
  header {
22
  background: #6a0dad;
23
  color: white;
24
+ padding: 1rem 0;
25
  text-align: center;
26
  }
27
 
28
  nav ul {
29
+ list-style: none;
30
  display: flex;
31
  justify-content: center;
32
+ gap: 1.5rem;
33
+ padding: 0;
34
+ margin: 0.5rem 0 0;
35
+ }
36
+
37
+ nav ul li {
38
+ display: inline;
39
  }
40
 
41
  nav ul li a {
 
44
  font-weight: bold;
45
  }
46
 
47
+ nav ul li a:hover {
48
+ text-decoration: underline;
49
+ }
50
+
51
  /* Section Styling */
52
  section {
53
+ margin: 2rem auto;
54
  padding: 0 1rem;
55
+ max-width: 800px;
56
+ text-align: center;
57
+ background: white;
58
+ border-radius: 8px;
59
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
60
+ padding: 1.5rem;
61
  }
62
 
63
  h2 {
 
 
64
  margin-bottom: 1rem;
65
  }
66
 
67
+ ul {
68
+ list-style-type: disc;
69
+ margin: 1rem 0;
70
+ padding-left: 20px;
71
+ text-align: left;
72
  }
73
 
74
  /* Form Styling */
75
  form {
 
 
76
  display: flex;
77
  flex-direction: column;
78
  gap: 1rem;
79
+ max-width: 400px;
80
+ margin: 0 auto;
81
  }
82
 
83
  form input, form textarea {
 
84
  padding: 0.8rem;
85
  border: 1px solid #ccc;
86
  border-radius: 5px;
87
+ width: 100%;
88
  }
89
 
90
  form button {
 
105
  footer {
106
  text-align: center;
107
  padding: 1rem;
108
+ background: #6a0dad;
109
+ color: white;
110
  font-size: 0.9rem;
111
  }
112
 
113
  /* Responsive */
114
  @media (max-width: 768px) {
 
 
 
 
115
  nav ul {
116
+ flex-direction: column;
117
  gap: 0.5rem;
118
  }
119
 
120
+ section {
121
+ margin: 1.5rem 1rem;
122
+ padding: 1rem;
123
  }
124
 
125
+ form {
126
+ width: 90%;
127
  }
128
 
129
+ h1 {
130
+ font-size: 1.5rem;
131
+ }
132
+
133
+ h2 {
134
+ font-size: 1.2rem;
135
  }
136
  }