tynanpurdy.com
[READ-ONLY] Mirror of https://github.com/tynanpurdy/bootstrap. Learning project for custom web and eventual portfolio page
1body {
2 padding: 0;
3 margin: 0;
4 background: #fff;
5}
6
7.header {
8 content: "";
9 background-attachment: fixed;
10 background-repeat: no-repeat;
11 background-size: cover;
12 background-position: center;
13 position: relative;
14 height: 100%;
15}
16
17.overlay {
18 position: absolute;
19 min-height: 100%;
20 min-width: 100%;
21 left: 0;
22 top: 0;
23 background: rgba(0, 0, 0, 0.6);
24}
25
26/* description */
27.description {
28 left: 50%;
29 position: absolute;
30 top: 45%;
31 transform: translate(-50%, -55%);
32 text-align: center;
33}
34.description h1 {
35 color: var(--light);
36}
37.description p {
38 color: #fff;
39 font-size: 1.3rem;
40 line-height: 1.5;
41}
42.description button {
43 border: 1px var(--secondary);
44 background:var(--primary);
45 border-radius: 0.5em;
46 color:#fff;
47}
48.description button:hover {
49 border: 1px var(--secondary);
50 background: var(--secondary);
51 color:#fff;
52}
53
54/* features */
55.features {
56 margin: 4em auto;
57 padding: 1em;
58 position: relative;
59}
60.feature-title {
61 font-size: 1.7rem;
62 font-weight: 700;
63 margin-bottom: 20px;
64 text-transform: uppercase;
65}
66.features img {
67 -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
68 -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
69 box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4);
70 margin-bottom: 16px;
71}
72.features .form-control,
73.features input {
74 border-radius: 0;
75}
76.features .btn {
77 background-color: var(--primary);
78 border: 1px solid var(--primary);
79 color: #fff;
80 margin-top: 20px;
81}
82.features .btn:hover {
83 background-color: #333;
84 border: 1px solid #333;
85}