adnaan05 KhaqanNasir commited on
Commit
97b047e
·
verified ·
1 Parent(s): b6bd950

Update style.css (#4)

Browse files

- Update style.css (42313792cf54c847b509c122e1d5ef479bc0ce5e)


Co-authored-by: Muhammad Khaqan Nasir <[email protected]>

Files changed (1) hide show
  1. style.css +117 -1
style.css CHANGED
@@ -1,4 +1,4 @@
1
- body {
2
  padding: 2rem;
3
  font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
  }
@@ -26,3 +26,119 @@ p {
26
  .card p:last-child {
27
  margin-bottom: 0;
28
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /* body {
2
  padding: 2rem;
3
  font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
  }
 
26
  .card p:last-child {
27
  margin-bottom: 0;
28
  }
29
+ */
30
+
31
+
32
+
33
+
34
+
35
+
36
+
37
+
38
+
39
+ body {
40
+ font-family: 'Poppins', sans-serif;
41
+ background-color: #FFFFFF;
42
+ color: #333333;
43
+ margin: 0;
44
+ padding: 0;
45
+ }
46
+
47
+ .hero-section {
48
+ background-color: #F4F7FA;
49
+ padding: 4rem 2rem;
50
+ text-align: center;
51
+ }
52
+
53
+ .hero-content {
54
+ max-width: 1200px;
55
+ margin: 0 auto;
56
+ display: flex;
57
+ align-items: center;
58
+ gap: 2rem;
59
+ }
60
+
61
+ .hero-text {
62
+ flex: 1;
63
+ text-align: left;
64
+ }
65
+
66
+ .hero-text h1 {
67
+ font-size: 2.5rem;
68
+ margin: 0 0 1rem;
69
+ }
70
+
71
+ .hero-text p {
72
+ font-size: 1.2rem;
73
+ color: #666666;
74
+ margin: 0 0 1.5rem;
75
+ }
76
+
77
+ .hero-image {
78
+ flex: 1;
79
+ }
80
+
81
+ .hero-image img {
82
+ width: 100%;
83
+ border-radius: 12px;
84
+ }
85
+
86
+ .btn {
87
+ display: inline-block;
88
+ background-color: #4B5EAA;
89
+ color: white;
90
+ padding: 0.75rem 1.5rem;
91
+ border-radius: 8px;
92
+ text-decoration: none;
93
+ font-weight: 600;
94
+ transition: background-color 0.3s;
95
+ }
96
+
97
+ .btn:hover {
98
+ background-color: #3A4A8C;
99
+ }
100
+
101
+ .container {
102
+ max-width: 800px;
103
+ margin: 2rem auto;
104
+ padding: 0 2rem;
105
+ }
106
+
107
+ h2 {
108
+ font-size: 1.8rem;
109
+ margin-bottom: 1rem;
110
+ }
111
+
112
+ p, ul {
113
+ font-size: 1rem;
114
+ color: #666666;
115
+ line-height: 1.6;
116
+ }
117
+
118
+ ul {
119
+ padding-left: 1.5rem;
120
+ }
121
+
122
+ a {
123
+ color: #4B5EAA;
124
+ text-decoration: none;
125
+ }
126
+
127
+ a:hover {
128
+ text-decoration: underline;
129
+ }
130
+
131
+ @media (max-width: 768px) {
132
+ .hero-content {
133
+ flex-direction: column;
134
+ text-align: center;
135
+ }
136
+
137
+ .hero-text {
138
+ text-align: center;
139
+ }
140
+
141
+ .hero-image {
142
+ margin-top: 2rem;
143
+ }
144
+ }