├── styles.css └── index.html /styles.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | box-sizing: border-box; 5 | } 6 | 7 | .btn { 8 | position: absolute; 9 | top: 50%; 10 | left: 50%; 11 | transform: translate(-50%, -50%); 12 | z-index: 2; 13 | background: none; 14 | border: none; 15 | outline: none; 16 | font-family: Helvetica, sans-serif; 17 | font-weight: 300; 18 | text-decoration: underline; 19 | text-transform: uppercase; 20 | font-size: 2em; 21 | cursor: pointer; 22 | } 23 | 24 | .header { 25 | position: fixed; 26 | width: 100%; 27 | height: 100vh; 28 | background: #0f0f0f; 29 | color: #fff; 30 | display: flex; 31 | justify-content: center; 32 | align-items: center; 33 | z-index: -2; 34 | font-family: "Voyage"; 35 | font-size: 8em; 36 | } 37 | 38 | .text-container { 39 | position: fixed; 40 | width: 100%; 41 | height: 100vh; 42 | background: #de5e40; 43 | z-index: -1; 44 | } 45 | 46 | .text-wrapper { 47 | position: fixed; 48 | width: 100%; 49 | height: 100vh; 50 | left: -50%; 51 | display: flex; 52 | flex-direction: column; 53 | justify-content: space-between; 54 | cursor: default; 55 | } 56 | 57 | .text { 58 | width: 300%; 59 | font-family: "Voyage"; 60 | font-size: 5vw; 61 | text-transform: uppercase; 62 | opacity: 0.1; 63 | } 64 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | lp-reveal 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 |
16 |
17 |
18 | Zealously few furniture repulsive agreeable consisted. Zealously few 19 | furniture repulsive agreeable consisted. 20 |
21 |
22 | Collected breakfast estimable questions in to it. Collected breakfast 23 | estimable questions in to it. 24 |
25 |
26 | For him precaution any advantages dissimilar few. For him precaution 27 | any advantages dissimilar few. 28 |
29 |
30 | Shortly respect ask cousins brought add tedious nay. Shortly respect 31 | ask cousins brought add tedious nay. 32 |
33 |
34 | Object remark lively all did feebly excuse our wooded. Object remark 35 | lively all did feebly excuse our wooded. 36 |
37 |
38 | Sufficient unpleasing an insensible motionless if ye. Sufficient 39 | unpleasing an insensible motionless if ye. 40 |
41 |
42 | The for fully had she there leave merit enjoy forth. The for fully had 43 | she there leave merit enjoy forth. 44 |
45 |
46 | In in written on charmed justice is amiable farther. In in written on 47 | charmed justice is amiable farther. 48 |
49 |
50 | How daughters not promotion few knowledge contented. How daughters not 51 | promotion few knowledge contented. 52 |
53 |
54 | Zealously few furniture repulsive. Zealously few furniture repulsive. 55 |
56 |
57 | Collected breakfast estimable questions in to it. Collected breakfast 58 | estimable questions in to it. 59 |
60 |
61 | For him precaution any advantages dissimilar few. For him precaution 62 | any advantages dissimilar few. 63 |
64 |
65 | Shortly respect ask cousins brought add tedious nay. Shortly respect 66 | ask cousins brought add tedious nay. 67 |
68 |
69 | Object remark lively all did feebly excuse wooded. Object remark 70 | lively all did feebly excuse wooded. 71 |
72 |
73 | Sufficient unpleasing an insensible motionless ye. Sufficient 74 | unpleasing an insensible motionless ye. 75 |
76 |
77 |
Voyage
78 |
79 | 140 | 141 | 142 | --------------------------------------------------------------------------------