Tue, 27 Sep 2022 14:25:41 -0600
- Add HLA news
- Add font linking in HTML
14
e61659f0b0be
- New font linking style
Glitchvid <Glitchvid@glitchvid.com>
parents:
13
diff
changeset
|
1 | @import url('https://fonts.googleapis.com/css?family=Lato:400,400i,700,700i|Nunito:400,700|Arimo&display=swap'); |
e61659f0b0be
- New font linking style
Glitchvid <Glitchvid@glitchvid.com>
parents:
13
diff
changeset
|
2 | |
17 | 3 | |
15
4f366832940e
- Add scrollbar on all pages to fix bumping
Glitchvid <Glitchvid@glitchvid.com>
parents:
14
diff
changeset
|
4 | html { |
4f366832940e
- Add scrollbar on all pages to fix bumping
Glitchvid <Glitchvid@glitchvid.com>
parents:
14
diff
changeset
|
5 | overflow-y: scroll; |
4f366832940e
- Add scrollbar on all pages to fix bumping
Glitchvid <Glitchvid@glitchvid.com>
parents:
14
diff
changeset
|
6 | } |
0 | 7 | body { |
8 | background-color:#202020; | |
9 | } | |
10 | ||
15
4f366832940e
- Add scrollbar on all pages to fix bumping
Glitchvid <Glitchvid@glitchvid.com>
parents:
14
diff
changeset
|
11 | |
4f366832940e
- Add scrollbar on all pages to fix bumping
Glitchvid <Glitchvid@glitchvid.com>
parents:
14
diff
changeset
|
12 | |
0 | 13 | div.main { |
14 | width:1280px; | |
15 | margin-right: auto; | |
16 | margin-left: auto; | |
17 | max-width: 100%; | |
18 | } | |
19 | ||
20 | /* Header Styles */ | |
21 | img.headerlogo { | |
22 | width: 293px; | |
23 | height: 96px; | |
24 | display:block; | |
25 | margin:auto; | |
26 | } | |
27 | ul.buttons { | |
28 | color:#fafafa; | |
29 | padding: 0px; | |
30 | margin: 0px; | |
31 | border-bottom-color: #373737; | |
32 | border-bottom-width: 1px; | |
33 | border-bottom-style: solid; | |
34 | } | |
35 | ul.buttons li { | |
36 | font-family: 'Arimo', sans-serif; | |
37 | font-size: 18px; | |
38 | font-weight: 400; | |
39 | list-style-type: none; | |
40 | text-transform: uppercase; | |
41 | display: inline-block; | |
42 | padding: .25em; | |
43 | padding-left: .25em; | |
44 | padding-right: .25em; | |
45 | } | |
46 | ul.buttons li:hover { | |
47 | background-color: #484848; | |
48 | } | |
49 | li.active{ | |
50 | border-bottom-color: #f79a10; | |
51 | border-bottom-width: 1px; | |
52 | border-bottom-style: solid; | |
53 | background-color: #484848; | |
54 | } | |
55 | ul.buttons a { | |
56 | color:#FAFAFA; | |
57 | text-decoration: none; | |
58 | } | |
59 | ||
60 | ||
2
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
61 | /* Features Nav */ |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
62 | ul.featuresNav{ |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
63 | list-style-type: none; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
64 | padding: inherit; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
65 | font-size: inherit; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
66 | } |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
67 | ul.featuresNav a{ |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
68 | color:#FAFAFA; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
69 | text-decoration: none; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
70 | } |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
71 | ul.featuresNav h1{ |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
72 | font-size:2em; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
73 | margin-top: .1em; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
74 | } |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
75 | div.featureShowcaseContainer { |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
76 | |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
77 | } |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
78 | img.featureShowcase{ |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
79 | |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
80 | } |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
81 | |
0 | 82 | /* Text Styles */ |
83 | div.content { | |
84 | font-family: 'Lato', sans-serif; | |
85 | color:#fafafa; | |
86 | margin: 1em; | |
87 | margin-right: 4em; | |
88 | word-wrap: break-word; | |
89 | overflow-wrap: break-word; | |
90 | } | |
91 | div.content h1 { | |
92 | margin-bottom: .25em; | |
11 | 93 | font-family: 'Nunito', sans-serif; |
94 | letter-spacing: -0.0125em; | |
0 | 95 | } |
96 | div.content h3 { | |
97 | margin-top: .25em; | |
98 | margin-bottom: .25em; | |
11 | 99 | font-family: 'Nunito', sans-serif; |
100 | letter-spacing: -0.0125em; | |
0 | 101 | } |
102 | div.content h4 { | |
103 | margin-top: .25em; | |
104 | margin-bottom: .25em; | |
11 | 105 | font-family: 'Nunito', sans-serif; |
0 | 106 | } |
107 | div.content p { | |
108 | margin: 1em; | |
109 | margin-top: .25em; | |
110 | margin-bottom: .25em; | |
111 | font-size: 0.875em; | |
112 | } | |
1 | 113 | #textNotice { |
114 | width: max-content; | |
115 | background-image: url("missing_5p.png"); | |
116 | padding: 0.3em; | |
117 | border-radius: 4px; | |
118 | border-color: #f800f8d4; | |
119 | border-style: dashed; | |
120 | border-width: 1px; | |
121 | margin-left: 2em; | |
122 | margin-right: 2em; | |
123 | padding-right: 10%; | |
4
f43055fb4a5c
- Fixed overflow of textnotice
Glitchvid <Glitchvid@glitchvid.com>
parents:
2
diff
changeset
|
124 | max-width: 70%; |
1 | 125 | } |
126 | ||
0 | 127 | |
128 | /* Footer Styles */ | |
129 | div.footer { | |
130 | color:#fafafa; | |
131 | border-top-color: #373737; | |
132 | border-top-width: 1px; | |
133 | border-top-style: solid; | |
134 | } | |
135 | div.footer p{ | |
136 | font-family: "Arial", sans-serif; | |
137 | text-align: right; | |
138 | font-size: 12px; | |
139 | margin-top: 16px; | |
140 | margin-right: 2em; | |
141 | } | |
142 | ||
143 | ||
144 | /* Main Body Content Styles */ | |
145 | hr { | |
146 | display: block; | |
147 | margin-top: 0.5em; | |
148 | margin-bottom: 0.5em; | |
149 | margin-left: auto; | |
150 | margin-right: auto; | |
151 | border-style: none; | |
152 | border-width: 0px; | |
153 | border-bottom-color: #373737; | |
154 | border-bottom-style: solid; | |
155 | border-bottom-width: 1px; | |
2
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
156 | } |
0 | 157 | div.contentSection { |
158 | border-color: #282828; | |
159 | border-style: solid; | |
160 | border-width: 1px; | |
161 | border-radius: 3px; | |
162 | padding: 0.25em; | |
163 | /* width: max-content; */ | |
164 | background-color: #1e1e1e; | |
165 | margin-bottom: 0.5em; | |
166 | } | |
167 | div.contentSection a { | |
168 | color:#fafafa; | |
169 | text-decoration: none; | |
170 | } | |
2
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
171 | img.toolIconSM { |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
172 | float: right; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
173 | margin-right: .25em; |
5322f0778cb1
- Add Features index properly
Glitchvid <Glitchvid@glitchvid.com>
parents:
1
diff
changeset
|
174 | } |
0 | 175 | |
176 | /* Media Styles */ | |
177 | div.mediaContainer { | |
10
a18ce529899b
- Make .mediaContainer a flexbox
Glitchvid <Glitchvid@glitchvid.com>
parents:
4
diff
changeset
|
178 | display: flex; |
a18ce529899b
- Make .mediaContainer a flexbox
Glitchvid <Glitchvid@glitchvid.com>
parents:
4
diff
changeset
|
179 | flex-direction: row; |
a18ce529899b
- Make .mediaContainer a flexbox
Glitchvid <Glitchvid@glitchvid.com>
parents:
4
diff
changeset
|
180 | flex-wrap: wrap; |
a18ce529899b
- Make .mediaContainer a flexbox
Glitchvid <Glitchvid@glitchvid.com>
parents:
4
diff
changeset
|
181 | justify-content: center; |
0 | 182 | margin-left: auto; |
183 | margin-right: auto; | |
184 | width: max-content; | |
185 | max-width: 100%; | |
186 | } | |
1 | 187 | div.mediaContainer video { |
188 | max-width: 100%; | |
189 | } | |
190 | img.mediaImage { | |
0 | 191 | max-width: 100%; |
192 | } |