koha-tmpl/opac-tmpl/bootstrap/less/opac.less

   1 @import "mixins.less";
   2 body {
   3     background-color: #EAEAE6;
   4 }
   5
   6  /* Sticky footer styles */
   7 html,
   8 body {
   9     height: 100%;
  10     /* The html and body elements cannot have any padding or margin. */
  11 }
  12
  13 .no-js {
  14     .dateformat {
  15         display: inline;
  16         white-space: nowrap;
  17     }
  18     .modal-body {
  19         padding: 0;
  20     }
  21     .selections-toolbar {
  22         display: none;
  23     }
  24 }
  25
  26 .js {
  27     .dateformat {
  28         display: none;
  29     }
  30 }
  31
  32 /* Wrapper for page content to push down footer */
  33 #wrap {
  34     min-height: 100%;
  35     height: auto !important;
  36     height: 100%;
  37     /* Negative indent footer by it's height */
  38     // margin: 0 auto -60px;
  39 }
  40
  41 /* Set the fixed height of the footer here */
  42 #changelanguage {
  43     // height: 60px;
  44 }
  45
  46 .popup {
  47     padding-left : 0;
  48     padding-right: 0;
  49 }
  50
  51 a {
  52     color: @links;
  53     &.cancel {
  54         padding-left : 1em;
  55     }
  56     &:visited {
  57         color: @links;
  58     }
  59     &.title {
  60         font-weight: bold;
  61         font-size : 108%;
  62     }
  63     &.btn {
  64         &:visited {
  65             color : #333;
  66         }
  67     }
  68     &.btn-primary {
  69         &:visited {
  70             color : #FFF;
  71         }
  72     }
  73     &.login-link {
  74         color: #A6D8ED;
  75         font-weight: bold;
  76     }
  77 }
  78
  79 .ui-widget-content a,
  80 .ui-widget-content a:visited {
  81     color: @links;
  82 }
  83
  84 h1 {
  85     font-size : 140%;
  86     line-height: 150%;
  87     &#libraryname {
  88         background: transparent url(../images/logo-koha.png) no-repeat scroll 0%;
  89         border: 0;
  90         float: left !important;
  91         margin: 0;
  92         padding: 0;
  93         width: 120px;
  94         a {
  95             border: 0;
  96             cursor: pointer;
  97             display: block;
  98             height: 0px !important;
  99             margin: 0;
 100             overflow: hidden;
 101             padding: 40px 0 0;
 102             text-decoration: none;
 103             width: 120px;
 104         }
 105     }
 106 }
 107
 108 h2 {
 109
 110     font-size : 130%;
 111     line-height: 150%;
 112 }
 113 h3 {
 114
 115     font-size : 120%;
 116     line-height: 150%;
 117 }
 118 h4 {
 119
 120     font-size : 110%;
 121 }
 122 h5 {
 123
 124     font-size : 100%;
 125 }
 126
 127 caption {
 128     font-size: 120%;
 129     font-weight: bold;
 130     margin : 0;
 131     text-align: left;
 132 }
 133
 134 input,
 135 textarea {
 136     width: auto;
 137 }
 138
 139 .input-fluid {
 140     width : 50%;
 141 }
 142
 143 legend {
 144     font-size: 110%;
 145     font-weight: bold;
 146 }
 147
 148 table, td {
 149     background-color: #FFF;
 150 }
 151
 152 td {
 153     .btn {
 154         white-space: nowrap;
 155     }
 156     .btn-link {
 157         padding: 0;
 158     }
 159 }
 160
 161 #advsearches,
 162 #booleansearch {
 163     label {
 164         display: inline;
 165     }
 166 }
 167
 168 #basketcount {
 169     display : inline;
 170     margin : 0;
 171     padding : 0;
 172     span {
 173         background-color : #FFC;
 174         color : #000;
 175         display : inline;
 176         font-size : 80%;
 177         font-weight : normal;
 178         margin : 0 0 0 .9em;
 179         padding : 0 .3em 0 .3em;
 180         .border-radius-all(3px);
 181     }
 182 }
 183
 184
 185 #members {
 186     display: block;
 187     p {
 188         color : #EEE;
 189     }
 190     a {
 191         &.logout {
 192             color : #E8583C;
 193             font-weight: bold;
 194             padding : 0 .3em 0 .3em;
 195         }
 196     }
 197 }
 198
 199 #koha_url p {
 200         color: #666666;
 201         float : right;
 202         margin: 0;
 203 }
 204
 205 #moresearches {
 206     margin: .5em 0;
 207     padding: 0 .8em;
 208     li {
 209         display: inline;
 210         white-space: nowrap;
 211         &:after {
 212             content : " | ";
 213         }
 214
 215     }
 216     ul {
 217         margin : 0;
 218     }
 219 }
 220
 221 #moresearches li:last-child:after {
 222     content : "";
 223 }
 224
 225 #news {
 226     margin : .5em 0;
 227 }
 228
 229 .newscontainer {
 230     border: 1px solid #ddd;
 231     border-bottom-width: 0;
 232     border-top-left-radius: 5px;
 233     border-top-right-radius: 5px;
 234 }
 235
 236 .newsheader {
 237     background-color: #ecede6;
 238     border-bottom: 1px solid #ddd;
 239     margin: 0;
 240     padding: 8px;
 241 }
 242
 243 .newsbody {
 244     padding: 8px;
 245 }
 246
 247 .newsfooter {
 248     border-bottom: 1px solid #ddd;
 249     font-style: italic;
 250     padding: 4px 8px;
 251 }
 252
 253 #opacheader {
 254     background-color: #DDD;
 255 }
 256
 257 #selections,
 258 .selections {
 259     font-weight : bold;
 260 }
 261
 262 .actions {
 263     a {
 264         white-space: nowrap;
 265         &.hold {
 266             background-image : url("../images/sprite.png"); /* Place hold small */
 267             background-position : -5px -542px;
 268             background-repeat: no-repeat;
 269             margin-right : 1em;
 270             padding-left : 21px;
 271             text-decoration : none;
 272         }
 273         &.article_request {
 274             background-image : url("../images/sprite.png"); /* Place hold small */
 275             background-position : -2px -26px;
 276             background-repeat: no-repeat;
 277             margin-right : 1em;
 278             padding-left : 21px;
 279             text-decoration : none;
 280         }
 281         &.addtocart {
 282             background-image : url("../images/sprite.png"); /* Cart small */
 283             background-position : -5px -572px;
 284             background-repeat: no-repeat;
 285             margin-right : 1em;
 286             padding-left : 20px;
 287             text-decoration : none;
 288         }
 289         &.addtoshelf {
 290             background-image : url("../images/sprite.png"); /* MARC view */
 291             background-position: -5px -27px;
 292             background-repeat: no-repeat;
 293             margin-right : 1em;
 294             padding-left : 20px;
 295             text-decoration : none;
 296         }
 297         &.addtolist {
 298             background-position: -5px -27px;
 299             margin-right : 1em;
 300             padding-left : 20px;
 301             text-decoration : none;
 302         }
 303         &.tag_add {
 304             background-position: -5px -1110px;
 305             margin-right : 1em;
 306             padding-left : 20px;
 307             text-decoration : none;
 308         }
 309         /* List contents remove from list link */
 310         &.removefromlist  {
 311             background-position : -8px -690px; /* Delete */
 312             margin-right : 1em;
 313             text-decoration : none;
 314             padding-left : 15px;
 315         }
 316     }
 317 }
 318
 319 /* Override Bootstrap alert */
 320 .alert {
 321     background: #fffbe5; /* Old browsers */
 322     background: -moz-linear-gradient(top,  #fffbe5 0%, #fff0b2 9%, #fff1a8 89%, #f7e665 100%); /* FF3.6+ */
 323     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fffbe5), color-stop(9%,#fff0b2), color-stop(89%,#fff1a8), color-stop(100%,#f7e665)); /* Chrome,Safari4+ */
 324     background: -webkit-linear-gradient(top,  #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* Chrome10+,Safari5.1+ */
 325     background: -o-linear-gradient(top,  #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* Opera 11.10+ */
 326     background: -ms-linear-gradient(top,  #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* IE10+ */
 327     background: linear-gradient(to bottom,  #fffbe5 0%,#fff0b2 9%,#fff1a8 89%,#f7e665 100%); /* W3C */
 328     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fffbe5', endColorstr='#f7e665',GradientType=0 ); /* IE6-9 */
 329     border-color : #D6C43B;
 330     color: #333;
 331 }
 332
 333 /* Override Bootstrap alert.alert-info */
 334 .alert-info {
 335     background: #f4f6fa; /* Old browsers */
 336     background: -moz-linear-gradient(top,  #f4f6fa 0%, #eaeef5 4%, #e8edf6 96%, #cddbf2 100%); /* FF3.6+ */
 337     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f4f6fa), color-stop(4%,#eaeef5), color-stop(96%,#e8edf6), color-stop(100%,#cddbf2)); /* Chrome,Safari4+ */
 338     background: -webkit-linear-gradient(top,  #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* Chrome10+,Safari5.1+ */
 339     background: -o-linear-gradient(top,  #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* Opera 11.10+ */
 340     background: -ms-linear-gradient(top,  #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* IE10+ */
 341     background: linear-gradient(to bottom,  #f4f6fa 0%,#eaeef5 4%,#e8edf6 96%,#cddbf2 100%); /* W3C */
 342     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f6fa', endColorstr='#cddbf2',GradientType=0 ); /* IE6-9 */
 343     border-color : #C5D1E5;
 344     color: #333;
 345 }
 346
 347 /* Override Bootstrap alert.alert-success */
 348 .alert-success {
 349     background: #f8ffe8; /* Old browsers */
 350     background: -moz-linear-gradient(top,  #f8ffe8 0%, #e3f5ab 4%, #dcf48d 98%, #9ebf28 100%); /* FF3.6+ */
 351     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f8ffe8), color-stop(4%,#e3f5ab), color-stop(98%,#dcf48d), color-stop(100%,#9ebf28)); /* Chrome,Safari4+ */
 352     background: -webkit-linear-gradient(top,  #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* Chrome10+,Safari5.1+ */
 353     background: -o-linear-gradient(top,  #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* Opera 11.10+ */
 354     background: -ms-linear-gradient(top,  #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* IE10+ */
 355     background: linear-gradient(to bottom,  #f8ffe8 0%,#e3f5ab 4%,#dcf48d 98%,#9ebf28 100%); /* W3C */
 356     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8ffe8', endColorstr='#9ebf28',GradientType=0 ); /* IE6-9 */
 357     border-color : #9FBA35;
 358     color: #333;
 359 }
 360
 361 .breadcrumb {
 362     background-color: #F2F2EF;
 363     font-size: 85%;
 364     list-style: none outside none;
 365     margin: 10px 20px;
 366     padding: 5px 10px;
 367     .border-radius-all(7px);
 368 }
 369
 370 .form-inline {
 371     display : inline;
 372     padding: 0;
 373     margin: 0;
 374     fieldset {
 375         margin: 0.3em 0;
 376         padding: 0.3em;
 377     }
 378 }
 379
 380 .main {
 381     background-color: #FFF;
 382     border: 1px solid #D2D2CF;
 383     .border-radius-all(7px);
 384     .shadowed;
 385     margin-top : 0.5em;
 386     margin-bottom: 0.5em;
 387 }
 388
 389 .mastheadsearch {
 390     .border-radius-all(7px);
 391     padding: .8em;
 392     margin: .5em 0;
 393     background: #c7c7c1;
 394     /* Old browsers */
 395     background: -moz-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
 396     /* FF3.6+ */
 397     background: -webkit-gradient(linear, left top, left bottom, color-stop(38%,#c7c7c1), color-stop(100%,#a7a7a2));
 398     /* Chrome,Safari4+ */
 399     background: -webkit-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%);
 400     /* Chrome10+,Safari5.1+ */
 401     background: -o-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%);
 402     /* Opera 11.10+ */
 403     background: -ms-linear-gradient(top, #c7c7c1 38%,#a7a7a2 100%);
 404     /* IE10+ */
 405     background: linear-gradient(to bottom, #c7c7c1 38%,#a7a7a2 100%);
 406     /* W3C */
 407     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c7c7c1', endColorstr='#a7a7a2',GradientType=0 );
 408     /* IE6-9 */
 409     label {
 410         font-size: 115%;
 411         font-weight: bold;
 412     }
 413 }
 414
 415 .navbar-inverse .brand, .navbar-inverse .nav > li > a {
 416     color: #9FE1FF;
 417     font-weight: bold;
 418 }
 419
 420 .navbar-fixed-bottom.navbar-static-bottom {
 421     margin-top : .5em;
 422     position: static;
 423 }
 424
 425 #changelanguage .nav > .active > p {
 426     padding : 0 15px;
 427 }
 428
 429 .table-striped tbody > tr:nth-child(odd) > td,
 430 .table-striped tbody > tr:nth-child(odd) > th {
 431   background-color: #F4F4F4;
 432 }
 433
 434
 435 /* jQuery UI standard tabs */
 436 .ui-tabs-nav .ui-tabs-active a,
 437 .ui-tabs-nav a:hover,
 438 .ui-tabs-nav a:focus,
 439 .ui-tabs-nav a:active,
 440 .ui-tabs-nav span.a {
 441     background: none repeat scroll 0 0 transparent;
 442     outline: 0 none;
 443 }
 444
 445 .ui-widget,
 446 .ui-widget input,
 447 .ui-widget select,
 448 .ui-widget textarea,
 449 .ui-widget button {
 450     font-family : inherit;
 451     font-size : inherit;
 452 }
 453
 454 ul.ui-tabs-nav li {
 455     list-style : none;
 456 }
 457 .ui-tabs.ui-widget-content {
 458     background : transparent none;
 459     border : 0;
 460 }
 461
 462 .ui-tabs .ui-tabs-panel {
 463     border : 1px solid #D8D8D8;
 464     margin-bottom: 1em;
 465 }
 466 .ui-tabs-nav.ui-widget-header {
 467     border : 0;
 468     background : none;
 469 }
 470 .ui-tabs .ui-tabs-nav li {
 471     background: #F3F3F3 none;
 472     border-color: #D8D8D8;
 473     margin-right : .4em;
 474 }
 475
 476 .ui-tabs .ui-tabs-nav li.ui-tabs-active {
 477     background-color : #FFF;
 478     border : 1px solid #D8D8D8;
 479     border-bottom: 0;
 480 }
 481 .ui-tabs .ui-tabs-nav li.ui-tabs-active a {
 482     color : #000;
 483     font-weight : bold;
 484 }
 485
 486 .ui-tabs .ui-tabs-nav li.ui-state-default.ui-state-hover {
 487     background : #F3F3F3 none;
 488 }
 489
 490 .ui-tabs .ui-tabs-nav li.ui-tabs-active.ui-state-hover {
 491     background : #FFF none;
 492 }
 493
 494 .ui-tabs .ui-state-default a,
 495 .ui-tabs .ui-state-default a:link,
 496 .ui-tabs .ui-state-default a:visited {
 497     color: #006699;
 498 }
 499
 500 .ui-tabs .ui-state-hover a,
 501 .ui-tabs .ui-state-hover a:link,
 502 .ui-tabs .ui-state-hover a:visited {
 503     color: #990033;
 504 }
 505
 506 .statictabs {
 507     ul {
 508         background: none repeat scroll 0 0 transparent;
 509         border: 0 none;
 510         margin: 0;
 511         padding: 0.2em 0.2em 0;
 512         border-bottom-right-radius: 4px;
 513         border-bottom-left-radius: 4px;
 514         border-top-right-radius: 4px;
 515         border-top-left-radius: 4px;
 516         color: #222222;
 517         font-weight: bold;
 518         font-size: 100%;
 519         line-height: 1.3;
 520         list-style: none outside none;
 521         outline: 0 none;
 522         text-decoration: none;
 523         &:before {
 524             content: "";
 525             display: table;
 526         }
 527         &:after {
 528             clear: both;
 529             content: "";
 530             display: table;
 531         }
 532     }
 533     li {
 534         background: none repeat scroll 0 0 #E6F0F2;
 535         border: 1px solid #B9D8D9;
 536         border-bottom: 0 none !important;
 537         border-top-right-radius: 4px;
 538         border-top-left-radius: 4px;
 539         float: left;
 540         list-style: none outside none;
 541         margin-bottom: 0;
 542         margin-right: 0.4em;
 543         padding: 0;
 544         position: relative;
 545         white-space: nowrap;
 546         top: 1px;
 547         color: #555555;
 548         font-weight: normal;
 549         &.active {
 550             background-color: #FFFFFF;
 551             color: #212121;
 552             font-weight: normal;
 553             padding-bottom: 1px;
 554         }
 555         a {
 556             color: #004D99;
 557             cursor: pointer;
 558             float: left;
 559             padding: 0.5em 1em;
 560             text-decoration: none;
 561             &:hover {
 562                 background-color : #EDF4F5;
 563                 border-top-right-radius: 4px;
 564                 border-top-left-radius: 4px;
 565                 color : #538200;
 566             }
 567         }
 568         &.active {
 569             a {
 570                 color: #000000;
 571                 font-weight: bold;
 572                 cursor: text;
 573                 background: none repeat scroll 0 0 transparent;
 574                 outline: 0 none;
 575             }
 576         }
 577     }
 578     .tabs-container {
 579         border: 1px solid #B9D8D9;
 580         background: none repeat scroll 0 0 transparent;
 581         display: block;
 582         padding: 1em 1.4em;
 583         border-bottom-right-radius: 4px;
 584         border-bottom-left-radius: 4px;
 585         color: #222222;
 586     }
 587 }
 588
 589 /* End jQueryUI tab styles */
 590
 591 /* jQuery UI Datepicker */
 592 .ui-datepicker table {width: 100%; font-size: .9em; border : 0; border-collapse: collapse; margin:0 0 .4em; }
 593 .ui-datepicker th { background : transparent none; padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }
 594
 595 .ui-datepicker-trigger {
 596     vertical-align: middle;
 597     margin : 0 3px;
 598 }
 599 .ui-datepicker {
 600     .shadowed;
 601 }
 602 /* End jQueryUI datepicker styles */
 603
 604
 605 /* jQueryUI Core */
 606
 607 .ui-widget-content {
 608     border: 1px solid #AAA;
 609     background: #ffffff none;
 610     color: #222222;
 611 }
 612 .ui-widget-header {
 613     border: 1px solid #AAA;
 614     background: #E6F0F2 none;
 615     color: #222222;
 616     font-weight: bold;
 617 }
 618 .ui-state-default,
 619 .ui-widget-content .ui-state-default,
 620 .ui-widget-header .ui-state-default {
 621     border: 1px solid #AAA;
 622     background: #F4F8F9 none;
 623     font-weight: normal;
 624     color: #555555;
 625 }
 626 .ui-state-hover,
 627 .ui-widget-content .ui-state-hover,
 628 .ui-widget-header .ui-state-hover,
 629 .ui-state-focus,
 630 .ui-widget-content .ui-state-focus,
 631 .ui-widget-header .ui-state-focus {
 632     border: 1px solid #AAA;
 633     background: #E6F0F2 none;
 634     font-weight: normal;
 635     color: #212121;
 636 }
 637 .ui-state-active,
 638 .ui-widget-content .ui-state-active,
 639 .ui-widget-header .ui-state-active {
 640     border: 1px solid #aaaaaa;
 641     background: #ffffff none;
 642     font-weight: normal;
 643     color: #212121;
 644 }
 645 .ui-state-highlight,
 646 .ui-widget-content .ui-state-highlight,
 647 .ui-widget-header .ui-state-highlight  {border: 1px solid #fcefa1;
 648     background: #fbf9ee;
 649     color: #363636;
 650 }
 651 .ui-state-error,
 652 .ui-widget-content .ui-state-error,
 653 .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a;
 654     background: #fef1ec;
 655     color: #cd0a0a;
 656 }
 657
 658 /* end jQueryUI core */
 659
 660 /* jQueryUI autocomplete */
 661
 662 .ui-autocomplete {
 663     position: absolute;
 664     cursor: default;
 665     .shadowed;
 666 }
 667 .ui-autocomplete.ui-widget-content .ui-state-hover {
 668     border: 1px solid #AAA;
 669     background: #E6F0F2 none;
 670     font-weight: normal;
 671     color: #212121;
 672 }
 673 .ui-autocomplete-loading {
 674     background: #FFF url("../../img/loading-small.gif") right center no-repeat;
 675 }
 676 .ui-menu li {
 677     list-style:none;
 678 }
 679
 680 /* end jQueryUI autocomplete */
 681
 682
 683
 684 th {
 685     background-color: #ECEDE6;
 686 }
 687
 688 .item-thumbnail {
 689     max-width: none;
 690 }
 691
 692 .no-image {
 693     background-color : #FFF;
 694     border: 1px solid #AAA;
 695     color : #979797;
 696     display:block;
 697     font-size : 86%;
 698     font-weight : bold;
 699     text-align : center;
 700     width : 75px;
 701     .border-radius-all(3px);
 702 }
 703
 704 #bookcover .no-image {
 705     margin-right : 10px;
 706     margin-bottom : 10px;
 707 }
 708
 709 td.overdue {
 710     color : #cc3333;
 711 }
 712 table {
 713     font-size: 90%;
 714 }
 715 th.sum {
 716     text-align: right;
 717 }
 718
 719 td.sum {
 720     background-color: #FFC;
 721     font-weight: bold;
 722 }
 723
 724 th[scope=row] {
 725     background-color: transparent;
 726     text-align : right;
 727 }
 728
 729 .required {
 730     color : #C00;
 731 }
 732
 733 .label {
 734     background-color: transparent;
 735     color: inherit;
 736     display: inline;
 737     font-weight: normal;
 738     padding : 0;
 739     text-shadow: none;
 740 }
 741
 742 .blabel {
 743     background-color: #999999;
 744     border-radius: 3px;
 745     color: #ffffff;
 746     display: inline-block;
 747     font-weight: bold;
 748     padding: 2px 4px;
 749     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
 750 }
 751
 752 .label-important {
 753   background-color: #b94a48;
 754 }
 755 .label-warning {
 756   background-color: #f89406;
 757 }
 758 .label-success {
 759   background-color: #468847;
 760 }
 761 .label-info {
 762   background-color: #3a87ad;
 763 }
 764 .label-inverse {
 765   background-color: #333333;
 766 }
 767
 768 fieldset {
 769     &.rows {
 770         float : left;
 771         font-size : 90%;
 772         clear : left;
 773         margin: .9em 0 0 0;
 774         padding: 0;
 775         width: 100%;
 776         legend {
 777             font-weight: bold;
 778             font-size : 130%;
 779         }
 780         label,
 781         .label {
 782             float: left;
 783             font-weight : bold;
 784             width: 9em;
 785             margin-right: 1em;
 786             text-align: right;
 787         }
 788         label {
 789             &.lradio {
 790                 float: none;
 791                 margin: inherit;
 792                 width: auto;
 793             }
 794         }
 795         fieldset {
 796             margin : 0;
 797             padding : .3em;
 798         }
 799         ol {
 800             padding: 1em 1em 0 1em;
 801             list-style-type: none;
 802             &.lradio {
 803                 label {
 804                     width : auto;
 805                     float : none;
 806                     margin-right : 0;
 807                     &.lradio {
 808                         float : left;
 809                         width : 12em;
 810                         margin-right : 1em;
 811                     }
 812                 }
 813             }
 814         }
 815         li {
 816             float : left;
 817             clear : left;
 818             padding-bottom: 1em;
 819             list-style-type: none;
 820             width: 100%;
 821             &.lradio {
 822                 padding-left: 8.5em;
 823                 width : auto;
 824                 label {
 825                     float : none;
 826                     width : auto;
 827                     margin : 0 0 0 1em;
 828                 }
 829             }
 830         }
 831         .hint {
 832             display: block;
 833             margin-left : 11em;
 834         }
 835     }
 836     &.action {
 837         clear : both;
 838         float : none;
 839         border : none;
 840         margin : 0;
 841         padding : 1em 0 .3em 0;
 842         width : auto;
 843         p {
 844             margin-bottom : 1em;
 845         }
 846     }
 847     table {
 848         font-size: 100%;
 849     }
 850 }
 851
 852 div.rows+div.rows {
 853     margin-top : .6em;
 854 }
 855
 856 div.rows {
 857     float : left;
 858     clear : left;
 859     margin: 0 0 0 0;
 860     padding: 0;
 861     width: 100%;
 862     span.label {
 863         float: left;
 864         font-weight : bold;
 865         width: 9em;
 866         margin-right: 1em;
 867         text-align: left;
 868     }
 869     ol {
 870         list-style-type: none;
 871         margin-left : 0;
 872         padding: .5em 1em 0 0;
 873     }
 874     li {
 875         border-bottom :  1px solid #EEE;
 876         float : left;
 877         clear : left;
 878         padding-bottom: .2em;
 879         padding-top: .1em;
 880         list-style-type: none;
 881         width: 100%;
 882     }
 883     ul {
 884         li {
 885             margin-left : 7.3em;
 886             &:first-child {
 887                 float: none;
 888                 clear: none;
 889                 margin-left: 0;
 890             }
 891         }
 892     }
 893     ol li li {
 894         border-bottom: 0;
 895     }
 896 }
 897
 898 /* different sizes for different tags in opac-tags.tt */
 899 .tagweight0 {
 900     font-size: 12px;
 901 }
 902
 903 .tagweight1 {
 904     font-size: 14px;
 905 }
 906
 907 .tagweight2 {
 908     font-size: 16px;
 909 }
 910
 911 .tagweight3 {
 912     font-size: 18px;
 913 }
 914
 915 .tagweight4 {
 916     font-size: 20px;
 917 }
 918
 919 .tagweight5 {
 920     font-size: 22px;
 921 }
 922
 923 .tagweight6 {
 924     font-size: 24px;
 925 }
 926
 927 .tagweight7 {
 928     font-size: 26px;
 929 }
 930
 931 .tagweight8 {
 932     font-size: 28px;
 933 }
 934
 935 .tagweight9 {
 936     font-size: 30px;
 937 }
 938
 939 .toolbar {
 940     background-color : #EEEEEE;
 941     border : 1px solid #E8E8E8;
 942     font-size : 85%;
 943     padding:3px 3px 5px 5px;
 944     vertical-align : middle;
 945     a {
 946         white-space: nowrap;
 947     }
 948     label {
 949         display: inline;
 950         font-size: 100%;
 951         font-weight : bold;
 952         margin-left : .5em;
 953     }
 954     select {
 955         font-size: 97%;
 956         height: auto;
 957         line-height: inherit;
 958         padding: 0;
 959         margin: 0;
 960         width : auto;
 961         white-space: nowrap;
 962     }
 963     .hold,
 964     #tagsel_tag {
 965         padding-left: 28px;
 966         font-size: 97%;
 967         font-weight: bold;
 968     }
 969     #tagsel_form {
 970         margin-top : .5em;
 971     }
 972     li {
 973         display : inline;
 974         list-style : none;
 975         a {
 976             border-left : 1px solid #e8e8e8;
 977         }
 978         &:first-child {
 979             a {
 980                 border-left : 0;
 981             }
 982         }
 983     }
 984     ul {
 985         padding-left : 0;
 986     }
 987 }
 988
 989 #basket .toolbar {
 990     padding: 7px 5px 9px 9px;
 991 }
 992
 993 #selections-toolbar,
 994 .selections-toolbar {
 995     background: -moz-linear-gradient(top, #b2b2b2 0%, #e0e0e0 14%, #e8e8e8 100%); /* FF3.6+ */
 996     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2b2b2), color-stop(14%,#e0e0e0), color-stop(100%,#e8e8e8)); /* Chrome,Safari4+ */
 997     background: -webkit-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* Chrome10+,Safari5.1+ */
 998     background: -o-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* Opera 11.10+ */
 999     background: -ms-linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* IE10+ */
1000     background: linear-gradient(top, #b2b2b2 0%,#e0e0e0 14%,#e8e8e8 100%); /* W3C */
1001     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e0e0', endColorstr='#e8e8e8',GradientType=0 ); /* IE6-9 */
1002     margin : 0 0 1em 0;
1003     padding-top : .5em;
1004     padding-left : 10px;
1005 }
1006
1007 .list-actions {
1008     display : inline;
1009 }
1010
1011 #tagsel_span input.submit,
1012 #tagsel_tag {
1013     border : 0;
1014     background-color: transparent;
1015     font-size : 100%;
1016     color: #0076B2;
1017     cursor : pointer;
1018     background-image : url("../images/sprite.png"); /* Tags */
1019     background-position : 1px -643px;
1020     background-repeat : no-repeat;
1021     padding-left : 25px;
1022     text-decoration: none;
1023 }
1024
1025 #tagsel_tag.disabled {
1026     background-position : -1px -667px;
1027 }
1028
1029
1030 #tagsel_span input:hover,
1031 #selections-toolbar input.hold:hover {
1032     color: #005580;
1033     text-decoration: underline;
1034 }
1035
1036 #tagsel_span input.disabled,
1037 #tagsel_span input.disabled:hover,
1038 #tagsel_span input.hold.disabled,
1039 #tagsel_span input.hold.disabled:hover,
1040 #selections-toolbar input.hold.disabled,
1041 #selections-toolbar input.hold.disabled:hover,
1042 #selections-toolbar a.disabled,
1043 #selections-toolbar a.disabled:hover,
1044 .selections-toolbar a.disabled,
1045 .selections-toolbar a.disabled:hover {
1046     color: #888888;
1047     text-decoration: none;
1048     padding-left : 23px;
1049 }
1050
1051 .results_summary {
1052     display: block;
1053     font-size : 85%;
1054     color: #707070;
1055     padding : 0 0 .5em 0;
1056     .results_summary {
1057         font-size : 100%;
1058     }
1059     &.actions {
1060         margin-top : .5em;
1061     }
1062     &.tagstatus {
1063         display: inline;
1064     }
1065     .label {
1066         color: #202020;
1067     }
1068     a {
1069         font-weight: normal;
1070     }
1071 }
1072
1073 #views {
1074     margin-bottom : .5em;
1075     padding : 0 2em 0.2em 0.2em;
1076 }
1077
1078 .view {
1079     background-color : #F3F3F3;
1080     border: 1px solid #C9C9C9;
1081     border-radius: 4px;
1082     display: inline-block;
1083     padding: 0.2em 0.5em;
1084     white-space: nowrap;
1085 }
1086
1087 #bibliodescriptions,
1088 #isbdcontents {
1089     clear : left;
1090     margin-top : .5em;
1091 }
1092
1093 .view {
1094     a,
1095     span {
1096         background-image: url("../images/sprite.png");
1097         background-repeat : no-repeat;
1098         font-size : 87%;
1099         padding-left: 15px;
1100         text-decoration: none;
1101     }
1102 }
1103
1104 .view {
1105     a {
1106         font-weight : normal;
1107     }
1108 }
1109
1110 .current-view {
1111     background-color: #fff;
1112     font-weight: bold;
1113 }
1114
1115 #MARCview {
1116     background-position: -9px -27px;
1117 }
1118 #ISBDview {
1119     background-position: -10px -56px;
1120 }
1121 #Normalview {
1122     background-position: -8px 3px;
1123 }
1124
1125 #bookcover {
1126     float : left;
1127     margin : 0;
1128     padding : 0;
1129     .no-image {
1130         margin-right : 10px;
1131         margin-bottom : 10px;
1132     }
1133     img {
1134         margin : 0 1em 1em 0;
1135     }
1136 }
1137
1138 /* pagination */
1139 .results-pagination {
1140     position: absolute;
1141     top:32px;
1142     left: -1px;
1143     width: 100%;
1144     height:auto;
1145     border: 1px solid #D0D0D0;
1146     display: none;
1147     background-color:#F3F3F3;
1148     padding-bottom:10px;
1149     z-index: 100;
1150 }
1151
1152
1153 .back {
1154     float:right;
1155     input {
1156         background:none!important;
1157         color:#999!important;
1158     }
1159 }
1160
1161 .pagination_list {
1162     ul {
1163         padding-top: 40px;
1164         padding-left:0px;
1165     }
1166     li {
1167         list-style:none;
1168         float:bottom;
1169         padding:4px;
1170         color:#999;
1171         &.highlight {
1172            background-color : #F3F3F3;
1173            border-top : 1px solid #DDDDDD;
1174            border-bottom : 1px solid #DDDDDD;
1175         }
1176         a {
1177             padding-left:0px;
1178         }
1179     }
1180     .li_pag_index {
1181         color: #999999;
1182         float: left;
1183         font-size: 15px;
1184         font-weight: bold;
1185         padding-right: 10px;
1186         text-align: right;
1187         width: 13px;
1188     }
1189 }
1190
1191 .nav_results {
1192     background-color: #F3F3F3;
1193     border: 1px solid #D0D0D0;
1194     font-size: 95%;
1195     font-weight: bold;
1196     margin-top: 0.5em;
1197     position:relative;
1198     .l_Results {
1199         a {
1200             background:#E1E1E1 url("../images/sprite.png") no-repeat 0px -504px; /* Browse results menu */
1201             color:#006699;
1202             display:block;
1203             padding:8px 28px;
1204             text-decoration:none;
1205         }
1206         &:hover {
1207             background-color:#D9D9D9;
1208         }
1209     }
1210 }
1211
1212 .pg_menu {
1213     margin: 0;
1214     border-top: 1px solid #D0D0D0;
1215     white-space : nowrap;
1216     li {
1217         color:#B2B2B2;
1218         display:inline;
1219         list-style:none;
1220         margin: 0;
1221         &.back_results {
1222             a {
1223                 border-left: 1px solid #D0D0D0;
1224                 border-right: 1px solid #D0D0D0;
1225             }
1226         }
1227         a,
1228         span {
1229             background-color: #F3F3F3;
1230             display : block;
1231             float:left;
1232             padding:.4em .5em;
1233             text-decoration:none;
1234             font-weight:normal;
1235             text-align:center;
1236         }
1237         span {
1238             color : #B2B2B2;
1239         }
1240     }
1241 }
1242
1243 #listResults{
1244     li {
1245         background-color:#999999;
1246         color:#C5C5C5;
1247         font-weight:normal;
1248         display:block;
1249         margin-right:1px;
1250         font-size: 80%;
1251         padding: 0;
1252         text-align:center;
1253         min-width:18px;
1254         &:hover {
1255             background-color:#006699;
1256         }
1257         a {
1258             color:#FFFFFF;
1259             font-weight:normal;
1260         }
1261     }
1262 }
1263
1264 /* nav */
1265 .nav_pages {
1266     .close_pagination {
1267         padding-right: 10px;
1268         position: absolute;
1269         right: 3px;
1270         top: -25px;
1271     }
1272     .close_pagination a {
1273         text-decoration:none!important;
1274     }
1275     ul {
1276         padding-top: 10px;
1277     }
1278     li {
1279         list-style:none;
1280         float:left;
1281         padding:4px;
1282         color:#999;
1283         a {
1284             text-decoration:none!important;
1285             &:hover {
1286             text-decoration:underline;
1287             }
1288         }
1289         ul {
1290             float:left;
1291         }
1292     }
1293 }
1294
1295 /* action buttons */
1296 #action {
1297     margin : .5em 0 0 0;
1298     background-color : #F3F3F3;
1299     border : 1px solid #E8E8E8;
1300     padding-bottom : 3px;
1301     li {
1302         list-style : none;
1303         margin : .2em;
1304         padding : .3em 0;
1305     }
1306     a {
1307         font-weight: bold;
1308         text-decoration : none;
1309     }
1310 }
1311
1312 #export,
1313 #moresearches_menu {
1314     li {
1315         padding : 0;
1316         margin : 0;
1317         a {
1318             font-weight: normal;
1319             &.menu-inactive {
1320                 font-weight: bold;
1321             }
1322         }
1323     }
1324 }
1325
1326 #format,
1327 #furthersearches {
1328     padding-left : 35px;
1329 }
1330 .highlight_controls {
1331     float: left;
1332 }
1333 a.addtocart,
1334 a.addtoshelf,
1335 a.brief,
1336 a.deleteshelf,
1337 a.deleteshelf.disabled,
1338 a.detail,
1339 a.download,
1340 a.editshelf,
1341 a.empty,
1342 a.hide,
1343 a.highlight_toggle,
1344 a.hold,
1345 a.hold.disabled,
1346 a.incart,
1347 a.new,
1348 a.print-small,
1349 a.print-large,
1350 a.removeitems,
1351 a.removeitems.disabled,
1352 a.reserve,
1353 a.article_request,
1354 a.send,
1355 a.tag_add,
1356 a.removefromlist,
1357 input.hold,
1358 input.hold.disabled,
1359 input.editshelf,
1360 .newshelf,
1361 .newshelf.disabled,
1362 .deleteshelf {
1363     background-image: url("../images/sprite.png");
1364     background-repeat: no-repeat;
1365 }
1366
1367
1368 a.addtocart {
1369     background-position: -5px -265px; /* Cart */
1370     padding-left : 35px;
1371 }
1372
1373 a.addtoshelf {
1374     background-position: -5px -225px; /* Virtual shelf */
1375     padding-left : 35px;
1376 }
1377
1378 a.brief {
1379
1380     background-position : -2px -868px; /* Zoom out */
1381     text-decoration : none;
1382     padding-left : 27px;
1383 }
1384
1385 a.cartRemove {
1386     color: #cc3333;
1387     font-size : 90%;
1388     margin : 0;
1389     padding: 0;
1390 }
1391
1392 a.detail {
1393     background-position : -2px -898px; /* Zoom in */
1394     text-decoration : none;
1395     padding-left : 27px;
1396 }
1397
1398 a.download {
1399     background-position : -5px -348px; /* Download */
1400     padding-left : 20px;
1401     text-decoration : none;
1402 }
1403
1404 a.editshelf {
1405     background-position : 2px -348px; /* List edit */
1406     padding-left : 26px;
1407     text-decoration : none;
1408 }
1409
1410 a.empty {
1411     background-position : 2px -598px; /* Trash */
1412     text-decoration : none;
1413     padding-left : 30px;
1414 }
1415
1416 a.hide {
1417     background-position: -3px -814px; /* Close */
1418     text-decoration : none;
1419     padding-left : 26px;
1420 }
1421
1422 a.highlight_toggle {
1423     background-position: -5px -841px; /* Highlight */
1424     display: none;
1425     padding-left : 35px;
1426 }
1427
1428 a.hold,
1429 input.hold {
1430     background-position : -2px -453px; /* Toolbar place hold */
1431     text-decoration : none;
1432     padding-left : 23px;
1433 }
1434
1435 a.hold.disabled,
1436 input.hold.disabled {
1437     background-position : -5px -621px; /* Place hold disabled */
1438 }
1439
1440 a.incart {
1441     background-position: -5px -265px; /* Cart */
1442     color : #666;
1443     padding-left : 35px;
1444 }
1445
1446 a.new {
1447     background-image : url("../images/sprite.png"); /* New */
1448     background-position : -4px -922px;
1449     padding-left : 23px;
1450     text-decoration : none;
1451 }
1452
1453 a.print-small {
1454     background-position : 0px -423px; /* Toolbar print */
1455     text-decoration : none;
1456     padding-left : 30px;
1457 }
1458
1459 a.print-large {
1460     background-position : -5px -186px; /* Toolbar print */
1461     text-decoration : none;
1462     padding-left : 35px;
1463 }
1464
1465 a.removeitems,
1466 a.deleteshelf {
1467     background-position : 2px -690px; /* Delete */
1468     text-decoration : none;
1469     padding-left : 25px;
1470 }
1471
1472 a.removeitems.disabled,
1473 a.deleteshelf.disabled {
1474     background-position : 2px -712px; /* Delete disabled */
1475 }
1476
1477 a.reserve {
1478     background-position: -6px -144px; /* Place hold */
1479     padding-left : 35px;
1480 }
1481
1482 a.article_request {
1483     background-position: 0px -24px; /* Place article request */
1484     padding-left : 35px;
1485 }
1486
1487 a.send {
1488     background-position : 2px -386px; /* Email */
1489     text-decoration : none;
1490     padding-left : 28px;
1491 }
1492
1493 a.tag_add {
1494     background-position: 3px -1111px; /* Tag results */
1495     padding-left : 27px;
1496     text-decoration: none;
1497 }
1498
1499 input.hold {
1500     background-color: transparent;
1501     border : 0;
1502     color: #0076B2;
1503     font-weight: bold;
1504 }
1505
1506 input.editshelf {
1507     background-color: transparent;
1508     background-position : 2px -736px; /* List edit */
1509     border : 0;
1510     color : #006699;
1511     cursor : pointer;
1512     filter: none;
1513     font-size : 100%;
1514     padding-left : 29px;
1515     text-decoration : none;
1516 }
1517
1518 .newshelf {
1519     background-position: 2px -764px; /* List new */
1520     border : 0;
1521     color : #006699;
1522     cursor : pointer;
1523     filter: none;
1524     font-size : 100%;
1525     padding-left : 28px;
1526     text-decoration : none;
1527 }
1528
1529 .newshelf.disabled {
1530     background-position: -4px -791px; /* List new disabled */
1531 }
1532
1533 .deleteshelf {
1534     background-color: transparent;
1535     background-position : 2px -690px; /* Delete */
1536     border : 0;
1537     color : #006699;
1538     cursor : pointer;
1539     filter: none;
1540     font-size : 100%;
1541     padding-left : 25px;
1542     text-decoration : none;
1543 }
1544
1545 .links a {
1546     font-weight : bold;
1547 }
1548
1549 .deleteshelf:hover {
1550     color: #990033;
1551 }
1552
1553
1554 .editshelf:active,
1555 .deleteshelf:active {
1556     border : 0;
1557 }
1558
1559 #tagslist li { display : inline; }
1560
1561 #login4tags {
1562     background-image: url("../images/sprite.png"); /* Tag results disabled */
1563     background-position: -6px -1130px;
1564     background-repeat: no-repeat;
1565     padding-left : 20px;
1566     text-decoration: none;
1567 }
1568
1569 .tag_results_input {
1570     margin-left: 1em;
1571     padding: 0.3em;
1572     font-size: 12px;
1573     input[type="text"] {
1574         font-size: inherit;
1575         margin : 0;
1576         padding : 0;
1577     }
1578     label {
1579         display : inline;
1580     }
1581 }
1582
1583 .tagsinput {
1584     input[type="text"] {
1585         font-size: inherit;
1586         margin : 0;
1587         padding : 0;
1588     }
1589     label {
1590         display : inline;
1591     }
1592 }
1593
1594 .branch-info-tooltip {
1595     display: none;
1596 }
1597
1598 .ui-tooltip-content p {
1599         margin: 0.3em 0;
1600 }
1601
1602 #social_networks {
1603     a {
1604         background: transparent url("../images/social-sprite.png") no-repeat;
1605         display: block;
1606         height : 20px !important;
1607         width : 20px;
1608         text-indent : -999em;
1609     }
1610     span {
1611         color: #274D7F;
1612         display : block;
1613         float : left;
1614         font-size: 85%;
1615         font-weight: bold;
1616         line-height: 2em;
1617         margin : .5em 0 .5em .5em !important;
1618     }
1619     div {
1620         float : left !important;
1621         margin : .5em 0 .5em .2em !important;
1622     }
1623     #facebook {
1624         background-position : -7px -35px;
1625     }
1626     #twitter {
1627         background-position : -7px -5px;
1628     }
1629     #linkedin {
1630         background-position : -7px -95px;
1631     }
1632     #delicious {
1633         background-position : -7px -66px;
1634     }
1635     #email {
1636         background-position : -7px -126px;
1637     }
1638 }
1639
1640 #marc {
1641     td,
1642     th {
1643         background-color : transparent;
1644         border : 0;
1645         padding: 3px 5px;
1646         text-align : left;
1647     }
1648     td:first-child {
1649         text-indent : 2em;
1650     }
1651     p {
1652         padding-bottom: .6em;
1653         .label {
1654             font-weight : bold;
1655         }
1656     }
1657     ul {
1658         padding-bottom: .6em;
1659     }
1660     .results_summary {
1661         clear :  left;
1662         ul {
1663             display : inline;
1664             float :  none;
1665             clear :  none;
1666             margin: 0;
1667             padding: 0;
1668             list-style : none;
1669         }
1670         li {
1671             display: inline;
1672         }
1673     }
1674 }
1675
1676 #items,
1677 #items td
1678 #items th {
1679     border : 1px solid #EEE;
1680     font-size : 90%;
1681 }
1682
1683 #plainmarc table { border: 0; margin: .7em 0 0 0; font-family: monospace; font-size: 95%; }
1684 #plainmarc th { background-color : #FFF; border: 0; white-space: nowrap; text-align:left; vertical-align: top; padding: 2px; }
1685 #plainmarc td { border: 0; padding : 2px; vertical-align: top; }
1686
1687 #renewcontrols {
1688      float: right;
1689      font-size: 66%;
1690 }
1691
1692 #renewcontrols a {
1693     background-repeat : no-repeat;
1694     text-decoration:none;
1695     padding : .1em .4em;
1696     padding-left : 18px;
1697 }
1698
1699 #renewselected_link {
1700     background-image : url("../images/sprite.png");
1701     background-position : -5px -986px;
1702     background-repeat: no-repeat;
1703 }
1704
1705 #renewall_link {
1706     background-image : url("../images/sprite.png");
1707     background-position : -8px -967px;
1708     background-repeat: no-repeat;
1709 }
1710
1711 .authref {
1712     text-indent: 2em;
1713 }
1714
1715 .authref .label {
1716     font-style: italic;
1717 }
1718
1719 .authstanza {
1720     margin-top: 1em;
1721 }
1722
1723 .authstanzaheading {
1724     font-weight: bold;
1725 }
1726 .authorizedheading {
1727     font-weight: bold;
1728 }
1729 .authstanza li {
1730     margin-left: 0.5em;
1731 }
1732 .authres_notes, .authres_seealso, .authres_otherscript {
1733   padding-top: .5em;
1734 }
1735 .authres_notes {
1736   font-style: italic;
1737 }
1738
1739 #didyoumean {
1740     background-color: #EEE;
1741     border: 1px solid #E8E8E8;
1742     box-sizing: border-box;
1743     margin: .5em 1.5em;
1744     text-align: left;
1745     padding: 0.5em;
1746     .border-radius-all(3px);
1747
1748     &.dym-loaded {
1749         border-color: #F4ECBE;
1750         background-color: #FFFBEA;
1751     }
1752 }
1753
1754 .suggestionlabel {
1755     font-weight: bold;
1756 }
1757
1758 .searchsuggestion {
1759     padding: 0.2em 0.5em;
1760     display: inline-block;
1761 }
1762
1763 .authlink {
1764     padding-left: 0.25em;
1765 }
1766 #hierarchies a {
1767     font-weight: normal;
1768     text-decoration: underline;
1769     color: #069;
1770 }
1771
1772 #hierarchies a:hover {
1773     color: #990033;
1774 }
1775
1776 #top-pages {
1777     margin: 0 0 0.5em;
1778 }
1779 .dropdown-menu > li > a {
1780     font-size: 90%;
1781 }
1782 a.listmenulink:link,
1783 a.listmenulink:visited {
1784     color : #0076B2;
1785     font-weight: bold;
1786 }
1787 a.listmenulink:hover,
1788 a.listmenulink:active {
1789     color : #FFF;
1790     font-weight: bold;
1791 }
1792 #cartDetails,
1793 #cartUpdate,
1794 #holdDetails,
1795 #listsDetails {
1796     background-color : #FFF;
1797 //    border: 1px solid #739acf;
1798     border: 1px solid rgba(0, 0, 0, 0.2);
1799     border-radius: 6px 6px 6px 6px;
1800     box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
1801     color : black;
1802     display : none;
1803     font-size: 90%;
1804     margin : 0;
1805     padding : 8px 20px;
1806     text-align : center;
1807     width : 180px;
1808     z-index: 2;
1809 }
1810 #cartmenulink {
1811     white-space: nowrap;
1812 }
1813
1814 #search-facets,
1815 #menu {
1816     border : 1px solid #D2D2CF;
1817     .border-radius-all(7px);
1818     ul {
1819        margin : 0;
1820         padding : .3em;
1821     }
1822     form {
1823        margin : 0;
1824     }
1825     h4 {
1826         font-size : 90%;
1827         margin : 0 0 .6em 0;
1828         text-align : center;
1829         a {
1830             background-color : #F2F2EF;
1831             border-radius: 8px 8px 0 0;
1832             border-bottom : 1px solid #D8D8D8;
1833             display: block;
1834             font-weight: bold;
1835             padding : .7em .2em;
1836             text-decoration: none;
1837         }
1838     }
1839     li {
1840         font-size: 90%;
1841         font-weight : bold;
1842         list-style-type : none;
1843         li {
1844             font-weight : normal;
1845             font-size : 95%;
1846             line-height: 125%;
1847             margin-bottom : 2px;
1848             padding : .1em .2em;
1849         }
1850         &.showmore {
1851             a {
1852                 font-weight : bold;
1853                 text-indent : 1em;
1854             }
1855         }
1856     }
1857     a {
1858         font-weight : normal;
1859         text-decoration: underline;
1860     }
1861     .facet-count {
1862         display: inline-block;
1863     }
1864
1865 }
1866
1867 #menu {
1868     font-size : 94%;
1869     li {
1870         list-style-type : none;
1871         a {
1872             background: #eeeeee;
1873             text-decoration : none;
1874             display : block;
1875             border : 1px solid #D8D8D8;
1876             border-radius: 5px 0 0 5px;
1877             border-bottom-color:  #999;
1878             font-size : 111%;
1879             padding : .4em .6em;
1880             margin : .4em 0;
1881             margin-right: -1px;
1882             &:hover {
1883                 background: #eaeef5;
1884             }
1885         }
1886         &.active {
1887             a {
1888                 background-color : #FFF;
1889                 background-image : none;
1890                 border-right-width: 0;
1891                 font-weight : bold;
1892                 &:hover {
1893                     background-color : #fff;
1894                 }
1895             }
1896         }
1897     }
1898     h4 {
1899         display: none;
1900     }
1901 }
1902
1903 #addto {
1904     max-width : 10em;
1905 }
1906
1907 /* Search results add to cart (lists disabled) */
1908 .addto a.addtocart {
1909     background-image: url("../images/sprite.png"); /* Cart */
1910     background-position: -5px -266px;
1911     background-repeat: no-repeat;
1912     text-decoration : none;
1913     padding-left : 33px;
1914 }
1915
1916 .searchresults {
1917     p {
1918         margin: 0;
1919         padding: 0 0 .6em 0;
1920         &.details {
1921            color : #979797;
1922         }
1923     }
1924     a {
1925         &.highlight_toggle {
1926             background-image: url("../images/sprite.png"); /* Highlight */
1927             background-position: -11px -841px;
1928             background-repeat: no-repeat;
1929             display: none;
1930             font-weight: normal;
1931             padding : 0 10px 0 21px;
1932         }
1933     }
1934     .commentline {
1935         background-color : rgb(255, 255, 204);
1936         background-color : rgba(255, 255, 204, 0.4);
1937         border : 1px solid #CCC;
1938         display: inline-block;
1939         .border-radius-all(3px);
1940         .shadowed;
1941         margin : .3em;
1942         padding : .4em;
1943     }
1944     .commentline.yours {
1945         background-color : rgb(239, 254, 213);
1946         background-color : rgba(239, 254, 213, 0.4);
1947     }
1948 }
1949
1950 .commentline .avatar {
1951     float : right;
1952     padding-left : .5em;
1953 }
1954
1955 /* style for search terms in catalogsearch */
1956 .term {
1957     /* color : blue; */
1958     color : #990000;
1959     background-color : #FFFFCC;
1960 }
1961
1962 /* style for shelving location in catalogsearch */
1963 .shelvingloc {
1964     display : block;
1965     font-style : italic;
1966 }
1967 #CheckAll,
1968 #CheckNone,
1969 .CheckAll,
1970 .CheckNone {
1971     font-weight : normal;
1972     margin : 0 .5em;
1973     text-decoration: underline;
1974 }
1975
1976 span.sep {
1977     color: #888;
1978     padding: 0 .2em 0 .5em;
1979     text-shadow: 1px 1px 0 #FFF;
1980 }
1981
1982 /* style for PM-generated pagination bar */
1983 .pages {
1984     margin: 20px 0;
1985 }
1986 .pages span:first-child,
1987 .pages a:first-child {
1988     border-width: 1px 1px 1px 1px;
1989     border-bottom-left-radius: 3px;
1990     border-top-left-radius: 3px;
1991 }
1992
1993 .pages span:last-child,
1994 .pages a:last-child {
1995     border-width: 1px 1px 1px 0;
1996     border-bottom-right-radius: 3px;
1997     border-top-right-radius: 3px;
1998 }
1999
2000 .pages .inactive,
2001 .pages .currentPage,
2002 .pages a {
2003     -moz-border-bottom-colors: none;
2004     -moz-border-left-colors: none;
2005     -moz-border-right-colors: none;
2006     -moz-border-top-colors: none;
2007     background-color: #FFFFFF;
2008     border-color: #DDDDDD;
2009     border-image: none;
2010     border-style: solid;
2011     border-width: 1px 1px 1px 0;
2012     float: left;
2013     font-size: 11.9px;
2014     line-height: 20px;
2015     padding: 4px 12px;
2016     text-decoration: none;
2017 }
2018
2019 .pages .inactive {
2020     background-color: #F5F5F5;
2021 }
2022
2023 .pages a[rel='last'] {
2024     border-bottom-right-radius: 3px;
2025     border-top-right-radius: 3px;
2026 }
2027
2028 .hold-message {
2029     background-color: #FFF0B1;
2030     display: inline-block;
2031     margin: 0.5em;
2032     padding: 0.2em 0.5em;
2033     .border-radius-all(3px);
2034 }
2035 .reserve_date,
2036 .expiration_date {
2037     white-space: nowrap;
2038 }
2039 .close {
2040     color: #0088CC;
2041     position: inherit;
2042     top: auto;
2043     right : auto;
2044     filter : none;
2045     float : none;
2046     font-size: inherit;
2047     font-weight: normal;
2048     opacity: inherit;
2049     text-shadow: none;
2050 }
2051
2052 .close:hover {
2053     color: #538200;
2054     filter: inherit;
2055     font-size: inherit;
2056     opacity: inherit;
2057 }
2058
2059 /* Redefine a new style for Bootstrap's class "close" since we use that already */
2060 /* Use <a class="closebtn" href="#">&times;</a> */
2061 .alert .closebtn{position:relative;top:-2px;right:-21px;line-height:20px;}
2062 .modal-header .closebtn{margin-top:2px;}
2063 .closebtn{float:right;font-size:20px;font-weight:bold;line-height:20px;color:#000000;text-shadow:0 1px 0 #ffffff;opacity:0.2;filter:alpha(opacity=20);}.closebtn:hover{color:#000000;text-decoration:none;cursor:pointer;opacity:0.4;filter:alpha(opacity=40);}
2064 button.closebtn{padding:0;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;}
2065 .btn-group label,
2066 .btn-group select {
2067     font-size: 13px;
2068 }
2069
2070 .span2 select {
2071     width: 100%;
2072 }
2073
2074 .popup .main {
2075     font-size: 90%;
2076     padding: 0 1em;
2077 }
2078
2079 .popup legend {
2080     line-height: 1.5em;
2081     margin-bottom : .5em;
2082 }
2083
2084 .item-status {
2085     display: block;
2086     font-size: 95%;
2087     margin-bottom: .5em;
2088 }
2089
2090 .available {
2091     color : #006600;
2092 }
2093
2094 .unavailable {
2095     color: #990033;
2096 }
2097
2098 .waiting,.intransit,.notforloan,.checkedout,.lost,.notonhold {
2099     display : block;
2100 }
2101
2102 .notforloan {
2103     color : #900;
2104 }
2105
2106 .lost {
2107     color : #666;
2108 }
2109
2110 .suggestion {
2111     background-color : #EEEEEB;
2112     border : 1px solid #DDDED3;
2113     margin : 1em auto;
2114     padding : .5em;
2115     width : 35%;
2116     .border-radius-all(3px);
2117 }
2118
2119 .librarypulldown .transl1 {
2120     width : auto;
2121 }
2122
2123 .nolibrarypulldown {
2124     width : 68%;
2125 }
2126
2127 .nolibrarypulldown .transl1 {
2128     width : 87%;
2129 }
2130
2131 #opac-main-search {
2132     select {
2133         width : auto;
2134         max-width: 12em;
2135     }
2136 }
2137
2138 #logo {
2139     background:transparent url("../images/koha-logo-navbar.png") no-repeat scroll 0%;
2140     border: 0;
2141     float : left !important;
2142     margin:0;
2143     padding:0;
2144     width:100px;
2145     a {
2146         border:0;
2147         cursor:pointer;
2148         display:block;
2149         height:0px !important;
2150         margin:0;
2151         overflow:hidden;
2152         padding:40px 0 0;
2153         text-decoration:none;
2154         width:100px;
2155     }
2156 }
2157
2158 #user-menu-trigger {
2159     display: none;
2160     .icon-user {
2161         background: transparent url("../lib/bootstrap/img/glyphicons-halflings-white.png") no-repeat;
2162         background-position: -168px 0;
2163         background-repeat: no-repeat;
2164         height: 14px;
2165         line-height: 14px;
2166         margin : 12px 0 0;
2167         vertical-align: text-top;
2168         width: 14px;
2169     }
2170     .caret {
2171         border-bottom-color: #999999;
2172         border-top-color: #999999;
2173         margin-top: 18px;
2174     }
2175 }
2176
2177 /* Class to be added to toolbar when it starts being fixed at the top of the screen*/
2178 .floating {
2179     -webkit-box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, .4);
2180     box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, .4);
2181     margin-top: 0;
2182 }
2183
2184 .tdlabel {
2185     font-weight: bold;
2186     display: none;
2187 }
2188
2189 td img {
2190     max-width: none;
2191 }
2192
2193 #ulactioncontainer {
2194     min-width: 16em;
2195 }
2196
2197 .notesrow {
2198     label {
2199         font-weight: bold;
2200     }
2201     span {
2202         display: block;
2203     }
2204 }
2205
2206 .thumbnail-shelfbrowser span {
2207     margin: 0px auto;
2208 }
2209
2210 .dropdown-menu > li > a.menu-inactive:hover {
2211     background : #FFF none;
2212     color : #000;
2213 }
2214
2215 .table {
2216     .sorting_asc {
2217         padding-right: 19px;
2218         background: url("../images/asc.gif") no-repeat scroll right center #ECEDE6;
2219     }
2220     .sorting_desc {
2221         padding-right: 19px;
2222         background: url("../images/desc.gif") no-repeat scroll right center #ECEDE6;
2223     }
2224     .sorting {
2225         padding-right: 19px;
2226         background: url("../images/ascdesc.gif") no-repeat scroll right center #ECEDE6;
2227     }
2228     .nosort,
2229     .nosort.sorting_asc,
2230     .nosort.sorting_desc,
2231     .nosort.sorting {
2232         padding-right: 19px;
2233         background: #ECEDE6 none;
2234     }
2235     th,
2236     td {
2237         line-height: 135%;
2238     }
2239 }
2240 .tags, .shelves {
2241     ul {
2242         display: inline;
2243         list-style: none;
2244         margin-left : 0;
2245         li {
2246             display: inline;
2247         }
2248     }
2249 }
2250 .coverimages {
2251     float : right;
2252 }
2253 #i18nMenu {
2254     margin-left : 1em;
2255     li {
2256         font-size : 85%;
2257         li {
2258             font-size: 100%;
2259         }
2260         li > a {
2261             font-size : 100%;
2262             &:hover {
2263                 color : #FFF;
2264             }
2265         }
2266         a {
2267             color : @links;
2268         }
2269     }
2270     .dropdown-menu {
2271         li {
2272             p {
2273                 clear: both;
2274                 display: block;
2275                 font-weight: normal;
2276                 line-height: 20px;
2277                 padding: 3px 20px;
2278                 white-space: nowrap;
2279             }
2280         }
2281     }
2282 }
2283
2284 #subjectsList,
2285 #authorSearch {
2286     label {
2287         display :inline;
2288         vertical-align: middle;
2289     }
2290     ul {
2291         border-bottom: 1px solid #EEE;
2292         list-style-type: none;
2293         margin: 0;
2294         padding: .6em 0;
2295     }
2296     li {
2297         list-style-type: none;
2298         margin: 0;
2299         padding: 0;
2300     }
2301 }
2302
2303
2304 #overdrive-results, #openlibrary-results {
2305     font-weight: bold;
2306     padding-left: 1em;
2307 }
2308
2309 .throbber {
2310     vertical-align: middle;
2311 }
2312
2313 #overdrive-results-list .star-rating-control {
2314     display: block;
2315     overflow: auto;
2316 }
2317
2318 #shelfbrowser {
2319     table {
2320         margin : 0;
2321     }
2322     table,
2323     td,
2324     th {
2325         border : 0;
2326         font-size : 90%;
2327         text-align : center;
2328     }
2329     td,
2330     th {
2331         padding: 3px 5px;
2332         width : 20%;
2333     }
2334     a {
2335         display : block;
2336         font-size : 110%;
2337         font-weight : bold;
2338         text-decoration : none;
2339     }
2340     #browser_next,
2341     #browser_previous {
2342         background-image : url("../images/sprite.png");
2343         background-repeat: no-repeat;
2344         width : 16px;
2345         a {
2346             cursor: pointer;
2347             display : block;
2348             height: 0 !important;
2349             margin: 0;
2350             overflow: hidden;
2351             padding: 50px 0 0;
2352             text-decoration: none;
2353             width: 16px;
2354         }
2355     }
2356     #browser_previous {
2357         background-position: -9px -1007px;
2358     }
2359     #browser_next {
2360         background-position: -9px -1057px;
2361     }
2362 }
2363
2364 #holds {
2365     margin : 0 auto;
2366     max-width: 800px;
2367 }
2368 .holdrow {
2369     clear : both;
2370     padding: 0 1em 1em 1em;
2371     border-bottom:1px solid #CCC;
2372     margin-bottom:.5em;
2373     fieldset {
2374         border : 0;
2375         margin : 0;
2376         float: none;
2377         .label {
2378             font-size: 14px;
2379         }
2380     }
2381     label {
2382         display: inline;
2383     }
2384 }
2385 .hold-options {
2386     clear : both;
2387 }
2388 .toggle-hold-options {
2389     background-color: #eee;
2390     clear : both;
2391     display : block;
2392     font-weight : bold;
2393     margin: 1em 0;
2394     padding: .5em;
2395 }
2396 .copiesrow {
2397     clear : both;
2398 }
2399
2400 #idreambooksreadometer {
2401     float: right;
2402 }
2403
2404 a.idreambooksrating {
2405     font-size: 30px;
2406     color: #29ADE4;
2407     padding-left: 85px;
2408     line-height: 30px;
2409     text-decoration: none;
2410 }
2411
2412 .idreambookslegend {
2413     font-size: small;
2414 }
2415
2416 a.reviewlink,
2417 a.reviewlink:visited {
2418     text-decoration: none;
2419     color: black;
2420     font-weight: normal;
2421 }
2422
2423 .idreambookssummary a {
2424     color: #707070;
2425     text-decoration: none;
2426 }
2427
2428 .idreambookssummary img,
2429 .idbresult img {
2430     vertical-align: middle;
2431 }
2432
2433 .idbresult {
2434     color: #29ADE4;
2435     text-align: center;
2436     margin: 0.5em;
2437     padding: 0.5em;
2438 }
2439
2440 .idbresult a,
2441 .idbresult a:visited {
2442     text-decoration: none;
2443     color: #29ADE4;
2444 }
2445
2446 .idbresult img {
2447     padding-right: 6px;
2448 }
2449
2450 .js-show {
2451     display: none;
2452 }
2453
2454 .modal-nojs {
2455     .modal-header,
2456     .modal-footer {
2457         display: none;
2458     }
2459 }
2460
2461 .contents {
2462     width: 75%;
2463 }
2464
2465
2466 .contentblock {
2467     font-size : 95%;
2468     line-height: 135%;
2469     position: relative;
2470     margin-left: 2em;
2471 }
2472
2473 .contents {
2474     .t:first-child:before {
2475         content: "→ ";
2476     }
2477     .t:before {
2478         content: "\A → ";
2479         white-space: pre;
2480     }
2481     .t {
2482         font-weight: bold;
2483         display: inline;
2484     }
2485     .r {
2486         display: inline;
2487     }
2488 }
2489
2490 .m880 {
2491     display:block;
2492     text-align:right;
2493     float:right;
2494     width:50%;
2495     padding-left:20px;
2496 }
2497
2498 #memberentry-form input.error {
2499     border-color: #c00;
2500     box-shadow: 0 1px 1px #c00 inset, 0 0 8px #c00;
2501     color: red; outline: 0 none;
2502 }
2503
2504 #memberentry-form input.error:focus {
2505     border-color: #c00;
2506     box-shadow: 0 1px 1px #c00 inset, 0 0 8px #c00;
2507     color: red; outline: 0 none;
2508 }
2509
2510 #memberentry-form label.error {
2511     color: #c00; float: none;
2512     font-size: 90%;
2513 }
2514
2515 #illrequests {
2516     .illrequest-actions {
2517         .btn,
2518         .cancel {
2519             margin-right: 5px;
2520         }
2521         padding-top: 20px;
2522         margin-bottom: 20px;
2523     }
2524     #illrequests-create-button {
2525         margin-bottom: 20px;
2526     }
2527     .bg-info {
2528         overflow: auto;
2529         position: relative;
2530     }
2531     .bg-info {
2532         #search-summary {
2533             -webkit-transform: translateY(-50%);
2534             -ms-transform: translateY(-50%);
2535             -o-transform: translateY(-50%);
2536             transform: translateY(-50%);
2537             position: absolute;
2538             top: 50%;
2539         }
2540
2541     }
2542     #freeform-fields .custom-name {
2543         float: left;
2544         width: 8em;
2545         margin-right: 1em;
2546         text-align: right;
2547     }
2548     .dropdown:hover .dropdown-menu.nojs {
2549         display: block;
2550     }
2551 }
2552
2553 #dc_fieldset {
2554     border: 1px solid #dddddd;
2555     border-width: 1px;
2556     padding: 5px;
2557     border-radius: 10px
2558 }
2559
2560 .label_dc{
2561     display: inline;
2562     padding: 0px;
2563     margin: 0px;
2564     cursor: pointer;
2565 }
2566
2567 .btn-danger {
2568     color: white !important;
2569 }
2570
2571 .count_label {
2572     @base: #369;
2573     background-color: @base;
2574     border-radius: 5px;
2575     color: #FFF;
2576     display: inline-block;
2577     font-weight: bold;
2578     min-width: 1.5em;
2579     padding: .2em;
2580     text-align: center;
2581     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
2582
2583     &:hover {
2584         background-color: lighten( @base, 20% );
2585     }
2586 }
2587
2588 .user_checkouts_count {
2589
2590 }
2591
2592 .user_overdues_count,
2593 .user_fines_count {
2594     background-color: #990000;
2595     &:hover {
2596         background-color: lighten( #990000, 10% );
2597     }
2598 }
2599
2600 .user_holds_pending_count {
2601
2602 }
2603
2604 .user_holds_waiting_count {
2605     background-color: #538200;
2606     &:hover {
2607         background-color: lighten( #538200, 10% );
2608     }
2609 }
2610
2611 #user_summary {
2612     border: 1px solid #EAEAE6;
2613     border-radius: 7px;
2614     margin-bottom: 1em;
2615     padding-bottom: .5em;
2616
2617     h3 {
2618         background-color: #EAEAE6;
2619         border-top-left-radius: 6px;
2620         border-top-right-radius: 6px;
2621         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2);
2622         margin-top: 0;
2623         padding: .2em 0;
2624         text-align: center;
2625     }
2626
2627     ul {
2628         list-style-type: none;
2629         margin: 0 0 .2em 0;
2630
2631         a {
2632             display: block;
2633             font-weight: bold;
2634             padding: .2em 1em;
2635         }
2636     }
2637 }
2638
2639
2640
2641 @import "responsive.less";