A few minor changes: Tweaking amazon image js to try to fix spotty behavior (not...
[koha.git] / koha-tmpl / opac-tmpl / prog / en / css / opac.css
1 @import url("/opac-tmpl/prog/en/lib/yui/reset-fonts-grids.css");
2
3 a {
4         font-weight : bold;
5 }
6
7 a, a:visited {
8         color : #006699;
9 }
10
11 a:hover {
12         color : #990033;
13 }
14
15 body {
16         background-color : white;
17         text-align : left;
18 }
19
20 caption {
21         font-size : 140%;
22         text-align : left;
23         font-weight : bold;
24 }
25
26 fieldset {
27         border : 2px solid #EEEEEE;
28         margin : 1em 1em 1em 0;
29         padding : 1em;
30 }
31
32 fieldset.rows {  
33 border-width : 1px;
34 border-bottom : 1px solid black;
35 float : left;
36 font-size : 90%;
37 clear : left;
38 margin: .9em 0 0 0;  
39 padding: 0;
40 width: 100%; 
41 }
42
43 fieldset.rows legend {  
44         margin-left: 1em;
45         font-weight: bold;
46         font-size : 110%;
47 }
48
49 fieldset.rows label, fieldset.rows span.label {  
50         float: left;  
51         font-weight : bold;
52         width: 9em;  
53         margin-right: 1em;  
54         text-align: right;
55 }
56
57 fieldset.rows fieldset {
58         border-width : 1px;
59         margin : 0;
60         padding : .3em;
61 }
62
63 fieldset.rows ol {  
64 padding: 1em 1em 0 1em;  
65 list-style-type: none;
66 }
67
68 fieldset.rows li {  
69 float : left;
70 clear : left;
71 padding-bottom: 1em;
72 list-style-type: none;
73 width: 100%; 
74 }
75
76 fieldset.rows.left li {
77         padding-bottom : .4em;
78 }
79
80 fieldset.rows li.radio {
81         padding-left: 9em;
82         width : auto;
83 }
84
85 fieldset.rows li.radio label {
86         float : none;
87         width : auto;
88         margin : 0 0 0 1em;
89 }
90
91 fieldset.rows ol.radio label {
92         width : auto;
93         float : none;
94         margin-right : 0;
95 }
96
97 fieldset.rows ol.radio label.radio {
98         float : left;
99         width : 12em;
100         margin-right : 1em;
101 }
102
103 fieldset.rows table {
104         clear : both;
105         margin-left : 1em;
106 }
107
108 fieldset.rows td label {
109         float : none;
110         font-weight : normal;
111         width : auto;
112 }
113
114 fieldset.action {
115         clear : both;
116         float : none;
117         border : none;
118         margin : 0;
119         padding : 1em 0 .3em 0;
120         width : auto;
121 }
122
123 form {
124         display : inline;
125         margin : 0;
126         padding : 0;
127 }
128
129 h1 {
130         font-size : 138.5%;
131 }
132
133 h1#libraryname {
134         font-weight : normal;
135         margin : .2em 0 .2em .5em;
136 }
137
138 h1#libraryname a {
139         text-decoration : none;
140 }
141
142 h1#libraryname a:hover {
143         color : #384B73;
144 }
145
146 h1,h2,h3,h4,h5,h6 {
147         font-weight : bold;
148         margin : .5em 0;
149 }
150
151 h2 {
152         font-size : 131%;
153 }
154
155 h2.author {
156         text-indent : .5em;
157 }
158
159 h3 {
160         font-size : 123.1%;
161 }
162
163 h4 {
164         font-size : 116%;
165 }
166
167 h5 {
168         font-size : 108%;
169 }
170
171 h6 {
172         font-size : 100%;
173 }
174
175 input[type=submit], input[type=button], input[type=reset] {
176         background-color : #6BA037;
177         border:1px outset #666666;
178         color : #FFFFFF;
179         font-size : 93%;
180         font-weight : bold;
181         padding : 2px;
182 }
183
184 input[type=submit]:active, input[type=button], input[type=reset] {
185         border: 1px inset #666666;
186 }
187
188 p.searchresults {
189         background-color : #EFF1DC;
190 }
191
192 table {
193         border-collapse : collapse;
194         margin : 1em 0;
195         border-right : 1px solid #dddddd;
196         border-top : 1px solid #dddddd;
197 }
198
199 td,th {
200         border-left : 1px solid #dddddd;
201         border-bottom : 1px solid #dddddd;
202         padding : 3px 5px;
203 }
204
205 th {
206         background-color:#EFF1DC;
207         font-weight : bold;
208         padding : 2px 4px;
209 }
210
211 th.sum {
212         text-align: right;
213 }
214
215 td.sum {
216         background-color: #FFC;
217         font-weight: bold;
218 }
219
220 th[scope=row] {
221         text-align : right;
222 }
223
224 tr.highlight td, tr.highlight th {
225         background-color : #F3F3F3;
226         border : 1px solid #DDDDDD;
227         border-right : 1px solid #DDDDDD;
228 }
229
230 ul {
231         list-style : disc;
232         padding-left : 1em;
233 }
234
235 li {
236         list-style : disc;
237 }
238
239 p.availability {
240         font-size : 87%;
241 }
242
243 .available {
244         color : #006600;
245 }
246
247 .inwait {
248         background-color : #33CC99;
249 }
250
251 /* css styles for reserves color alerts */
252 .onloan {
253         background-color : #FFED3D;
254 }
255
256 .other {
257         background-color : #FF0000;
258 }
259
260 /* "problem" enhancement */
261 .problem {
262         color : white;
263         background-color : red;
264 }
265
266 .reserved {
267         background-color : #8EBAFF;
268 }
269
270 /* style for search terms in catalogsearch */
271 .term {
272         background-color : #ffffe0;
273         color : #990033;
274 }
275
276 a .term {
277         text-decoration : underline;
278 }
279
280 .transfered {
281         background-color : #F9FF9A;
282 }
283
284 /* action buttons */
285 #action {
286         margin-top : .5em;
287 }
288
289 #action li {
290         list-style : none;
291 }
292
293 #action a {
294         background-color : #F3F3F3;
295         border : 1px solid #E8E8E8;
296         display : block;
297         margin : .2em;
298         padding : .5em;
299         text-decoration : none;
300 }
301
302 /* the itemtype list in advanced search */
303 #advsearch-itemtype table {
304         border-collapse : separate;
305         border-spacing : 3px;
306         border : 0px;
307         margin : 0px;
308         background-color : white;
309         border : 0px solid #D8DEB8;
310 }
311
312 #advsearch-itemtype table tr td {
313         background-color : #F8F8EB;
314         border : 0px;
315         margin : 0px;
316         width : 700px;
317 }
318
319 #advsearch-itemtype td {
320         font-size : 0.8em;
321         background-color : #F8F8EB;
322 }
323
324 #auth {
325         float : left;
326 }
327
328 #facets {
329         
330 }
331
332 /* the footer */
333 #footer {
334         margin-top : 30px;
335         margin-left : 30%;
336         margin-right : 20%;
337         border-top : 1px solid #384b73;
338         color : #384b73;
339         font-size : 1em;
340         text-align : center;
341 }
342
343 /* facets bloc */
344 /* the USER information block */
345 #librarian_information {
346         float : right;
347         font-size : 10pt;
348 }
349
350 #members {
351         font-size : .8em;
352         font-weight : bold;
353         padding : 4px 0 4px 0;
354         background-image : url(../../images/member-menu-background.gif);
355         background-repeat : repeat-x;
356         border-top : 1px solid #9999CC;
357         border-bottom : 1px solid #9999CC;
358         background-color : #AFBCCF;
359         color : #000066;
360 }
361
362 #members a {
363         text-decoration : none;
364 }
365
366 #members a.card {
367         background-image : url(../images/card.gif);
368         background-position : left;
369         background-repeat : no-repeat;
370         display : block;
371         padding-left : 39px;
372 }
373
374 #members a.logout {
375         font-weight : bold;
376         padding : 0 .3em 0 .3em;
377         text-decoration : none;
378 }
379
380 #members a.logout:link, #members a.logout:visited, #members a.logout:hover, #members a.logout:active {
381         background-image : url(../images/member-menu-background-logout.gif);
382         background-repeat : repeat-x;
383         color : #000000;
384 }
385
386 #members a:hover.logout {
387         background-image : url(../images/member-menu-background-logout-hover.gif);
388         background-repeat : repeat-x;
389         color : #000000;
390 }
391
392 #members li {
393         display : inline;
394         list-style : none;
395         margin : 0;
396 }
397
398 #members ul {
399         margin : 0;
400         padding : 0;
401         text-align : right;
402 }
403
404 #members ul li a:link, #members ul li a:visited, #members span.members {
405         background-image : url(../images/member-menu-background-link.gif);
406         background-repeat : repeat-x;
407         border-left : 1px solid #9999CC;
408         color : #006699;
409 }
410
411 #members ul li a:link, #members ul li a:visited, #members ul li a:hover, #members ul li a:active, #members span.members {
412         padding : 4px;
413 }
414
415 #members ul li a:hover {
416 }
417
418 #members ul li a:hover, #members ul li a:active {
419         background-image : url(../images/member-menu-background-hover.gif);
420         background-repeat : repeat-x;
421 }
422
423 #members ul li:last-child {
424 }
425
426 #members ul li:last-child a {
427         border-right : 1px solid #9999CC;
428 }
429
430 #opac-main-search {
431         background-image : url( /opac-tmpl/prog/images/menu-background.gif);
432         background-repeat : repeat-x;
433         background-color : #6699CC;
434         border-top : 1px solid #335599;
435         border-bottom : 1px solid #335599;
436         padding : 15px 0 15px 10px;
437         color : #FFFFCC;
438         font-size : 108%;
439         line-height : 116%;
440 }
441
442 #opac-main-search a, #opac-main-search a, #opac-main-search a:visited {
443         color : #FFFFCC;
444 }
445
446 #opac-main-search a:hover {
447         color : #FFFFFF;
448 }
449
450 #opac-main-search form {
451         display : inline;
452         padding-right : 1em;
453 }
454
455 #opac-main-search label {
456         font-weight : bold;
457 }
458
459 /***********************************************************/
460 /* the user menu, for user option (and biblio detail view) */
461 /***********************************************************/
462
463 .suggestion {
464         background-color : #EEEEEB;
465         border : 1px solid #DDDED3;
466         margin : 10px auto;
467         padding : 4px;
468         width : 35%;
469 }
470
471 #facets ul {
472         margin : 0;
473         padding : 0;
474 }
475
476 #facets ul li {
477         font-weight : bold;
478         text-align : left;
479         list-style : none;
480 }
481
482 #facets ul ul li {
483         border : 0;
484         font-size : 85%;
485         font-weight : normal;
486         padding : 2px;
487         text-align : left;
488 }
489
490 #facets ul ul li a {
491         font-weight : normal;
492         text-decoration : underline;
493 }
494
495 #facets h4 {
496         font-size : 93%;
497         padding:3px;
498         text-align:center;
499         background-color:#E7E7CA;
500         line-height:1.8em;
501         margin-left:-1px;
502         margin-right:-1px;
503         margin-top:-1px;
504 }
505
506 #breadcrumbs {
507         padding : .7em;
508 }
509
510 strong {
511         font-weight : bold;
512 }
513
514 em {
515         font-style : italic;
516 }
517
518 #catalogue_detail_biblio p span.label {  
519         font-weight : bold;
520 }
521
522 #catalogue_detail_biblio p {  
523         padding-bottom: .6em;
524 }
525
526 .toptabs {
527         margin-top : 1em;
528 }
529
530 .toptabs .tabs-nav a, .toptabs .tabs-nav span.a {
531     top: 0;
532  }
533
534 .toptabs .tabs-nav li {
535         margin-right : .5em;
536 }
537
538 .toptabs .tabs-nav li a, .toptabs .tabs-nav li span.a {
539         background-color : #F3F3F3;
540         border-top : 1px solid #E8E8E8;
541         border-left : 1px solid #E8E8E8;
542         border-right : 1px solid #E8E8E8;
543         border-bottom : 0;
544         text-align : center;
545         text-decoration : none;
546 }
547
548 .toptabs .tabs-nav li.tabs-selected  {
549         background-color : #FFF;
550 }
551
552 .toptabs .tabs-nav li.tabs-selected a, .toptabs .tabs-nav li.tabs-selected span.a {
553         background-color : #FFF;
554         border-top : 1px solid #E8E8E8;
555         border-left : 1px solid #E8E8E8;
556         border-right : 1px solid #E8E8E8;
557         border-bottom : 1px solid #FFF;
558         margin-bottom : -5px;
559         padding-bottom : 5px;
560         text-align : center;
561 }
562
563 .toptabs.numbered .tabs-nav li {
564         min-width : 3em;
565 }
566
567 .toptabs .tabs-container {
568         border : 1px solid #E8E8E8;
569         padding : 1em;
570 }
571
572 .tabs-container {
573     border-top: 0;
574     padding : inherit;
575     background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
576 }
577
578 #bookcover {
579         float : left;
580         margin : 0;
581         padding : 0;
582 }
583
584 #bookcover img {
585         margin : 0 1em 1em 0;   
586 }
587
588 fieldset.brief {
589         border : 1px solid #E8E8E8;
590 }
591
592 fieldset.brief legend {
593         font-weight : bold;
594         font-size : 100%;
595 }
596
597 fieldset.brief label {
598         display : block;
599         font-weight : bold;
600         padding : .3em 0;
601 }
602
603 fieldset.brief ol, fieldset.brief li {
604         list-style-type : none;
605 }
606
607 fieldset.brief div.hint, fieldset.rows div.hint {
608         color : #999999;
609         font-size : 95%;
610         margin-bottom : .4em;
611 }
612
613 #menu {
614         margin-top: 1em;
615 }
616
617 h2 span.hint {
618         font-size: 76%;
619         font-weight : normal;
620 }
621 .thumbnail {
622         border : 0;
623         float : left;
624         margin : 0pt 5px 5px 0pt;
625 }
626 a.cancel {
627         padding-left : 1em;
628 }
629
630 #usermenu {
631         margin-top : 1em;
632 }
633
634 #toolbar ul {
635         margin : 1em 0 0 0;
636         padding : 0;
637 }
638
639 #toolbar ul li {
640         display : inline;
641         list-style : none;
642 }
643
644 #toolbar ul li a {
645         border : 1px solid #afbccf;
646         padding : .3em;
647         text-decoration : none;
648         margin-right : .1em;
649 }
650
651 .searchresults input, .searchresults label, .searchresults select {
652         font-size: 90%;
653 }
654
655 .searchresults label {
656         float : right;
657         margin-top : 5px;
658 }
659
660 .searchresults p {
661         margin: 0;
662         padding: 0;
663         padding-top : .6em;
664 }
665
666 .searchresults p img {
667         vertical-align: middle;
668 }
669
670 .searchresults table td {
671         vertical-align: top;
672 }
673
674 p.searchresults {
675         background-color : #EFF1DC;
676         margin-top : -5px;
677         vertical-align : middle;
678         padding : 3px 3px 5px 5px;
679 }
680
681 .searchresults table {
682         margin : 0;
683 }
684
685 .searchresults td, .searchresults th, .searchresults table {
686         border: 0;
687 }
688
689 .searchresults tr {
690         border-bottom : 1px solid #CCCCCC;
691 }
692
693 .searchresults tr:first-child {
694         border : 0;
695 }
696
697 .searchresults table {
698         border-top : 0px solid #CCCCCC;
699 }
700
701 .searchresults a.reserve, .searchresults a.reserve:visited {
702         background-position:left top;
703         background-repeat:no-repeat;
704         float:right;
705         padding:2px 3px 2px 26px;
706 }
707
708 .searchresults a.reserve {
709         background-color:transparent;
710         color:#006699;
711 }
712
713 input.reserve, a.reserve {
714         background-image:url(/opac-tmpl/prog/images/placereserve.gif);
715 }
716
717 a.reserve {
718         background-color:#006699;
719         color:White;
720 }
721 .unavailable {
722         color: #990033;
723 }
724
725 #corner {
726         position: absolute;
727         top: .5em;
728         right: .2em;
729 }
730
731 #corner a.cart {
732         background-image : url(/opac-tmpl/prog/images/cart-small.gif);
733         background-position: left;
734         background-repeat : no-repeat;
735         padding: 0 15px;
736         text-decoration: none;
737 }
738
739 .pages {
740         line-height : 1.8em;
741         text-align: center;
742 }
743 a:link.current {
744         background-color: transparent;
745         color: #3366CC;
746         font-weight: bold;
747         padding: 1px 5px 1px 5px;
748         text-decoration: none;
749 }
750 a:visited.current {
751         background-color: transparent;
752         color: #3366CC;
753         font-weight: bold;
754         padding: 1px 5px 1px 5px;
755         text-decoration: none;
756 }
757
758 a:hover.current {
759         background-color: #CCFF00;
760         color: #CC3333;
761         font-weight: bold;
762         padding: 1px 5px 1px 5px;
763         text-decoration: none;
764 }
765
766 a:active.current {
767         background-color: #99CC00;
768         color: #FFFF99;
769         font-weight: bold;
770         padding: 1px 5px 1px 5px;
771         text-decoration: none;
772 }
773
774 .current {
775         background-color: #FFFFFF;
776         color: #3366CC;
777         font-weight: bold;
778         padding: 1px 5px 1px 5px;
779         text-decoration: none;
780 }
781
782 a:link.nav {
783         background-color: #EFF1DC;
784         border: 1px solid #CCCC99;
785         color: #3366CC;
786         font-weight: bold;
787         padding: 1px 5px 1px 5px;
788         text-decoration: none;
789 }
790
791 a:visited.nav {
792         background-color: #EFF1DC;
793         border: 1px solid #CCCC99;
794         color: #3366CC;
795         font-weight: bold;
796         padding: 1px 5px 1px 5px;
797         text-decoration: none;
798 }
799
800 a:hover.nav {
801         background-color: #FFFFCC;
802         border: 1px solid #CCCC99;
803         color: #CC3333;
804         font-weight: bold;
805         padding: 1px 5px 1px 5px;
806         text-decoration: none;
807 }
808
809 a:active.nav {
810         background-color: #FFFFCC;
811         border: 1px solid #CCCC99;
812         color: #D25500;
813         font-weight: bold;
814         padding: 1px 5px 1px 5px;
815         text-decoration: none;
816 }
817
818 input.icon {
819         background-position: left;
820         background-repeat: no-repeat;
821         font-size : 96%;
822         font-weight: bold;
823         padding: 2px 2px 2px 22px;
824         background-color: #6699CC;
825         border: 1px outset #666666;
826         color: #FFFFCC;
827 }
828
829 input.shelf, a.shelf {
830         background-image: url(/opac-tmpl/prog/images/addtobasket.gif);
831 }
832
833 input.clearall, a.clearall {
834         background-image: url(/opac-tmpl/prog/images/clearbasket.gif);
835 }
836
837 /* Tabs */
838 ul.link-tabs {
839         list-style-type: none;
840         margin: 9px 0 -2px 5px;
841         padding: 0;
842 }
843
844 ul.link-tabs li {
845         display: inline;
846         padding: 0px;
847 }
848
849 ul.link-tabs li a {
850         font-weight: bold;
851         padding: 2px 4px 2px 4px;
852         text-decoration: none;
853         border-top: 1px solid #DDDDDD;
854         border-left : 1px solid #DDDDDD;
855         border-right : 1px solid #666666;
856 }
857
858 ul.link-tabs li#power_formButton a, ul.link-tabs li#proximity_formButton a {
859         padding: 2px 4px 3px 4px;
860 }
861
862 ul.link-tabs li.off a {
863         background-color: #EEEEEB;
864         border-bottom: 1px solid #DDDDDD;
865 }
866
867 ul.link-tabs li.off a:hover {
868         padding: 2px 3px 2px 4px;
869         background-color: #FFFFEC;
870         border-top: 1px solid #BEBF84;
871         border-left : 1px solid #BEBF84;
872         border-right : 2px solid #333333;
873 }
874
875 ul.link-tabs li.on a {
876         background-color: #FFFFFF;
877         border-bottom: 1px solid #FFFFFF;
878 }
879
880 ul.link-tabs li a.debit {
881         background-color : #FFFF99;
882         color : #990033;
883 }
884
885 div.tab-container {
886         border : 1px solid #DDDDDD;     
887         margin-top : 4px;
888         padding : .7em;
889         width : 90%;
890 }
891
892 div.message {
893         border : 1px solid #8ebaff;
894         padding : .3em;
895         margin : .3em;
896         width : 50%;
897 }
898
899 #catalogue_detail_biblio table, #catalogue_detail_biblio td, #catalogue_detail_biblio th {
900         background-color : transparent;
901         border : 0;
902 }