fantastic-lamp/style.css at main · wilford-c/fantastic-lamp · GitHub

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
:root {
    --color-primary: #1e5afa;
    --color-primary-variant: rgba(0, 0, 240, 0.2);
    --color-white: #fff;
    --color-light: #f4f4f4;
    --color-black: #000f37;
    --color-dark: #575757;

    --bottom-section-padding: 12rem;
    --bottom-section-padding-mobile: 8rem;

    --transition: all 400ms ease;

    --container-width: 84%;
    --container-width-tablet: 90%;
    --container-width-mobile: 94%;

}

* {
    margin: 0;
    padding: 0;
    outline: 0;
    border: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;

}
body{
    font-family: 'Poppins', sans-serif;
    color: var(--color-dark);
    line-height: 1.7;
    background-color: var(--color-white);
}
.container{
    width: var(--container-width);
    margin: 0 auto;
}
h1{
    font-size: 5.6rem;
    line-height: 1;
    color: var(--color-black);
}
h2{
    font-size: 3rem;
    line-height: 1;
    font-weight: 500;
}
h3{
    font-size: 2rem;
    line-height: 1;
    font-weight: 600;
}
.lead{
    width: 63%;
    font-size: 1.1rem;
    font-weight: 400;
    margin: 1.5rem auto 3rem;

}
a{
    /* color: var(--color-white); */
    font-weight: 300;
}
img{
    width: 100%;
    display: block;
}
btn{
    display: inline-block;
    padding: 1rem 2.3rem;
    background-color: var(--color-white);
    color: var(--color-dark);
    font-weight: 300;
    border: 1px solid transparent

}