Commit | Line | Data |
---|---|---|
1e7a45c4 VSB |
1 | /** |
2 | * If using a CSS pre-processor, tell it to overwrite this file. If not, place | |
3 | * your custom CSS modifications here. | |
4 | */ | |
5 | ||
658e30ec | 6 | body { margin: 0; min-width: 320px; } |
1e7a45c4 | 7 | |
b4ed810a VSB |
8 | a { transition: 0.3s; } |
9 | ||
1e7a45c4 VSB |
10 | .navbar-default { |
11 | background: #000; | |
12 | color: #FFF; | |
13 | border: none; | |
14 | border-radius: 0px; | |
15 | box-sizing: content-box; | |
1e7a45c4 VSB |
16 | align-items: center; |
17 | margin-bottom: 100px; | |
18 | min-height: 100px; | |
19 | } | |
20 | ||
b766958e AE |
21 | .navbar-header, |
22 | #navbar-collapse { | |
1e7a45c4 VSB |
23 | max-width: 1150px; |
24 | padding: 0; | |
25 | margin: 0 auto; | |
bfc9c2d3 VSB |
26 | border: none; |
27 | overflow: hidden; | |
1e7a45c4 VSB |
28 | } |
29 | ||
67263bd5 | 30 | .navbar-default .navbar-toggle { display: none; } |
bfc9c2d3 | 31 | |
1e7a45c4 VSB |
32 | .navbar-header { |
33 | position: absolute; | |
34 | top: 5px; | |
35 | } | |
36 | ||
67263bd5 | 37 | .navbar-brand { display: none; } |
ccc0e97e VSB |
38 | |
39 | #block-ryf-main-menu .navbar-nav { margin-left: 180px; } | |
40 | ||
0af85f8e | 41 | .navbar-default .navbar-nav > .active > a, |
b4ed810a | 42 | .navbar-default .navbar-nav > .active > a:hover, |
0af85f8e | 43 | .navbar-default .navbar-nav > li > a { |
b4ed810a | 44 | color: #FFF; |
0af85f8e | 45 | background: #000; |
b4ed810a | 46 | border-bottom: 2px solid transparent; |
0af85f8e AE |
47 | padding-bottom: 10px; |
48 | margin-bottom: 5px; | |
b4ed810a VSB |
49 | } |
50 | ||
b4ed810a | 51 | .navbar-default .navbar-nav > .active > a, |
0af85f8e AE |
52 | .navbar-default .navbar-nav > .active > a:hover, |
53 | .navbar-default .navbar-nav > li > a:hover { | |
b4ed810a VSB |
54 | color: #edd400; |
55 | border-bottom: 2px solid #edd400; | |
56 | padding-bottom: 5px; | |
0af85f8e | 57 | margin-bottom: 10px; |
b4ed810a VSB |
58 | } |
59 | ||
cafdcde8 | 60 | .page-header { |
357e6db1 | 61 | border-bottom: 2px solid #000; |
cafdcde8 VSB |
62 | font-size: 2em; |
63 | } | |
64 | ||
2cbded31 VSB |
65 | .region-header .search-block-form { |
66 | width: 300px; | |
67 | float: right; | |
68 | } | |
69 | ||
7ddc2c7c AE |
70 | .block-views { |
71 | margin-top: 20px; | |
72 | } | |
73 | ||
2f113c95 AE |
74 | @media screen and (min-width: 520px) and (max-width: 599px) { |
75 | .logo img { margin-left: 50px; } | |
76 | #block-ryf-main-menu .navbar-nav { margin-left: 230px; } | |
77 | } | |
aa4eefa7 | 78 | |
2f113c95 AE |
79 | @media screen and (min-width: 600px) and (max-width: 767px) { |
80 | .logo img { margin-left: 100px; } | |
81 | #block-ryf-main-menu .navbar-nav { margin-left: 280px; } | |
82 | } | |
83 | ||
84 | @media screen and (max-width: 767px) { | |
85 | .logo img { height: 150px; margin-top: 25px; } | |
86 | .navbar-default { min-height: 230px; margin-bottom: 30px; } | |
87 | #block-ryf-main-menu .navbar-nav { max-width: 130px; } | |
88 | } | |
89 | ||
81342c63 AE |
90 | @media screen and (min-width: 768px) { |
91 | .navbar-nav { margin-top: 40px; } | |
92 | } | |
93 | ||
5235611e | 94 | |
cd0efca0 AE |
95 | /* Selectors */ |
96 | ||
5235611e | 97 | |
cd0efca0 AE |
98 | @media screen and (min-width: 768px) { |
99 | .form-inline .form-item .select-wrapper { | |
100 | display: block; | |
101 | } | |
102 | .form-inline .form-actions { | |
103 | margin-top: 21px; | |
104 | } | |
105 | } | |
106 | ||
5235611e | 107 | |
16670121 | 108 | /* RYF List */ |
b4ed810a | 109 | |
5235611e | 110 | |
bd3568e1 | 111 | .ryf-list-row { |
aa68642c AE |
112 | padding: 0; |
113 | margin: 0 auto; | |
114 | overflow: auto; | |
115 | } | |
116 | ||
16670121 VSB |
117 | .ryf-list { |
118 | float: left; | |
119 | margin: 0; | |
120 | padding: 0.5em; | |
121 | position:relative; | |
122 | list-style: none; | |
123 | } | |
b4ed810a | 124 | |
16670121 VSB |
125 | .ryf-list article { |
126 | border: 1px solid #ececec; | |
127 | border-radius: 5px; | |
128 | padding: 1em; | |
129 | box-shadow: 2px 2px 5px #ddd; | |
130 | transition: 0.3s; | |
131 | } | |
1e7a45c4 | 132 | |
16670121 VSB |
133 | .ryf-list article:hover { |
134 | box-shadow: 0px 0px 5px #aaa; | |
b4ed810a | 135 | } |
1e7a45c4 | 136 | |
16670121 | 137 | .ryf-list .field--type-image { |
c51f46de | 138 | width: 150px; |
de63e943 | 139 | height: 150px; |
16670121 VSB |
140 | background: #fff; |
141 | border-radius: 10px; | |
142 | display: flex; | |
c51f46de AE |
143 | align-items: center; |
144 | } | |
145 | ||
146 | .ryf-list .field--name-field-image { | |
147 | margin: 0 auto; | |
1e7a45c4 | 148 | } |
b4ed810a | 149 | |
16670121 VSB |
150 | .ryf-list img { |
151 | max-width: 150px; | |
16670121 VSB |
152 | overflow: hidden; |
153 | } | |
154 | ||
155 | .ryf-list img:hover { | |
156 | border-radius: 0; | |
ccc0e97e | 157 | } |
b4ed810a | 158 | |
ccc0e97e | 159 | .ryf-list h2 { |
b4ed810a VSB |
160 | text-align: left; |
161 | font-size: 1.5em; | |
162 | font-weight: 500; | |
163 | line-height: 1.2em; | |
16670121 VSB |
164 | margin: 0; |
165 | padding: 0; | |
166 | padding-bottom: 1em; | |
b4ed810a VSB |
167 | } |
168 | ||
169 | .ryf-list a { | |
170 | color: #118991; | |
171 | text-decoration: none; | |
172 | } | |
173 | ||
174 | .ryf-list a:hover { | |
175 | color: #000; | |
176 | } | |
1e7a45c4 | 177 | |
ccc0e97e VSB |
178 | .ryf-list .node-readmore, |
179 | .ryf-list .tags, | |
180 | .ryf-list .supplier { | |
b4ed810a VSB |
181 | width: 100%; |
182 | float: left; | |
183 | font-size: 0.9em; | |
184 | border-top: 1px solid #ccc4c4; | |
185 | margin-top: 5px; | |
186 | padding-top: 5px; | |
187 | color: #afadad; | |
188 | } | |
16670121 VSB |
189 | |
190 | .ryf-list .node-readmore { | |
191 | text-align: right; | |
192 | } | |
193 | ||
1b8274f8 AE |
194 | .feed-icons, |
195 | .more-link { | |
45431b7c | 196 | margin-top: 15px; |
835801ab AE |
197 | clear: both; |
198 | } | |
1b8274f8 AE |
199 | .more-link { |
200 | font-weight: bold; | |
201 | } | |
835801ab | 202 | |
e3fe14a1 | 203 | @media screen and (min-width: 450px) and (max-width: 659px) { |
bd3568e1 | 204 | .ryf-list-row { |
aa68642c AE |
205 | max-width: 600px; |
206 | } | |
e3fe14a1 AE |
207 | .ryf-list { |
208 | max-width: 300px; | |
209 | float: none; | |
210 | margin: 0 auto; | |
211 | } | |
212 | } | |
213 | @media screen and (min-width: 660px) and (max-width: 767px) { | |
bd3568e1 | 214 | .ryf-list-row { |
aa68642c AE |
215 | max-width: 600px; |
216 | } | |
e3fe14a1 AE |
217 | .ryf-list-row { |
218 | margin: 0 auto; | |
219 | max-width: 660px; | |
220 | } | |
221 | .ryf-list { | |
222 | max-width: 300px; | |
223 | float: left; | |
224 | } | |
225 | } | |
226 | ||
16670121 | 227 | |
dbd9476a AE |
228 | /* Vendors list */ |
229 | ||
5235611e | 230 | |
bd3568e1 | 231 | .vendors-list-row { |
df611aac | 232 | padding: 10px; |
00227dc4 AE |
233 | margin: 0 auto; |
234 | overflow: auto; | |
235 | } | |
236 | ||
dbd9476a AE |
237 | @media screen and (max-width: 767px) { |
238 | .vendors-list-row { | |
239 | margin: 0px auto; | |
240 | } | |
241 | ||
242 | .vendors-list { | |
243 | margin-bottom: 40px; | |
244 | list-style: none; | |
9203a4fd AE |
245 | |
246 | overflow: auto; | |
dbd9476a AE |
247 | } |
248 | ||
249 | .vendors-list .views-field-field-icon { | |
250 | width: 220px; | |
251 | ||
252 | margin: 0px auto 20px auto; | |
253 | } | |
254 | ||
255 | .vendors-list .views-field-field-icon img { | |
256 | margin: 0 auto; | |
257 | } | |
258 | ||
b766958e AE |
259 | .vendors-list .views-field-name, |
260 | .vendors-list .views-field-description__value { | |
dbd9476a AE |
261 | max-width: 300px; |
262 | margin: 0 auto 10px auto; | |
263 | } | |
264 | ||
265 | .vendors-list .views-field-name { | |
266 | font-weight: bold; | |
267 | font-size: 18px; | |
268 | text-align: center; | |
269 | } | |
270 | ||
271 | } | |
272 | ||
273 | @media screen and (min-width: 768px) { | |
274 | .vendors-list-row { | |
275 | width: 600px; | |
276 | margin: 0px auto; | |
277 | } | |
278 | ||
279 | .vendors-list { | |
280 | list-style: none; | |
281 | clear: left; | |
9203a4fd AE |
282 | |
283 | overflow: auto; | |
dbd9476a AE |
284 | } |
285 | ||
286 | .vendors-list .views-field-field-icon { | |
287 | width: 220px; | |
288 | height: 220px; | |
289 | ||
290 | margin-bottom: 40px; | |
291 | ||
292 | float: left; | |
293 | } | |
294 | ||
295 | .vendors-list .views-field-field-icon img { | |
296 | margin: 0 auto; | |
297 | } | |
298 | ||
b766958e AE |
299 | .vendors-list .views-field-name, |
300 | .vendors-list .views-field-description__value { | |
dbd9476a AE |
301 | margin-left: 300px; |
302 | } | |
303 | ||
304 | .vendors-list .views-field-name { | |
305 | margin-bottom: 10px; | |
306 | font-weight: bold; | |
307 | font-size: 18px; | |
308 | } | |
309 | } | |
310 | ||
311 | ||
f39cdbbc AE |
312 | /* Sidebars */ |
313 | ||
314 | ||
315 | @media screen and (max-width: 767px) { | |
316 | .path-products #block-views-block-categories-categories-block { display: none; } | |
317 | } | |
318 | ||
319 | ||
222cefba AE |
320 | /* Vendor and Category taxonomy term pages */ |
321 | ||
322 | ||
5df3859d AE |
323 | .view-taxonomy-term .view-header .field--name-field-icon img { |
324 | margin: 0 auto; | |
325 | } | |
326 | ||
327 | .view-filters { | |
328 | clear: left; | |
329 | } | |
330 | ||
222cefba AE |
331 | @media screen and (max-width: 559px) { |
332 | .view-taxonomy-term .view-header { | |
333 | margin: 0 auto 40px auto; | |
334 | ||
335 | overflow: auto; | |
336 | } | |
337 | ||
338 | .view-taxonomy-term .view-header .field--name-field-icon { | |
339 | margin: 0 auto 20px auto; | |
340 | width: 220px; | |
341 | } | |
342 | ||
222cefba AE |
343 | .view-taxonomy-term .view-header .field--name-description { |
344 | max-width: 360px; | |
345 | margin: 0 auto; | |
346 | padding: 0 10px; | |
347 | } | |
348 | ||
222cefba AE |
349 | } |
350 | ||
5df3859d | 351 | @media screen and (min-width: 560px) { |
222cefba AE |
352 | .view-taxonomy-term .view-header { |
353 | margin: 0 0 40px 0; | |
354 | ||
355 | overflow: auto; | |
356 | } | |
357 | ||
358 | .view-taxonomy-term .view-header .field--name-field-icon { | |
359 | width: 220px; | |
360 | ||
361 | float: left; | |
362 | } | |
363 | ||
222cefba AE |
364 | .view-taxonomy-term .view-header .field--name-description { |
365 | margin-left: 260px; | |
366 | } | |
367 | ||
222cefba AE |
368 | } |
369 | ||
370 | @media screen and (min-width: 768px) { | |
371 | .view-taxonomy-term .view-header { | |
300bf8f5 | 372 | max-width: 700px; |
222cefba AE |
373 | } |
374 | } | |
375 | ||
376 | ||
4d7da022 AE |
377 | /* Product */ |
378 | ||
5235611e | 379 | |
d679ca4e AE |
380 | @media screen and (max-width: 767px) { |
381 | .page-node-type-product .product { | |
382 | max-width: 382px; | |
383 | margin: 0 auto; | |
384 | } | |
385 | } | |
386 | ||
21d9e444 AE |
387 | @media screen and (min-width: 768px) and (max-width: 991px) { |
388 | .page-node-type-product .product { | |
389 | width: 700px; | |
390 | margin: 0 auto; | |
391 | } | |
4d7da022 AE |
392 | } |
393 | ||
21d9e444 AE |
394 | @media screen and (min-width: 992px) { |
395 | .page-node-type-product .product { | |
396 | width: 800px; | |
397 | margin: 0 auto; | |
398 | } | |
399 | } | |
4d7da022 | 400 | |
d679ca4e AE |
401 | .page-node-type-product .product .field--name-field-image { |
402 | padding: 10px; | |
4d7da022 | 403 | |
d679ca4e AE |
404 | display: flex; |
405 | align-items: center; | |
4d7da022 | 406 | |
d679ca4e AE |
407 | border: 1px solid #888; |
408 | border-radius: 10px; | |
409 | } | |
4d7da022 | 410 | |
d679ca4e AE |
411 | .page-node-type-product .product .field--name-field-extra-images { |
412 | padding: 5px; | |
4d7da022 | 413 | |
d679ca4e AE |
414 | display: flex; |
415 | align-items: center; | |
4d7da022 | 416 | |
d679ca4e AE |
417 | border: 1px solid #888; |
418 | border-radius: 10px; | |
419 | } | |
4d7da022 | 420 | |
d679ca4e AE |
421 | .page-node-type-product .product .field--name-field-extra-images .field--item { |
422 | display: inline-block; | |
423 | margin: auto; | |
424 | padding: 5px; | |
425 | } | |
4d7da022 | 426 | |
b766958e AE |
427 | .page-node-type-product .product .field--name-field-categories, |
428 | .page-node-type-product .product .field--name-field-vendor { | |
d679ca4e AE |
429 | margin: 10px 10px 20px 0px; |
430 | padding: 10px; | |
431 | border: 1px solid #888; | |
432 | border-radius: 10px; | |
433 | } | |
434 | ||
433e107d AE |
435 | .page-node-type-product .product .field--name-field-categories .field--item { |
436 | display: list-item; | |
437 | list-style: circle; | |
438 | margin-left: 15px; | |
439 | } | |
440 | ||
28ff698e AE |
441 | /* product page colors */ |
442 | .page-node-type-product .product .field--name-field-image { | |
eee49201 | 443 | background-color: #fff; |
28ff698e AE |
444 | border-color: #aaa; |
445 | } | |
446 | .page-node-type-product .product .field--name-field-extra-images { | |
ebebd91d | 447 | background-color: #f3f3f3; |
28ff698e AE |
448 | border-color: #aaa; |
449 | } | |
450 | .page-node-type-product .product .field--name-field-categories { | |
8be2a870 AE |
451 | background-color: #def; |
452 | border-color: #8ad; | |
28ff698e AE |
453 | } |
454 | .page-node-type-product .product .field--name-field-vendor { | |
8be2a870 AE |
455 | background-color: #dfe; |
456 | border-color: #8da; | |
28ff698e AE |
457 | } |
458 | ||
d679ca4e AE |
459 | @media screen and (max-width: 767px) { |
460 | .page-node-type-product .product .field--name-field-extra-images { | |
461 | margin: 10px auto 0px auto; | |
21d9e444 | 462 | } |
4d7da022 | 463 | |
b766958e AE |
464 | .page-node-type-product .product .field--name-body, |
465 | .page-node-type-product .product .field--name-field-vendor-product-link, | |
466 | .page-node-type-product .product .field--name-field-certification-details, | |
467 | .page-node-type-product .product .field--name-field-certification-date, | |
468 | .page-node-type-product .product .field--name-field-source-code-links { | |
21d9e444 AE |
469 | margin-bottom: 20px; |
470 | } | |
4d7da022 | 471 | |
b766958e AE |
472 | .page-node-type-product .product .field--name-field-categories, |
473 | .page-node-type-product .product .field--name-field-vendor { | |
21d9e444 | 474 | float: left; |
21d9e444 | 475 | } |
4d7da022 | 476 | |
21d9e444 AE |
477 | .page-node-type-product .product .field--name-body { |
478 | clear: both; | |
479 | } | |
4d7da022 AE |
480 | } |
481 | ||
21d9e444 AE |
482 | |
483 | @media screen and (min-width: 768px) { | |
484 | .page-node-type-product .product .field--name-field-image { | |
485 | width: 382px; | |
21d9e444 | 486 | float: left; |
21d9e444 AE |
487 | } |
488 | ||
489 | .page-node-type-product .product .field--name-field-extra-images { | |
490 | float: left; | |
491 | clear: left; | |
492 | ||
493 | width: 382px; | |
21d9e444 | 494 | margin-top: 10px; |
21d9e444 AE |
495 | } |
496 | ||
b766958e AE |
497 | .page-node-type-product .product .field--name-body, |
498 | .page-node-type-product .product .field--name-field-vendor-product-link, | |
499 | .page-node-type-product .product .field--name-field-certification-details, | |
500 | .page-node-type-product .product .field--name-field-certification-date, | |
501 | .page-node-type-product .product .field--name-field-source-code-links { | |
21d9e444 AE |
502 | margin-left: 400px; |
503 | margin-bottom: 20px; | |
504 | } | |
505 | ||
506 | .page-node-type-product .product .field--name-field-categories { | |
507 | float: left; | |
508 | clear: left; | |
509 | } | |
510 | ||
511 | .page-node-type-product .product .field--name-field-vendor { | |
512 | float: left; | |
513 | } | |
514 | ||
4d7da022 AE |
515 | } |
516 | ||
517 | ||
9f8b2429 AE |
518 | /* News and Product Announcements */ |
519 | ||
520 | ||
521 | .page-node-type-product-announcement .page-header, | |
fa74cee2 | 522 | .page-node-type-product-announcement .tabs--primary, |
9f8b2429 AE |
523 | .page-node-type-product-announcement .region-content, |
524 | .page-node-type-general-news-item .page-header, | |
fa74cee2 | 525 | .page-node-type-general-news-item .tabs--primary, |
dca6d2ea AE |
526 | .page-node-type-general-news-item .region-content, |
527 | .page-node-type-page .page-header, | |
fa74cee2 | 528 | .page-node-type-page .tabs--primary, |
dca6d2ea | 529 | .page-node-type-page .region-content, |
9f8b2429 | 530 | .path-news .page-header, |
fa74cee2 | 531 | .path-news .tabs--primary, |
9f8b2429 AE |
532 | .path-news .region-content { |
533 | max-width: 800px; | |
534 | margin: 0 auto; | |
535 | } | |
536 | ||
8499d9cd AE |
537 | /* don't apply above max-width rule to main page */ |
538 | .path-frontpage .page-header, | |
fa74cee2 | 539 | .path-frontpage .tabs--primary, |
8499d9cd AE |
540 | .path-frontpage .region-content { |
541 | max-width: 2000px; /* high number beyond the max */ | |
542 | } | |
543 | ||
dca6d2ea AE |
544 | .page-node-type-page .page-header { |
545 | margin-bottom: 20px; | |
546 | } | |
547 | ||
e9d294a4 AE |
548 | .path-news h2, |
549 | .block-views-blocknews-news-block article h2 { | |
9f8b2429 AE |
550 | font-size: 25px; |
551 | } | |
552 | ||
553 | .page-node-type-product-announcement .author, | |
554 | .page-node-type-general-news-item .author { | |
555 | margin: 10px 0 20px 0; | |
556 | font-style: oblique; | |
557 | } | |
558 | ||
559 | .page-node-type-product-announcement .field--name-body, | |
560 | .page-node-type-general-news-item .field--name-body { | |
561 | margin-bottom: 20px; | |
562 | } | |
563 | ||
564 | .page-node-type-product-announcement .field--name-field-external-news-link, | |
565 | .page-node-type-general-news-item .field--name-field-external-news-link { | |
566 | margin-bottom: 20px; | |
567 | } | |
568 | ||
569 | .page-node-type-product-announcement .field--name-field-vendor-page, | |
570 | .page-node-type-product-announcement .field--name-field-announced-products { | |
571 | margin-bottom: 20px; | |
572 | } | |
573 | ||
574 | ||
41399eb4 AE |
575 | /* Search Results */ |
576 | ||
577 | ||
578 | @media screen and (max-width: 600px) { | |
579 | .path-search .region-content ol { | |
580 | width: 300px; | |
581 | } | |
582 | } | |
583 | @media screen and (min-width: 601px) and (max-width 1000px) { | |
584 | .path-search .region-content ol { | |
585 | width: 560px; | |
586 | } | |
587 | } | |
588 | @media screen and (min-width: 1001px) { | |
589 | .path-search .region-content ol { | |
590 | width: 900px; | |
591 | } | |
592 | } | |
593 | ||
594 | .path-search .region-content ol { | |
595 | margin: 0 auto; | |
596 | padding-left: 0; | |
597 | overflow: auto; | |
598 | } | |
599 | ||
600 | .path-search .region-content li { | |
601 | width: 280px; | |
602 | height: 280px; | |
603 | margin: 0px auto; | |
604 | padding: 10px; | |
605 | ||
606 | float: left; | |
607 | ||
608 | list-style: none; | |
609 | overflow: hidden; | |
610 | } | |
611 | ||
612 | .path-search .region-content li h3 { | |
613 | text-align: center; | |
614 | } | |
615 | ||
616 | .path-search .region-content li .search-image { | |
617 | width: 100px; | |
618 | height: 100px; | |
619 | ||
620 | margin: 0 auto; | |
621 | ||
622 | display: flex; | |
623 | align-items: center; | |
624 | } | |
625 | ||
626 | .path-search .region-content li img { | |
627 | } | |
628 | ||
629 | ||
16670121 VSB |
630 | /* Footer */ |
631 | ||
5235611e | 632 | |
16670121 VSB |
633 | .footer { |
634 | background: #333; | |
635 | color: #FFF; | |
636 | } | |
637 | ||
06d8ab9f | 638 | /* full page width for footer */ |
c900f9d4 | 639 | .footer { |
c900f9d4 AE |
640 | width: 100%; |
641 | } | |
642 | ||
16670121 VSB |
643 | .footer a { color: #edd400; } |
644 | ||
645 | .footer a:hover { color: #FFF; } | |
646 | ||
647 | .footer h4 { font-weight: bold; } | |
648 | ||
649 | .footer .copyright { font-size: 0.9em; text-align: center; width: 80%; margin-top: 1em; border-top: 1px solid #111; padding: 1em; } | |
650 | ||
0bd91ac3 AE |
651 | #fsf-logo-footer { margin-bottom: 10px; } |
652 | ||
18f8d3b1 AE |
653 | @media print { #fsf-logo-footer { filter: invert(100%) } } |
654 |