File tree Expand file tree Collapse file tree 1 file changed +119
-0
lines changed Expand file tree Collapse file tree 1 file changed +119
-0
lines changed Original file line number Diff line number Diff line change
1
+ /* Global Reset */
2
+ * {
3
+ margin : 0 ;
4
+ padding : 0 ;
5
+ box-sizing : border-box;
6
+ }
7
+
8
+ body {
9
+ font-family : 'Arial' , sans-serif;
10
+ background : linear-gradient (135deg , # 6e7c89, # 354b5b ); /* Background gradient */
11
+ color : # f5f5f5 ;
12
+ }
13
+
14
+ .container {
15
+ width : 80% ;
16
+ margin : 0 auto;
17
+ }
18
+
19
+ header {
20
+ text-align : center;
21
+ padding : 40px 0 ;
22
+ background : rgba (0 , 0 , 0 , 0.7 );
23
+ border-radius : 15px ;
24
+ margin-top : 30px ;
25
+ }
26
+
27
+ h1 {
28
+ font-size : 2.5rem ;
29
+ color : # ffcc00 ;
30
+ }
31
+
32
+ p {
33
+ font-size : 1.1rem ;
34
+ color : # f5f5f5 ;
35
+ }
36
+
37
+ section {
38
+ padding : 40px 0 ;
39
+ }
40
+
41
+ h2 {
42
+ font-size : 2rem ;
43
+ margin-bottom : 20px ;
44
+ text-align : center;
45
+ }
46
+
47
+ .about ul {
48
+ list-style : none;
49
+ padding : 0 ;
50
+ margin : 20px auto;
51
+ max-width : 600px ;
52
+ }
53
+
54
+ .about ul li {
55
+ font-size : 1.2rem ;
56
+ margin-bottom : 10px ;
57
+ }
58
+
59
+ .cta {
60
+ background : rgba (0 , 0 , 0 , 0.5 );
61
+ border-radius : 15px ;
62
+ padding : 30px ;
63
+ text-align : center;
64
+ }
65
+
66
+ .install-btn {
67
+ display : inline-block;
68
+ background-color : # ffcc00 ;
69
+ color : # 354b5b ;
70
+ padding : 15px 30px ;
71
+ font-size : 1.2rem ;
72
+ text-decoration : none;
73
+ border-radius : 25px ;
74
+ transition : all 0.3s ease;
75
+ }
76
+
77
+ .install-btn : hover {
78
+ background-color : # ffb800 ;
79
+ transform : translateY (-3px );
80
+ }
81
+
82
+ .install-btn : active {
83
+ transform : translateY (1px );
84
+ }
85
+
86
+ footer {
87
+ text-align : center;
88
+ padding : 40px 20px ; /* Increased padding for more breathing space */
89
+ background : linear-gradient (135deg , # 354b5b, # 6e7c89 ); /* Gradient background for depth */
90
+ color : # f5f5f5 ;
91
+ border-top : 3px solid # ffcc00 ; /* Thicker border for more emphasis */
92
+ margin-top : 40px ;
93
+ box-shadow : 0 4px 10px rgba (0 , 0 , 0 , 0.2 ); /* Soft shadow for depth */
94
+ }
95
+
96
+ footer p {
97
+ font-size : 1.1rem ;
98
+ margin : 10px 0 ;
99
+ color : # f5f5f5 ;
100
+ line-height : 1.5 ;
101
+ }
102
+
103
+ footer p a {
104
+ color : # ffcc00 ;
105
+ text-decoration : none;
106
+ font-weight : bold;
107
+ transition : color 0.3s ease, transform 0.3s ease;
108
+ }
109
+
110
+ footer p a : hover {
111
+ color : # ffb800 ;
112
+ transform : translateY (-2px ); /* Slight hover animation */
113
+ }
114
+
115
+ @media (max-width : 768px ) {
116
+ footer p {
117
+ font-size : 1rem ; /* Slightly smaller text on smaller screens */
118
+ }
119
+ }
You can’t perform that action at this time.
0 commit comments