1 | @font-face { |
2 | font-family: 'PT Sans'; |
3 | src: url("https://fonts.googleapis.com/css?family=PT+Sans:700&subset=latin,latin-ext"); |
4 | } |
5 | |
6 | [hidden] { |
7 | display: none; |
8 | } |
9 | |
10 | .visually-hidden { |
11 | position: absolute; |
12 | clip: rect(0, 0, 0, 0); |
13 | } |
14 | |
15 | /*div.awesomplete { |
16 | display: inline-block; |
17 | position: relative; |
18 | }*/ |
19 | |
20 | /*div.awesomplete > input { |
21 | display: block; |
22 | }*/ |
23 | |
24 | div.awesomplete > ul { |
25 | position: absolute; |
26 | left: 0; |
27 | z-index: 1; |
28 | min-width: 100%; |
29 | box-sizing: border-box; |
30 | list-style: none; |
31 | padding: 0; |
32 | border-radius: .3em; |
33 | margin: .2em 0 0; |
34 | background: hsla(0, 0%, 100%, .9); |
35 | background: linear-gradient(to bottom right, white, hsla(0, 0%, 100%, .8)); |
36 | border: 1px solid rgba(0, 0, 0, .3); |
37 | box-shadow: .05em .2em .6em rgba(0, 0, 0, .2); |
38 | text-shadow: none; |
39 | margin-left: 2%; |
40 | margin-top: 7%; |
41 | } |
42 | |
43 | div.awesomplete > ul[hidden], |
44 | div.awesomplete > ul:empty { |
45 | display: none; |
46 | } |
47 | |
48 | @supports (transform: scale(0)) { |
49 | div.awesomplete > ul { |
50 | transition: .3s cubic-bezier(.4, .2, .5, 1.4); |
51 | transform-origin: 1.43em -.43em; |
52 | } |
53 | div.awesomplete > ul[hidden], |
54 | div.awesomplete > ul:empty { |
55 | opacity: 0; |
56 | transform: scale(0); |
57 | display: block; |
58 | transition-timing-function: ease; |
59 | } |
60 | } |
61 | |
62 | |
63 | /* Pointer */ |
64 | |
65 | div.awesomplete > ul:before { |
66 | content: ""; |
67 | position: absolute; |
68 | top: -.43em; |
69 | left: 1em; |
70 | width: 0; |
71 | height: 0; |
72 | padding: .4em; |
73 | background: white; |
74 | border: inherit; |
75 | border-right: 0; |
76 | border-bottom: 0; |
77 | -webkit-transform: rotate(45deg); |
78 | transform: rotate(45deg); |
79 | } |
80 | |
81 | div.awesomplete > ul > li { |
82 | position: relative; |
83 | padding: .2em .5em; |
84 | cursor: pointer; |
85 | } |
86 | |
87 | div.awesomplete > ul > li:hover { |
88 | background: hsl(200, 40%, 80%); |
89 | color: black; |
90 | } |
91 | |
92 | div.awesomplete > ul > li[aria-selected="true"] { |
93 | background: hsl(205, 40%, 40%); |
94 | color: white; |
95 | } |
96 | |
97 | div.awesomplete mark { |
98 | background: hsl(65, 100%, 50%); |
99 | } |
100 | |
101 | div.awesomplete li:hover mark { |
102 | background: hsl(68, 100%, 41%); |
103 | } |
104 | |
105 | div.awesomplete li[aria-selected="true"] mark { |
106 | background: hsl(86, 100%, 21%); |
107 | color: inherit; |
108 | } |
109 | |
110 | .talk-h1 { |
111 | font-family: PT Sans; |
112 | font-size: 100px; |
113 | text-align: center; |
114 | } |
115 | |
116 | .splash-h1 { |
117 | font-size: 2.5vw; |
118 | text-align: center; |
119 | color: black; |
120 | } |
121 | |
122 | .result { |
123 | font-family: PT Sans; |
124 | font-size: 35px; |
125 | text-align: center; |
126 | margin-left: 2%; |
127 | margin-top: 2%; |
128 | } |
129 | |
130 | .talk-input { |
131 | border-bottom-width: medium; |
132 | border-left: none; |
133 | border-right: none; |
134 | border-top: none; |
135 | margin-left: 2.5%; |
136 | margin-right: 2.5%; |
137 | font-size: 4vw; |
138 | padding: inherit; |
139 | background-color: #FFFFFF; |
140 | color: #636363; |
141 | float: left; |
142 | height: 5%; |
143 | } |
144 | |
145 | body { |
146 | background-color: #FFFFFF; |
147 | font-family: "PT Sans" |
148 | } |
149 | |
150 | .talk-h2 { |
151 | font-family: PT Sans; |
152 | font-size: 72px; |
153 | text-align: center; |
154 | } |
155 | |
156 | .talk-h3 { |
157 | font-family: PT Sans; |
158 | font-size: 40px; |
159 | text-align: center; |
160 | } |
161 | |
162 | p { |
163 | font-family: PT Sans; |
164 | font-size: 1.5vw; |
165 | color: #636363; |
166 | margin-left: 5%; |
167 | } |
168 | |
169 | .talk-li { |
170 | color: #FE6363; |
171 | font-size: 1.8vw; |
172 | list-style-type: none; |
173 | font-family: PT Sans; |
174 | } |
175 | |
176 | span { |
177 | color: #FE6363; |
178 | } |
179 | |
180 | .submit { |
181 | border: 0.5px solid #FE6363; |
182 | -webkit-box-shadow: #A7A8A8 1px 1px 1px; |
183 | -moz-box-shadow: #A7A8A8 1px 1px 1px; |
184 | box-shadow: #A7A8A8 1px 1px 1px; |
185 | -webkit-border-radius: 8px; |
186 | -moz-border-radius: 8px; |
187 | border-radius: 8px; |
188 | font-size: 3vw; |
189 | font-family: PT Sans; |
190 | padding: 4%; |
191 | text-decoration: none; |
192 | display: inline-block; |
193 | text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3); |
194 | font-weight: bold; |
195 | color: #FFFFFF; |
196 | background-color: #FE6363; |
197 | background-image: -webkit-gradient(linear, left top, left bottom, from(#FE6363), to(#D45353)); |
198 | background-image: -webkit-linear-gradient(top, #FE6363, #D45353); |
199 | background-image: -moz-linear-gradient(top, #FE6363, #D45353); |
200 | background-image: -ms-linear-gradient(top, #FE6363, #D45353); |
201 | background-image: -o-linear-gradient(top, #FE6363, #D45353); |
202 | background-image: linear-gradient(to bottom, #FE6363, #D45353); |
203 | filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#FE6363, endColorstr=#D45353); |
204 | float: right; |
205 | margin: 0 0 0 1em; |
206 | } |
207 | |
208 | .submit:hover { |
209 | border: 1px solid #FE6363; |
210 | background-color: #FE6363; |
211 | background-image: -webkit-gradient(linear, left top, left bottom, from(#FE6363), to(#FE6363)); |
212 | background-image: -webkit-linear-gradient(top, #FE6363, #FE6363); |
213 | background-image: -moz-linear-gradient(top, #FE6363, #FE6363); |
214 | background-image: -ms-linear-gradient(top, #FE6363, #FE6363); |
215 | background-image: -o-linear-gradient(top, #FE6363, #FE6363); |
216 | background-image: linear-gradient(to bottom, #FE6363, #FE6363); |
217 | filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#FE6363, endColorstr=#FE6363); |
218 | } |
219 | |
220 | img { |
221 | width: 60%; |
222 | height: auto; |
223 | display: block; |
224 | margin: 0 auto; |
225 | } |
226 | #wrapper { |
227 | display: table; |
228 | width: 100%; |
229 | } |
230 | #row { |
231 | display: table-row; |
232 | } |
233 | #col1, #col2 { |
234 | display: table-cell; |
235 | } |
236 | #col1{ |
237 | overflow:hidden; |
238 | width:95%; |
239 | } |
240 | #col1 input{ |
241 | width:95%; |
242 | } |
243 | #lastdialogs{ |
244 | margin 0 auto; |
245 | } |
Began life as a copy of #1002160
Travelled to 12 computer(s): aoiabmzegqzx, bhatertpkbcr, cbybwowwnfue, gwrvuhgaqvyk, ishqpsrjomds, lpdgvwnxivlt, mqqgnosmbjvj, pyentgdyhuwx, pzhvpgtvlbxg, tslmcundralx, tvejysmllsmz, vouqrxazstgt
No comments. add comment
Snippet ID: | #1002252 |
Snippet name: | homepage test stylesheet |
Eternal ID of this version: | #1002252/1 |
Text MD5: | 51a00cc06240ece1f9ce0fbad02a03c4 |
Author: | bgrgndz |
Category: | |
Type: | Document |
Public (visible to everyone): | Yes |
Archived (hidden from active list): | No |
Created/modified: | 2016-01-01 13:43:35 |
Source code size: | 5487 bytes / 245 lines |
Pitched / IR pitched: | No / Yes |
Views / Downloads: | 839 / 279 |
Referenced in: | [show references] |