Skip to content

Commit 931a683

Browse files
author
Sachin Maheshwari
committed
adding css and logo images
1 parent 27e3040 commit 931a683

File tree

3 files changed

+374
-0
lines changed

3 files changed

+374
-0
lines changed

‎web-assets/css/styles.css

Lines changed: 374 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,374 @@
1+
:root {
2+
font-size: 62.5%;
3+
}
4+
5+
html {
6+
-webkit-tap-highlight-color: #59a7ff;
7+
box-sizing: border-box;
8+
min-height: 100%;
9+
}
10+
11+
body {
12+
background-color: #f6f6f6;
13+
font-family: "Roboto", sans-serif;
14+
font-size: 1.4rem;
15+
font-weight: 400;
16+
margin: 0;
17+
padding: 0;
18+
}
19+
20+
*,
21+
:after,
22+
:before {
23+
box-sizing: inherit;
24+
}
25+
26+
/*For IE*/
27+
main {
28+
display: block;
29+
}
30+
31+
a,
32+
a:active,
33+
a:visited {
34+
-webkit-tap-highlight-color: transparent;
35+
color: #0d61bf;
36+
cursor: pointer;
37+
outline: 0;
38+
text-decoration: none;
39+
}
40+
a:hover {
41+
color: #097dce;
42+
text-decoration: none;
43+
}
44+
45+
button {
46+
background-color: #006ad7;
47+
border: 1px solid transparent;
48+
border-radius: 25px;
49+
color: #fff;
50+
font-size: 1.6rem;
51+
font-weight: 600;
52+
height: 50px;
53+
letter-spacing: 0.5px;
54+
line-height: 1;
55+
min-width: 150px;
56+
outline: 0;
57+
text-transform: uppercase;
58+
}
59+
60+
button:not(:disabled):hover {
61+
background-image: linear-gradient(180deg, #3996ff, #127bf3);
62+
}
63+
a,
64+
button {
65+
cursor: pointer;
66+
transition: all 0.15s;
67+
}
68+
69+
button:focus,
70+
a:focus {
71+
outline: 1px solid #59a7ff;
72+
}
73+
74+
button:disabled {
75+
background-color: #d1d3d4;
76+
border: none;
77+
cursor: default;
78+
opacity: 0.4;
79+
}
80+
81+
p {
82+
color: #37373c;
83+
font-size: 1.6rem;
84+
margin: 0 0 10px;
85+
}
86+
h1 {
87+
align-self: center;
88+
color: #2a2a2a;
89+
font-size: 3.4rem;
90+
font-weight: 400;
91+
margin: 20px 0;
92+
text-transform: uppercase;
93+
}
94+
95+
select,
96+
input {
97+
background-color: transparent;
98+
border: 1px solid #aaa;
99+
border-radius: 5px;
100+
color: #2a2a2a;
101+
font-size: 1.6rem;
102+
height: 50px;
103+
padding: 1px 5px 1px 15px;
104+
outline: 0;
105+
width: 100%;
106+
}
107+
108+
/*For IE*/
109+
::-ms-clear {
110+
display: none;
111+
}
112+
113+
select:focus,
114+
input:focus,
115+
select:hover,
116+
input:hover {
117+
box-shadow: inset 0 0 3px 0 #b7b7b7;
118+
}
119+
120+
select {
121+
-moz-appearance: none; /* Firefox */
122+
-webkit-appearance: none; /* Safari and Chrome */
123+
appearance: none;
124+
background: transparent url("./images/icons/arrow.svg") no-repeat
125+
calc(100% - 10px) center;
126+
background-size: 15px;
127+
padding-right: 35px;
128+
}
129+
130+
/*For IE*/
131+
select::-ms-expand {
132+
display: none;
133+
}
134+
135+
/** IE requires arrow add as parent class of select box to get output **/
136+
.custom-dropdowm-arrow {
137+
background: #fff url("./images/icons/arrow.svg") calc(100% - 10px) 17px;
138+
background-repeat: no-repeat;
139+
background-size: 15px;
140+
}
141+
142+
.custom-dropdowm-arrow select {
143+
background: none;
144+
}
145+
146+
.page-wrapper {
147+
margin: 0 auto;
148+
max-width: 1240px;
149+
padding: 0 15px;
150+
width: 100%;
151+
}
152+
153+
.clip-me {
154+
border: 0;
155+
clip: rect(0, 0, 0, 0);
156+
height: 1px;
157+
margin: -1px;
158+
overflow: hidden;
159+
padding: 0;
160+
position: absolute;
161+
width: 1px;
162+
}
163+
/** Start - Skip to content **/
164+
.action.skip {
165+
box-sizing: border-box;
166+
position: absolute;
167+
}
168+
.action.skip:not(:focus) {
169+
border: 0;
170+
clip: rect(0, 0, 0, 0);
171+
height: 1px;
172+
margin: -1px;
173+
overflow: hidden;
174+
padding: 0;
175+
}
176+
177+
.action.skip:focus {
178+
background: #f0f0f0;
179+
left: 0;
180+
padding: 10px;
181+
text-align: center;
182+
top: 0;
183+
z-index: 15;
184+
}
185+
/** End - Skip to content **/
186+
187+
.header {
188+
border-radius: 10px 10px 0 0;
189+
background-color: #3d3d3d;
190+
padding: 20px 10px;
191+
text-align: center;
192+
}
193+
194+
.header .logo-link {
195+
display: inline-block;
196+
}
197+
198+
.header .logo-link img {
199+
height: 30px;
200+
}
201+
202+
.footer {
203+
color: #2a2a2a;
204+
display: flex;
205+
flex-flow: row wrap;
206+
justify-content: space-between;
207+
margin: 0 auto 20px;
208+
padding: 20px 0;
209+
}
210+
.footer .privacy-policy {
211+
text-decoration: underline;
212+
}
213+
214+
.footer .privacy-policy:hover {
215+
text-decoration: none;
216+
}
217+
218+
.center-align-card .page-wrapper {
219+
max-width: 90%;
220+
padding: 0;
221+
}
222+
.center-align-card .page-content {
223+
background-color: #fff;
224+
border-radius: 10px;
225+
box-shadow: 0 2px 6px 1px #e9e9e9;
226+
margin: 10% auto 20px;
227+
position: relative;
228+
}
229+
230+
.center-align-card .page-content .page-main {
231+
padding: 50px 40px 80px;
232+
position: relative;
233+
text-align: center;
234+
}
235+
236+
.center-align-card .page-content .page-main .page-title-heading {
237+
margin-top: 0;
238+
}
239+
240+
.center-align-card .page-content .page-main .page-description {
241+
color: #3d3d3d;
242+
font-size: 2rem;
243+
font-weight: 300;
244+
line-height: 1.5;
245+
margin-bottom: 0;
246+
}
247+
248+
/** Start : Input/select box - field area style **/
249+
.input-field {
250+
position: relative;
251+
margin-bottom: 20px;
252+
}
253+
254+
.input-field label {
255+
-webkit-font-smoothing: antialiased;
256+
bottom: 100%;
257+
background-color: #fff;
258+
color: #3e3e3e;
259+
font-size: 1.6rem;
260+
height: auto;
261+
left: 0;
262+
line-height: 1.4;
263+
margin: 5px 0 5px 12px;
264+
max-width: 100%;
265+
overflow: hidden;
266+
padding: 0 0 0 3px;
267+
position: absolute;
268+
right: auto;
269+
transform-origin: left top;
270+
transform: translate3d(0, 42px, 0) scale(1);
271+
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
272+
text-align: left;
273+
text-overflow: ellipsis;
274+
white-space: nowrap;
275+
width: unset;
276+
z-index: 1;
277+
}
278+
279+
.input-field.active label {
280+
transform: translate3d(0, 18px, 0) scale(0.95);
281+
transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1),
282+
width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
283+
}
284+
285+
.input-field.focussed label {
286+
color: #006ad7;
287+
}
288+
289+
/** End : Input/select box - field area style **/
290+
291+
/**
292+
* Message - Error Message style
293+
**/
294+
295+
.messages .message {
296+
border-radius: 5px;
297+
display: none;
298+
font-size: 1.6rem;
299+
margin-bottom: 20px;
300+
padding: 15px 40px 15px 10px;
301+
position: relative;
302+
text-align: left;
303+
}
304+
305+
.messages .close-error {
306+
cursor: pointer;
307+
height: 20px;
308+
position: absolute;
309+
right: 10px;
310+
text-align: center;
311+
top: 15px;
312+
width: 20px;
313+
}
314+
.messages .message:before {
315+
-moz-osx-font-smoothing: grayscale;
316+
-webkit-font-smoothing: antialiased;
317+
content: "";
318+
display: inline-block;
319+
height: 20px;
320+
line-height: 1.25;
321+
overflow: hidden;
322+
text-align: center;
323+
width: 20px;
324+
vertical-align: top;
325+
}
326+
327+
.messages .message .message-content {
328+
display: inline-block;
329+
margin-left: 10px;
330+
width: calc(100% - 35px);
331+
vertical-align: top;
332+
}
333+
334+
.messages .message.error {
335+
background-color: #ea1900;
336+
color: #ffffff;
337+
}
338+
.messages .message.error:before {
339+
content: "\26A0";
340+
}
341+
342+
.messages .close-error:before {
343+
-moz-osx-font-smoothing: grayscale;
344+
-webkit-font-smoothing: antialiased;
345+
content: "\2716";
346+
display: inline-block;
347+
height: 20px;
348+
line-height: 1.25;
349+
overflow: hidden;
350+
text-align: center;
351+
vertical-align: middle;
352+
width: 20px;
353+
}
354+
355+
/** Mobile - specific CSS **/
356+
@media (max-width: 767px) {
357+
.footer {
358+
padding-bottom: 10px;
359+
}
360+
.footer .copyright-text,
361+
.footer .privacy-polic {
362+
margin-bottom: 10px;
363+
}
364+
}
365+
366+
/** Desktop + tab - specific CSS **/
367+
@media (min-width: 768px) {
368+
.center-align-card .page-content {
369+
margin-top: 12%;
370+
}
371+
.center-align-card .page-wrapper {
372+
max-width: 520px;
373+
}
374+
}

‎web-assets/images/favicon.ico

634 Bytes
Binary file not shown.

‎web-assets/images/logo.png

16.1 KB
Loading

0 commit comments

Comments
 (0)