koha-tmpl/opac-tmpl/prog/en/css/opac.css

   1 @import url("/intranet-tmpl/prog/en/lib/yui/reset-fonts-grids.css");
   2
   3 /* color scheme :
   4 - #6699CC smooth blue for buttons background
   5 - #FFFFCC smooth yellow for button text
   6 - grey (
   7
   8 - #990033 (red) for hovered links
   9 - #384b73 : light blue, for menus, text enhancement, footer & header
  10
  11 - #eeeeee : light grey, for background color
  12 - #CCCCCC : for table backgrounds
  13 - #6BA037 : green for action buttons
  14 */
  15
  16 /* attribute for standard html tags */
  17
  18 body {
  19     font-family : Verdana, Geneva, Arial, sans-serif;
  20     font-size : 1em;
  21     background-color : white;
  22     text-align: left;
  23     margin-bottom:0px;
  24 }
  25
  26 h1 {
  27     padding-top:25px;
  28     color: #384b73;
  29     font-size:1.5em;
  30     text-align:left;
  31 }
  32
  33 h2 {
  34     color:#384b73;
  35 }
  36
  37 h3 {
  38     color:#384b73;
  39 }
  40
  41 p {
  42     margin:0px;
  43     padding:0px;
  44     clear:left;
  45 }
  46
  47 label {
  48     vertical-align:top;
  49     display:block;
  50     float:left;
  51     margin-right:0.2em;
  52     width:10em;
  53     font-size:0.8em;
  54 }
  55
  56 a:link, a:visited, a:active {
  57     text-decoration : none;
  58     color :#384b73;
  59 }
  60
  61 a:hover {
  62     text-decoration : none;
  63     color: #990033;
  64
  65 }
  66
  67 fieldset {
  68     display:inline;
  69     border: 1px solid #384b73;
  70     background-color:#F9F9FF;
  71 }
  72
  73 table {
  74     border-collapse : collapse;
  75     border : 1px solid #CCCCCC;
  76     margin : 1em 0;
  77 }
  78
  79 caption {
  80     font-size : 140%;
  81     text-align : left;
  82     font-weight : bold;
  83 }
  84
  85 td,th {
  86     border : 1px solid #CCCCCC;
  87     border-bottom : 1px solid #CCCCCC;
  88     padding : 5px;
  89 }
  90
  91 th {
  92     background:url( /opac-tmpl/prog/images/member-menu-background.gif);
  93     background-repeat:repeat-x;
  94     background-color:#ADC4E2;
  95     color:#096C9D;
  96     font-size:0.8em;
  97     border : 1px solid #CCCCCC;
  98     border-right: 1px solid #CCCCCC;
  99 }
 100
 101 th[scope=row] {
 102     text-align : right;
 103 }
 104
 105 input[type=submit], input[type=button], input[type=reset] {
 106     background-color : #6BA037;
 107     color : #FFFFFF;
 108     font-size : 0.8em;
 109     font-weight : bold;
 110     border: 1px outset #666666;
 111 }
 112
 113 li {
 114     list-style-type:square;
 115 }
 116
 117 ul {
 118     margin:0px;
 119 }
 120
 121 /* attributes for search result list */
 122 .searchresults td, .searchresults th, .searchresults table {
 123     border: 0;
 124 }
 125 .searchresults tr {
 126     border-bottom : 1px solid #CCCCCC;
 127 }
 128 .searchresults table {
 129     border-top : 0px solid #CCCCCC;
 130     border: 1px solid #CCCCCC;
 131 }
 132 p.searchresults {
 133     background-color : #EFF1DC;
 134 }
 135 .searchresults a.reserve {
 136     background-color : transparent;
 137     color : #006699;
 138 }
 139 .searchresults table tr:hover {
 140     background-color: #FFFFCC;
 141 }
 142 tr.highlight td, tr.highlight th {
 143     background-color : #EEEEEE;
 144     border: 1px solid #DDDDDD;
 145     border-right: 1px solid #DDDDDD;
 146 }
 147
 148 /* the top part of the opac : (the LibraryName) */
 149 #masthead {
 150     color: #000066;
 151     margin-left:15%;
 152     text-align:left;
 153     font-size:150%;
 154     font-weight:bold;
 155     margin-bottom:5px;
 156 }
 157
 158 /* The image on the top-left (the logo) */
 159 #masthead-image {
 160     position:absolute;
 161     left:10px;
 162     top:10px;
 163     background-color:white;
 164 }
 165
 166 #masthead-image img {
 167     background-color:white;
 168 }
 169
 170 /* the itemtype list in advanced search */
 171 #advsearch-itemtype table {
 172     border-collapse: separate;
 173     border-spacing: 3px;
 174     border : 0px;
 175     margin : 0px;
 176     background-color: white;
 177     border: 0px solid #D8DEB8;
 178 }
 179 }
 180 #advsearch-itemtype table tr td {
 181     background-color: #F8F8EB;
 182     border : 0px;
 183     margin : 0px;
 184     width:700px;
 185 }
 186 #advsearch-itemtype td {
 187     font-size:0.8em;
 188     background-color:#F8F8EB;
 189 }
 190
 191 /* the content part of every page */
 192 #main {
 193     margin-left:15%;
 194     margin-bottom:0px;
 195 }
 196
 197 /* the main menu (home, adv search) */
 198
 199 #menu {
 200     position:absolute;
 201     padding:10px;
 202     left:0px;
 203     top:100px;
 204     width:12%;
 205     font-size:0.8em;
 206     font-weight:bold;
 207     color:#384b73;
 208     background-color:#dddddd;
 209 }
 210 #menu ul a {
 211     display:block;
 212     margin:5px 5px 0px 5px;
 213     padding :5px 5px 0px 5px;
 214     text-decoration:none;
 215     color:#384b73;
 216     white-space: nowrap;
 217     margin:0px;
 218     padding:0px;
 219 }
 220 #menu ul a:hover {
 221     display:block;
 222     margin:0;
 223     padding :0;
 224     text-decoration:none;
 225     color:#990033;
 226     white-space: nowrap;
 227 }
 228 #menu ul {
 229     padding:0 0 0 10px;
 230     margin-left:5px;
 231 }
 232 #menu li {
 233     list-style-type:none;
 234     margin:0px;
 235     padding:0 0 10px 0;
 236 }
 237 #menu ul li {
 238     list-style-type:circle;
 239     margin:0px;
 240     padding:0 0 10px 0;
 241 }
 242
 243
 244
 245 /***************/
 246 /* login block */
 247 /***************/
 248 #login {
 249     position:absolute;
 250     left:0px;
 251     bottom:10px;
 252     font-size:0.8em;
 253     background-color : #dddddd;
 254     padding:10px;
 255     margin-right:84%;
 256     width:12%;
 257 }
 258 #login input {
 259     font-size:0.8em;
 260 }
 261 #login label {
 262     width:5em;
 263 }
 264 #login p {
 265     margin:0px;
 266 }
 267
 268 /***********************************************************/
 269 /* the user menu, for user option (and biblio detail view) */
 270 /***********************************************************/
 271 #usermenu {
 272     float:right;
 273 }
 274 #usermenu a {
 275     background-color : #6BA037;
 276     color : #FFFFFF;
 277     font-size : 0.8em;
 278     font-weight : bold;
 279     border: 1px outset #666666;
 280     display:block;
 281     margin-bottom:3px;
 282 }
 283 #usermenu a:hover {
 284     border: 1px inset #666666;
 285 }
 286
 287 /* the opac-news */
 288 #news {
 289     width:20%;
 290     float:right;
 291     font-size:11px;
 292 }
 293 #news th {
 294 background-color:white;
 295 color:#384b73;
 296 }
 297
 298 /* "problem" enhancement */
 299 .problem {
 300 color: white;
 301 background-color:red;
 302 }
 303
 304 /* action buttons */
 305 #action {
 306     margin-top:15px;
 307 }
 308 #action a {
 309     background-color : #6699cc;
 310     color : #eeeeee;
 311     font-size : 0.8em;
 312     font-weight : bold;
 313     border: 1px outset #666666;
 314     margin-right:5px;
 315     padding:0 5px 0 5px;
 316 }
 317 #action a:hover {
 318     color : white;
 319     border: 1px inset;
 320 }
 321
 322 #auth {
 323     float:left;
 324 }
 325
 326 /* facets bloc */
 327 #facets {
 328     position:absolute;
 329     right:1em;
 330     font-size:0.8em;
 331     margin:0px;
 332     background-color:#eeeeee;
 333     border:0px;
 334 }
 335
 336 #facets dl {
 337     margin:0px;
 338     border:1px solid #CCCCCC;
 339 }
 340 #facets dd {
 341     margin:0px;
 342 }
 343 #facets dt {
 344     font-weight:bold;
 345     background-color:#6BA037;
 346     border: 1px outset #666666;
 347     color:white;
 348 }
 349
 350 #facets li {
 351     list-style-type: none;
 352     margin-left:0px;
 353 }
 354
 355 #facets ul {
 356     list-style-type: none;
 357     padding-left:10px;
 358     margin-bottom:0px;
 359     margin-top:0px;
 360 }
 361
 362 /* the USER information block */
 363 #librarian_information {
 364 float:right;
 365 font-size:10pt;
 366 }
 367
 368 /* the footer */
 369 #footer {
 370     margin-top:30px;
 371     margin-left:30%;
 372     margin-right:20%;
 373     border-top:1px solid #384b73;
 374     color: #384b73;
 375     font-size:1em;
 376     text-align:center;
 377 }
 378
 379
 380 legend {
 381 font-weight:bold;
 382 color:#384b73;
 383 }
 384
 385
 386 /* css styles for reserves color alerts */
 387 .onloan {
 388     background-color: #FFED3D;
 389 }
 390
 391 .reserved {
 392     background-color: #8EBAFF;
 393 }
 394
 395 .transfered {
 396     background-color: #F9FF9A;
 397 }
 398
 399 .inwait {
 400     background-color: #33CC99;
 401 }
 402
 403 .other {
 404     background-color: #FF0000;
 405 }
 406
 407 .available {
 408     font-size:0.75em;
 409 }
 410
 411 .unavailable {
 412     background-color: #FFED3D;
 413     font-size:0.75em;
 414 }
 415
 416 /* style for search terms in catalogsearch */
 417 .term {
 418 background-color:lightyellow;
 419 color: #990033;
 420 }
 421
 422 #opac-main-search {
 423     background-image:url( /opac-tmpl/prog/images/menu-background.gif);
 424     background-repeat:repeat-x;
 425     background-color: #6699CC;
 426     border-top: 1px solid #335599;
 427     border-bottom: 1px solid #335599;
 428     margin: 0 0 0 15%;
 429     padding: 15px 0 15px 10px;
 430     color:#FFFFCC;
 431     font-weight:bold;
 432 }
 433 #opac-main-search a {
 434     color:#FFFFCC;
 435 }
 436 #opac-main-search a:visited {
 437     color:#FFFFCC;
 438 }
 439 #opac-main-search a:hover {
 440     color:#FFFFFF;
 441 }
 442
 443 #opac-main-search form {
 444     display:inline;
 445 }