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