Bug 25727: (follow-up) Use CSS specificity rather than !important
[koha-ffzg.git] / koha-tmpl / intranet-tmpl / prog / css / src / staff-global.scss
index 1eb1643..64f79cd 100644 (file)
@@ -1,22 +1,5 @@
-@import url("../../lib/yui/reset-fonts-grids.css") screen;
-
-$font-main: Arial, Verdana, Helvetica, sans-serif;
-$font-monospace: "Courier New", Courier, monospace;
-
-@mixin default-button {
-    background: linear-gradient(to bottom, #FFFFFF 0%, #F7F7F7 35%, #E0E0E0 100%);
-    border: 1px outset #999999;
-    border-left-color: #666;
-    border-top-color: #666;
-    color: #333333;
-    padding: .25em;
-}
-
-@mixin disabled-button {
-    background: #EEE none;
-    border: 1px solid #C0C0C0;
-    color: #999;
-}
+@import "mixins";
+@import "tables";
 
 ::selection {
     background: #538200;
@@ -90,11 +73,6 @@ a {
         color: #666;
     }
 
-    &.popup {
-        background: transparent url("../img/pop-up-link.png") center right no-repeat;
-        padding-right: 15px;
-    }
-
     &.disabled {
         color: #999999;
     }
@@ -154,7 +132,7 @@ aside {
 
     fieldset {
         &.brief {
-            margin: 0;
+            margin: 0 0 1em 0;
             padding: .4em .7em;
 
             fieldset {
@@ -162,7 +140,8 @@ aside {
                 padding: .5em 0;
 
                 legend {
-                    font-size: 85%;
+                    font-size: 95%;
+                    margin: 0;
                 }
             }
 
@@ -170,6 +149,7 @@ aside {
                 &.checkbox {
                     label {
                         display: inline;
+                        margin-left: 0;
                     }
                 }
 
@@ -205,7 +185,6 @@ aside {
             }
 
             ol {
-                font-size: 85%;
                 margin: 0;
                 padding: 0;
             }
@@ -214,6 +193,11 @@ aside {
             [type="text"] {
                 width: 100%;
             }
+
+            .hasDatepicker {
+                margin-right: 3px;
+                width: calc(100% - 20px);
+            }
         }
     }
 }
@@ -238,112 +222,17 @@ button {
 }
 
 main {
-    .yui-b {
-        fieldset {
-            &.brief {
-                [type="text"],
-                select {
-                    width: auto;
-                }
-            }
-        }
-    }
-}
-
-table {
-    border-collapse: collapse;
-    border-right: 1px solid #BCBCBC;
-    border-top: 1px solid #BCBCBC;
-
-    .btn-group {
-        white-space: nowrap;
-
-        .btn {
-            display: inline-block;
-            float: none;
-        }
-    }
-
-    &.indexes {
-        td {
-            vertical-align: middle;
-        }
-    }
-
-    > caption {
-        span {
-            &.actions {
-                font-size: 66%;
-                font-weight: normal;
-                margin: 0 .5em 0 0;
-            }
-        }
-    }
-
-    &.invis {
-        border: 0;
-
-        tr,
-        td {
-            border: 0;
-        }
-    }
-
-    + table {
-        margin-top: 1em;
-    }
-}
-
-td,
-th {
-    border-bottom: 1px solid #BCBCBC;
-    border-left: 1px solid #BCBCBC;
-    padding: .2em .3em;
-}
-
-td {
-    background-color: #FFFFFF;
-    vertical-align: top;
-
-    &.actions {
-        white-space: nowrap;
-    }
-
-    &.borderless {
-        border: 0 none;
-        border-collapse: separate;
-    }
-
-    &.data {
-        font-family: $font-monospace;
-        text-align: right;
-    }
-
-    &.total {
-        text-align: right;
-    }
-
-    input {
-        &.approve {
-            background-color: #FFC;
-        }
-    }
-}
-
-
-th {
-    background-color: #E8E8E8;
-    font-weight: bold;
-    text-align: center;
-
-    &.data {
-        font-family: $font-monospace;
-        text-align: right;
+    &::after {
+        clear: both;
+        content: " ";
+        display: table;
     }
 }
 
 body {
     font-family: $font-main;
+    font-size: 13px;
+    line-height: 1.22;
     padding: 0 0 4em;
     text-align: left;
 }
@@ -360,7 +249,34 @@ form {
 
     &.confirm {
         display: block;
-        text-align: center;
+        font-size: 110%;
+        line-height: 130%;
+
+        ul {
+            padding: 1em 0;
+
+            li {
+                list-style-type: none;
+            }
+        }
+
+        .notification_method {
+            background-color: #FFE;
+            border: 1px solid #CCC;
+            border-radius: 5px;
+            display: inline-block;
+            margin: .5em 0;
+            padding: .1em .3em;
+
+            &.none {
+                background-color: #EEE;
+            }
+        }
+
+        .hold-found-barcode {
+            display: inline-block;
+            font-size: 90%;
+        }
     }
 }
 
@@ -441,13 +357,9 @@ cite {
 
 input,
 textarea {
-    line-height: normal;
-    padding: 2px 4px;
-
     &:focus {
         border-color: #538200;
         border-radius: 4px;
-        border-style: solid;
     }
 }
 
@@ -479,11 +391,6 @@ input {
         }
     }
 
-    &.alert {
-        background-color: #FFFF99;
-        border-color: #900;
-    }
-
     &.submit {
         @include default-button;
 
@@ -495,11 +402,11 @@ input {
             @include disabled-button;
         }
     }
+}
 
-    &.warning {
-        background: #FFF url("../img/famfamfam/silk/error.png") no-repeat 4px center;
-        padding: .25em .25em .25em 25px;
-    }
+.input-warning {
+    background-color: #FF9;
+    border-color: #900;
 }
 
 label,
@@ -522,21 +429,11 @@ label,
     }
 
     &.circ_barcode {
+        display: inline-block;
         font-size: 105%;
         font-weight: bold;
-    }
-
-    // Permissions Labels
-    &.permissioncode {
-        font-style: italic;
-
-        &::before {
-            content: "(";
-        }
-
-        &::after {
-            content: ")";
-        }
+        margin-bottom: 1rem;
+        max-width: 75%;
     }
 
     &.required {
@@ -574,14 +471,8 @@ label,
     }
 }
 
-#doc,
-#doc1,
-#doc2,
-#doc3 {
-    padding-top: 1em;
-}
-
 .main {
+    margin-bottom: $language-footer-min-height * 1.5;
     margin-top: 1em;
 }
 
@@ -672,22 +563,6 @@ ol {
     &.bibliodetails {
         float: left;
         margin: 0 0 1em 1em;
-
-        li {
-            border-bottom: 1px solid #E8E8E8;
-            list-style-type: none;
-            padding: .1em;
-        }
-
-        span {
-            &.label {
-                border-right: 1px solid #E8E8E8;
-                float: left;
-                font-weight: bold;
-                margin-right: 1em;
-                width: 12em;
-            }
-        }
     }
 }
 
@@ -710,23 +585,6 @@ ol {
     }
 }
 
-.highlighted-row,
-.highlighted-row td {
-    background-color: #FFD000 !important;
-}
-
-tbody {
-    tr {
-        &:nth-child(odd) {
-            td {
-                background-color: #F3F3F3;
-                border: 1px solid #BCBCBC;
-                border-right: 1px solid #BCBCBC;
-            }
-        }
-    }
-}
-
 .overdue,
 .debit {
     color: #CC0000;
@@ -737,120 +595,6 @@ tbody {
     font-weight: bold;
 }
 
-tr {
-    &.clickable {
-        cursor: pointer;
-    }
-
-    &.expired {
-        td {
-            color: #999999;
-        }
-    }
-
-    &.highlight {
-        td {
-            background-color: #F6F6F6;
-            border-color: #BCBCBC;
-        }
-
-        th {
-            &[scope="row"] {
-                background-color: #DDDDDD;
-                border-color: #BCBCBC;
-            }
-        }
-
-        table {
-            &.invis {
-                td {
-                    border: 0;
-                }
-            }
-        }
-    }
-
-    &.odd {
-        &.onissue {
-            td {
-                background-color: #FFFFE1;
-            }
-        }
-    }
-
-    &.ok {
-        td {
-            background-color: #FFFFCC;
-        }
-
-        &:nth-child(odd) {
-            td {
-                background-color: #FFFFCC;
-            }
-        }
-
-        &:nth-child(even) {
-            td {
-                background-color: #FFFFCC;
-            }
-        }
-    }
-
-    &.onissue {
-        td {
-            background-color: #FFFFCC;
-        }
-    }
-
-    &.reserved {
-        td {
-            background-color: #EEFFD4;
-        }
-    }
-
-    &.transfered {
-        td {
-            background-color: #E8F0F6;
-        }
-    }
-
-    &.warn {
-        td {
-            background-color: #FF9090;
-        }
-
-        &:nth-child(odd) {
-            td {
-                background-color: #FF9090;
-            }
-        }
-    }
-}
-
-.table_borrowers {
-    tr {
-        &:hover {
-            td {
-                background-color: #FFFF99;
-            }
-        }
-    }
-}
-
-tfoot {
-    td {
-        background-color: #F3F3F3;
-        font-weight: bold;
-    }
-}
-
-caption {
-    color: #000;
-    font-size: 133.9%;
-    font-weight: bold;
-    margin: .3em 0;
-}
-
 .problem {
     background-color: #FFFFCC;
     color: #990000;
@@ -871,11 +615,12 @@ fieldset {
         }
     }
 
-    .lastchecked {
+    &.lastchecked {
         border-bottom-left-radius: 0;
         border-bottom-right-radius: 0;
         border-bottom-width: 0;
         margin-bottom: 0;
+        margin-right: 0;
     }
 
     .standard {
@@ -951,6 +696,10 @@ fieldset {
                 text-align: left;
             }
         }
+
+        .action {
+            margin-left: 1em;
+        }
     }
 
     &.rows {
@@ -1004,7 +753,7 @@ fieldset {
             border-top-right-radius: 0;
             margin: 0;
             padding: 0;
-            width: auto;
+            width: 100%;
 
             table {
                 margin: 0;
@@ -1023,7 +772,7 @@ fieldset {
 
         div {
             &.hint {
-                margin-bottom: .4em;
+                margin: .5em 0;
                 margin-left: 10.5em;
             }
         }
@@ -1047,6 +796,13 @@ fieldset {
                 margin-left: 1em;
             }
 
+            &.radio {
+                display: inline-block;
+                margin: 0 1em 0 0;
+                padding: 0;
+                width: auto;
+            }
+
             &.yesno {
                 float: none;
                 width: auto;
@@ -1071,6 +827,7 @@ fieldset {
             }
 
             &.radio {
+                margin: 0;
                 padding-left: 9em;
                 width: auto;
 
@@ -1141,6 +898,10 @@ fieldset {
             font-size: 105%;
             margin: 1em 0 1em 1em;
 
+            &.dataTable {
+                margin: 0;
+            }
+
             &.mceListBox {
                 margin: 0;
             }
@@ -1164,6 +925,13 @@ fieldset {
             clear: both;
             padding-top: .5em;
         }
+
+        .dataTables_wrapper {
+            label {
+                font-weight: 400;
+                width: unset;
+            }
+        }
     }
 }
 
@@ -1177,55 +945,15 @@ fieldset {
     }
 }
 
-.yui-u {
-    div {
-        &.hint {
-            margin-bottom: .4em;
-        }
-    }
-
-    fieldset {
-        &.rows {
-            div {
-                &.hint {
-                    margin-left: 7.5em;
-                }
-            }
-
-            label {
-                width: 10em;
-            }
-
-            span {
-                &.label {
-                    width: 10em;
-                }
-            }
-        }
-    }
-
-    .rows {
-        li {
-            p {
-                label {
-                    &.widelabel {
-                        width: auto;
-                    }
-                }
-            }
-        }
-    }
-}
-
-legend {
-    background-color: #FFFFFF;
-    border: 2px solid #B9D8D9;
-    border-radius: 3px;
-    font-size: 123.1%;
-    font-weight: bold;
-    padding: .2em .5em;
-    width: auto;
-}
+legend {
+    background-color: #FFFFFF;
+    border: 2px solid #B9D8D9;
+    border-radius: 3px;
+    font-size: 123.1%;
+    font-weight: bold;
+    padding: .2em .5em;
+    width: auto;
+}
 
 details {
     > summary {
@@ -1266,22 +994,17 @@ details[open] {
 #breadcrumbs {
     background-color: #E6F0F2;
     clear: both;
-    font-size: 90%;
     margin: 0;
-    padding: .2em .5em .4em 10px;
-}
-
-#header {
-    &.navbar {
-        margin-bottom: 0;
-    }
+    padding: .8em .5em .8em 10px;
+    position: relative;
 
-    &.navbar-default {
-        background: #E6F0F2;
-        border: 0;
-        box-shadow: none;
+    .title {
+        font-size: unset;
+        font-weight: normal;
     }
+}
 
+#header {
     + #breadcrumbs {
         margin-top: 1em;
     }
@@ -1397,7 +1120,8 @@ div {
         }
 
         input {
-            font-size: 80%;
+            font-size: 90%;
+            padding: .2em .6em;
         }
     }
 
@@ -1436,8 +1160,7 @@ div {
             clear: left;
             float: left;
             list-style-type: none;
-            padding-bottom: .2em;
-            padding-top: .1em;
+            padding: .275em;
             width: 100%;
         }
 
@@ -1452,6 +1175,10 @@ div {
             }
         }
 
+        p {
+            margin-left: 10em;
+        }
+
         span {
             &.label {
                 float: left;
@@ -1512,10 +1239,9 @@ div {
     margin: .3em 0 .5em;
 
     input {
-        font-size: 1.3em;
-
-        &.submit {
-            font-size: 1em;
+        &[type="submit"] {
+            border-radius: 3px;
+            padding: .2em .8em;
         }
     }
 
@@ -1577,11 +1303,11 @@ div {
             display: block;
         }
     }
-}
-
 
-.head-searchbox {
-    width: 30em;
+    .head-searchbox {
+        font-size: 1.3em;
+        width: 30em;
+    }
 }
 
 #reserves,
@@ -1592,7 +1318,6 @@ div {
 
 .tip {
     color: #808080;
-    font-size: 93%;
 }
 
 .single-line {
@@ -1622,6 +1347,17 @@ dd {
     border-radius: 5px 5px 0 0;
     margin: 0;
     padding: 5px;
+
+    .dropdown-menu {
+        border-top-width: 1px;
+        font-size: 13px;
+    }
+
+    &.floating {
+        border-radius: 0;
+        margin-top: 0;
+        z-index: 300;
+    }
 }
 
 #disabled {
@@ -1673,24 +1409,86 @@ dd {
     + #menu {
         margin-right: 0;
     }
+
+    > div {
+        border-right: 1px solid #B9D8D9;
+        width: 100%;
+    }
 }
 
-#patronbasics {
-    div {
-        background: transparent url("../img/patron-blank.min.svg") 10px 5px no-repeat;
-        border: 1px solid #CCCCCC;
+.patroninfo-section {
+    padding: .5em;
+    margin: .5em;
+
+    .rows {
+        padding: .5em;
+    }
+}
+
+.patroninfo-heading {
+    background-color: rgba(237, 244, 246, .4);
+    padding: .5em;
+    margin-bottom: .3em;
+    clear: both;
+
+    h3 {
+        display: inline-block;
+    }
+
+    .btn {
+        float: right;
+    }
+}
+
+/* Patron image */
+
+.patronimage-container {
+    padding: .2em;
+    position: relative;
+
+    &:hover {
+        .patronimage {
+            opacity: .8;
+        }
+
+        .patronimage-controls {
+            opacity: 1;
+        }
+    }
+}
+
+.patronimage {
+    border: 1px solid #EEE;
+    display: block;
+    max-width: 160px;
+    margin: auto;
+    opacity: 1;
+    transition: .2s ease;
+
+    &.empty {
+        background: transparent url( "../img/patron-blank.min.svg" ) center 5px no-repeat;
         height: 125px;
-        margin: .3em 0 .3em .3em;
         padding: 0;
-        width: 105px;
+        width: 80%;
     }
 }
 
-#patronimage {
-    border: 1px solid #CCCCCC;
-    margin: .3em 0 .3em .3em;
-    max-width: 140px;
-    padding: .2em;
+.patronimage-controls {
+    left: 50%;
+    opacity: 0;
+    position: absolute;
+    text-align: center;
+    top: 80%;
+    transform: translate( -50%, -50% );
+    transition: .5s ease;
+}
+
+.patronimage-control {
+    padding: 1em 2em;
+ }
+
+#patronImageEdit input[type="file" ] {
+    display: inline-block;
 }
 
 .patronviews {
@@ -1709,122 +1507,9 @@ dd {
     font-size: 95%;
 }
 
-.yui-b {
-    fieldset {
-        &.brief {
-            padding: .4em .7em;
-
-            fieldset {
-                margin: 0 .3em;
-                padding: .5em;
-
-                legend {
-                    font-size: 85%;
-                }
-            }
-
-            li {
-
-                &.checkbox {
-
-                    input {
-                        #tools_holidays & {
-                            margin-left: 0;
-                        }
-                    }
-
-                    label {
-                        display: inline;
-
-                        #tools_holidays & {
-                            margin-left: 20px;
-                        }
-                    }
-                }
-
-                &.dateinsert {
-                    label {
-                        display: inline;
-                    }
-
-                    span {
-                        &.label {
-                            display: inline;
-                        }
-                    }
-                }
-
-                &.radio {
-                    padding: .7em 0;
-
-                    input {
-                        padding: .3em 0;
-
-                        #tools_holidays & {
-                            margin-left: 0;
-                        }
-                    }
-
-                    label {
-                        display: inline;
-
-                        #tools_holidays & {
-                            margin-left: 20px;
-                        }
-
-                        span {
-                            &.label {
-                                display: inline;
-                            }
-                        }
-                    }
-                }
-            }
-
-            ol {
-                font-size: 85%;
-                margin: 0;
-                padding: 0;
-            }
-
-            select,
-            [type=text] {
-                width: 100%;
-            }
-        }
-
-        &.rows {
-            div {
-                &.hint {
-                    margin-left: 10.5em;
-                }
-            }
-
-            td {
-                label {
-                    width: auto;
-                }
-
-                span {
-                    &.label {
-                        width: auto;
-                    }
-                }
-            }
-        }
-    }
-}
-
-#yui-main {
-    .yui-b {
-        fieldset {
-            &.brief {
-                select,
-                [type=text] {
-                    width: auto;
-                }
-            }
-        }
+.dropdown-menu {
+    li {
+        list-style-type: none;
     }
 }
 
@@ -1846,6 +1531,21 @@ dd {
     }
 }
 
+.readonly,
+input[type='text']:read-only {
+    background: #EEE url("../img/locked.png") center left no-repeat;
+    border-style: inset;
+    border-width: 1px;
+    cursor: default;
+    padding-left: 15px;
+}
+
+.readonly:focus,
+input[type='text']:read-only:focus {
+    border-color: unset;
+    border-radius: unset;
+}
+
 .checkedout {
     color: #999999;
     font-style: italic;
@@ -1855,6 +1555,10 @@ dd {
     background-color: #FFFF99;
 }
 
+.important_subfield_not_filled {
+    background-color : #FFFFCC;
+}
+
 .content_hidden {
     display: none;
     visibility: hidden; // you propably don't need to change this one
@@ -1914,7 +1618,7 @@ i {
     }
 }
 
-.checkout-setting {
+.circ-setting {
     font-size: 85%;
     padding-top: .3em;
 
@@ -1928,7 +1632,7 @@ i {
     }
 }
 
-.checkout-settings {
+.circ-settings {
     background-color: #F4F8F9;
     border-radius: 0;
     border-top: 2px solid #B9D8D9;
@@ -1939,10 +1643,23 @@ i {
     padding: 1em 1em 0;
 }
 
-#show-checkout-settings {
+#show-circ-settings {
     margin-top: .5em;
 }
 
+.checkin-active-setting {
+    background-color: #FFC;
+    border-radius: 3px;
+    box-shadow: 1px 1px 2px 0 rgba(102, 102, 102, .5);
+    margin: .5em;
+    padding: .5em;
+}
+
+.form-control-group {
+    white-space: nowrap;
+}
+
+
 .blocker {
     color: #990000;
 }
@@ -2080,6 +1797,15 @@ i {
     }
 }
 
+.warning {
+    i {
+        &.fa-exclamation-triangle {
+            color: #FFD700;
+            text-shadow: 0 -1px 0 rgba( 0, 0, 0, .3);
+        }
+    }
+}
+
 .accesskey {
     text-decoration: underline;
 }
@@ -2095,7 +1821,6 @@ i {
 
 // style for shelving location in catalogsearch
 .shelvingloc {
-    display: block;
     font-style: italic;
 }
 
@@ -2228,9 +1953,28 @@ li {
 .thumbnail {
     display: block;
     margin: auto;
+}
 
-    > li {
+.thumbnails {
+    li {
+        display: inline-block;
         list-style-type: none;
+        margin: 4px;
+    }
+
+    .remove {
+        border-top: 1px solid #EEE;
+        display: block;
+        font-size: 90%;
+        margin: 4px -4px 2px -4px;
+        padding-top: .5em;
+        text-align: center;
+    }
+
+    & + p {
+        border-top: 1px solid #eee;
+        margin-top: 1em;
+        padding-top: 1em;
     }
 }
 
@@ -2247,34 +1991,50 @@ li {
                 margin: 3px 5px 3px -5px;
             }
         }
+    }
 
-        span {
-            &.status {
-                clear: left;
-                color: #900;
-                display: block;
-            }
-
-            &.unavailable {
-                clear: left;
-                display: block;
-            }
+    span {
+        &.status {
+            clear: left;
+            color: #900;
+            display: block;
         }
 
-        table {
-            td {
-                vertical-align: top;
-            }
+        &.unavailable {
+            clear: left;
+            display: block;
         }
     }
 
-    &.unavailability {
+    table {
+        td {
+            vertical-align: top;
+        }
+    }
+
+    &.unavailability {
         strong {
             display: block;
         }
     }
 }
 
+#searchresults {
+    .address {
+        ul {
+            margin: 0;
+            padding-left: 0;
+            li {
+                clear: none;
+                float: left;
+                list-style: none;
+                margin-left: 1ch;
+                padding: 0;
+            }
+        }
+    }
+}
+
 #searchheader {
     background-color: #E6F0F2;
     border: 1px solid #B9D8D9;
@@ -2361,25 +2121,58 @@ li {
     text-align: center;
 }
 
+.custom_cover_image {
+    img {
+        max-width: 140px;
+    }
+}
+
+.cover-slides {
+    background: #FFF url("[% interface | html %]/[% theme | html %]/img/spinner-small.gif") center center no-repeat;
+    border: 1px solid #b9d8d9;
+    border-radius: 3px;
+    margin: 5px;
+    padding: 10px 5px 5px 5px;
+    min-height: 175px;
+
+    .hint {
+        font-size: 90%;
+        padding: .5em 0;
+    }
+
+    a {
+        &.nav-active {
+            &:link,
+            &:visited {
+                color: #85ca11;
+            }
+        }
+    }
+}
+
+.cover-image {
+    display: none;
+
+    img {
+        height: auto;
+        max-width: 100%;
+    }
+}
+
+.cover-nav {
+    display: inline-block;
+    padding: 3px 4px;
+}
+
 .searchhighlightblob {
     font-size: 75%;
     font-style: italic;
 }
 
-#displayexample {
-    background-color: #CCCCCC;
-    margin-bottom: 10px;
-    padding: 5px;
-}
-
 #irregularity_summary {
     vertical-align: top;
 }
 
-#toplevelmenu {
-    padding: 0;
-}
-
 #CheckAll,
 #CheckNone,
 #CheckPending {
@@ -2469,15 +2262,40 @@ li {
 }
 
 .modal-dialog {
-    &.modal-wide {
-        width: 80%;
+    .dialog {
+        border-radius: 0;
+        border-width: 1px 0 0 0;
+        margin: 15px -15px -15px -15px;
+        padding: 15px;
+        text-align: left;
+        width: unset;
+
+        h3 {
+            margin: unset;
+            text-align: left;
+        }
+
+        &.alert {
+            background: #FFFADE none;
+            border-color: #E0C726;
+
+            .problem {
+                background-color: transparent;
+            }
+        }
+
+        &.message {
+            background: #E8EDF6 none;
+            border-color: #A4BEDD;
+
+            .problem {
+                background-color: transparent;
+            }
+        }
     }
-}
 
-@media (max-width: 767px) {
-    #marcPreview {
-        margin: 0;
-        width: auto;
+    &.modal-wide {
+        width: 80%;
     }
 }
 
@@ -2495,8 +2313,11 @@ li {
 }
 
 #cartmenulink {
-    background: transparent url("../img/cart-small.gif") left center no-repeat;
     padding-left: 15px;
+
+    i.fa.fa-shopping-cart {
+        padding-right: 7px;
+    }
 }
 
 #basketcount {
@@ -2683,35 +2504,26 @@ li {
     }
 }
 
-.pager {
-    background-color: #E8E8E8;
-    border: 1px solid #BCBCBC;
-    border-radius: 5px;
-    display: inline-block;
-    font-size: 85%;
-    margin: .4em 0;
-    padding: .3em .5em;
-
-    img {
-        vertical-align: middle;
+#printclearscreen {
+    position: absolute;
+    right: 43px;
+    top: 0;
 
-        &.last {
-            padding-right: 5px;
-        }
-    }
+    a {
+        background-color: #EEE;
+        border-radius: 0 0 0 5px;
+        color: #CCC;
+        display: block;
+        font-size: 160%;
+        font-weight: bold;
+        padding: 0 .7em .2em;
+        text-decoration: none;
+        text-shadow: 0 -1px 0 #666;
 
-    input {
-        &.pagedisplay {
-            background-color: transparent;
-            border: 0;
-            font-weight: bold;
-            text-align: center;
+        &:hover {
+            color: #CC0000;
         }
     }
-
-    p {
-        margin: 0;
-    }
 }
 
 .no-image {
@@ -2754,10 +2566,6 @@ li {
     }
 }
 
-.supplier-contact-details {
-    float: left;
-}
-
 #ADD-contact {
     margin: 0 0 8px 8px;
 }
@@ -2947,7 +2755,7 @@ li {
 }
 
 .statictabs {
-    ul {
+    ul {
         background: none repeat scroll 0 0 transparent;
         border: 0 none;
         border-bottom-left-radius: 4px;
@@ -3035,6 +2843,12 @@ li {
     }
 }
 
+.toptabs {
+        .ui-tabs-panel {
+            background: #FFF none;
+        }
+}
+
 .authref {
     font-style: normal;
     text-indent: 4em;
@@ -3168,7 +2982,6 @@ li {
 }
 
 .ui-datepicker-trigger {
-    margin: 0 3px;
     vertical-align: middle;
 }
 
@@ -3221,95 +3034,123 @@ video {
 }
 
 // Bootstrap overrides
-button,
-.btn {
-    border-color: #ADADAD #ADADAD #949494;
-    font-family: $font-main;
 
-    &.btn-link {
-        border: 0;
+.dropdown-header {
+    border-top: 1px solid #EEE;
+    color: #000;
+    font-weight: bold;
+    margin-top: 5px;
+    padding-left: 10px;
+
+    &:first-child {
+        border-top: 0;
     }
 }
 
-.btn-xs,
-.btn-group-xs > .btn {
-    font-size: 10.5px;
-    padding: 3px 5px;
+nav {
+    background: #E6F0F2 none;
+    border: 0;
 }
 
-#toolbar {
-    .dropdown-menu {
-        border-top-width: 1px;
-        font-size: 13px;
-    }
-
-    &.floating {
-        border-radius: 0;
-        margin-top: 0;
-    }
+.navbar-collapse {
+    background: #E6F0F2 none;
+    box-shadow: none;
 }
 
-.dropdown-menu {
-    border-color: rgba(0, 0, 0, .2);
-    border-top: 0;
-    font-size: 12px;
-
+.navbar-nav {
     li {
-        list-style: none outside none;
-
-        > a,
-        &.nav-header {
-            padding: 4px 20px;
-            cursor: pointer;
+        list-style: none;
 
-            &:hover,
-            &:focus {
-                background-image: linear-gradient(to bottom, #0088CC, #0077B3);
-                background-repeat: repeat-x;
-                color: #FFFFFF;
-                text-decoration: none;
+        &.open {
+            li {
+                a {
+                    font-weight: normal;
+                }
             }
         }
+
+        a {
+            font-weight: bold;
+            padding-bottom: .4em;
+            padding-top: .4em;
+        }
     }
 }
 
-.navbar {
-    color: #333;
-    min-height: 20px;
+.nav .open > a,
+.nav .open > a:hover,
+.nav .open > a:focus {
+    background-color: transparent;
+    border: 0;
+}
+
+.nav > li > a:hover,
+.nav > li > a:focus {
+    background-color: transparent;
+    text-decoration: none;
+}
 
-    .nav {
-        > li {
-            list-style: none outside none;
-            padding: 0 .6em;
+.pagination {
+    margin:.5em .8em;
 
-            > a {
-                color: #004D99;
-                font-weight: bold;
-                padding: .4em .2em;
+    .active {
+        a {
+            background-color: #5A9EAA;
+            border-color: #5A9EAA;
 
-                &:focus,
-                &:hover {
-                    color: #538200;
-                }
+            &:hover,
+            &:focus {
+                background-color: #5A9EAA;
+                border-color: #5A9EAA;
             }
         }
 
-        li {
-            .dropdown {
-                &.open > .dropdown-toggle:focus,
-                &.active > .dropdown-toggle:focus,
-                &.open.active > .dropdown-toggle:focus {
-                    background: #E6F0F2 none;
-                    box-shadow: none;
-                }
+        span {
+            background-color: #5A9EAA;
+            border-color: #5A9EAA;
+
+            &:hover,
+            &:focus {
+                background-color: #5A9EAA;
+                border-color: #5A9EAA;
             }
         }
     }
+}
+
+button,
+.btn {
+    border-color: #ADADAD #ADADAD #949494;
+    font-family: $font-main;
+
+    &.btn-link {
+        border: 0;
+    }
+}
 
+.btn-xs,
+.btn-group-xs > .btn {
+    font-size: 10.5px;
+    padding: 3px 5px;
+}
+
+#toolbar {
+    .dropdown-menu {
+        border-top-width: 1px;
+        font-size: 13px;
+    }
 
+    &.floating {
+        border-radius: 0;
+        margin-top: 0;
+    }
 }
 
 #changelanguage {
+    background: #FFF none;
+    border-top: 1px solid #EEE;
+    min-height: $language-footer-min-height;
+
     .dropdown-menu {
         > li {
             > a,
@@ -3327,6 +3168,14 @@ button,
             line-height: 20px;
         }
     }
+
+    .navbar-nav {
+        li {
+            a {
+                line-height: 20px;
+            }
+        }
+    }
 }
 
 .loggedout {
@@ -3335,16 +3184,6 @@ button,
     padding: .4em .2em;
 }
 
-.navbar-static-top {
-    .navbar-inner {
-        background: #E6F0F2 none;
-        border: 0;
-        box-shadow: none;
-        min-height: 0;
-        padding-left: 0;
-    }
-}
-
 .navbar-fixed-bottom {
     .navbar-inner {
         min-height: 0;
@@ -3467,6 +3306,14 @@ label {
 .modal-body {
     background-color: #FFF;
     overflow-y: auto;
+
+    fieldset,
+    ol {
+        background-color: transparent;
+        border: 0;
+        margin: 0;
+        padding: 0;
+    }
 }
 
 .modal-content {
@@ -3587,6 +3434,7 @@ progress {
 
 .floating {
     box-shadow: 0 3px 2px 0 rgba(0, 0, 0, .5);
+    z-index: 100;
 }
 
 .inline {
@@ -3617,16 +3465,26 @@ progress {
 }
 
 #browse-return-to-results {
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
+    background-color: #E8F0F6;
+    border: 1px solid #B9D8D9;
+    border-bottom-width: 0;
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
     display: block;
+    padding: .5em;
     text-align: center;
 }
 
 .browse-button {
+    background-color: #FFF;
+    border: 1px solid #B9D8D9;
     color: #004D99;
-    display: inline-block;
+    display: block;
+    overflow: hidden;
     padding: .4em .6em;
+    text-align: center;
+    white-space: nowrap;
+    width: 100%;
 
     &:hover {
         background: #FAFAFA;
@@ -3654,15 +3512,25 @@ span {
         font-weight: bold;
     }
 
-    &.permissiondesc {
-        font-weight: normal;
-    }
-
     &.required {
         color: #C00;
         font-style: italic;
         margin-left: .5em;
     }
+
+    &.important {
+        color: #EAC117;
+        font-style: italic;
+        margin-left: .5em;
+    }
+
+    &[class*=" label-"] {
+        color: #FFF;
+        display: inline;
+        font-size: 75%;
+        font-weight: normal;
+        padding: .2em .6em .3em;
+    }
 }
 
 
@@ -3680,34 +3548,13 @@ span {
     }
 }
 
-.browse-label,
-.browse-prev-next {
-    border: 1px solid #B9D8D9;
-}
-
-.browse-label {
-    background-color: #E8F0F6;
-    border-top-left-radius: 5px;
-    border-top-right-radius: 5px;
-}
-
-.browse-prev-next {
-    border-bottom-left-radius: 5px;
-    border-bottom-right-radius: 5px;
-    border-top-width: 0;
-}
-
-#browse-previous {
-    border-bottom-left-radius: 5px;
-    border-right: 1px solid #B9D8D9;
-    padding-right: 1em;
+#browse-previous {
+    border-bottom-width: 0;
 }
 
 #browse-next {
     border-bottom-right-radius: 5px;
-    border-top-width: 0;
-    float: right;
-    padding-right: 1em;
+    border-bottom-left-radius: 5px;
 }
 
 .loading-overlay {
@@ -3754,12 +3601,31 @@ span {
     }
 }
 
+input.renew {
+    margin-right: 1em;
+}
+
 .renewals {
     display: block;
     font-size: .8em;
     padding: .5em;
 }
 
+.dialog input#renewonholdduedate {
+    padding: 2px;
+}
+
+.date-select {
+    label {
+        display: inline-block;
+        width: 40%;
+    }
+}
+
+#newonholdduedate {
+    display: none;
+}
+
 #transport-types {
     padding-top: .5px;
 }
@@ -3875,6 +3741,15 @@ span {
     }
 }
 
+
+.form-message {
+    background-color: #FFF;
+    border: 1px solid #A4BEDD;
+    border-radius: 5px;
+    margin: 1em;
+    padding: .5em;
+}
+
 .modal-textarea {
     width: 98%;
 }
@@ -3901,52 +3776,11 @@ span {
     width: 12%;
 }
 
-.navbar-default {
-    .navbar-nav {
-        > .open {
-            > a {
-                &:hover,
-                &:focus {
-                    background: #E6F0F2 none;
-                    box-shadow: none;
-                }
-            }
-        }
-    }
-
-    &.navbar-fixed-bottom {
-        .navbar-nav {
-            > .open {
-                > a {
-                    &:hover,
-                    &:focus {
-                        background: transparent none;
-                        box-shadow: none;
-                    }
-                }
-            }
-        }
-    }
-}
-
 #interlibraryloans {
     #dataPreviewLabel {
         margin: .3em 0;
     }
 
-    h1 {
-        margin: 1em 0;
-    }
-
-    h2 {
-        margin-bottom: 20px;
-    }
-
-    h3 {
-        margin-top: 20px;
-
-    }
-
     .bg-info {
         overflow: auto;
         position: relative;
@@ -3998,30 +3832,40 @@ span {
         top: 50%;
         transform: translateY(-50%);
     }
-}
 
-#ill-view-panel {
-    margin-top: 15px;
+    #generic_confirm_search_count {
+        margin: 1em 0 1em 10em;
+    }
 
-    h3 {
-        margin-bottom: 10px;
+    #generic_confirm_search {
+        display: block;
+        visibility: hidden;
+        margin: 1em 0 1em 10em;
     }
 
-    h4 {
-        margin-bottom: 20px;
+    #partnerSearch {
+        .modal-dialog {
+            width: 50vw;
+        }
+        .modal-body {
+            max-height: 70vh;
+        }
     }
+}
+
+.ill-view-panel {
+    margin-top: 15px;
 
     .notesopac {
         display: inline-block;
     }
+}
 
-    .rows {
-        div {
-            height: 1em;
-            margin-bottom: 1em;
-        }
-    }
-
+#illfilter_dateplaced_start,
+#illfilter_datemodified_start,
+#illfilter_dateplaced_end,
+#illfilter_datemodified_end {
+    width: 80%;
 }
 
 #requestattributes {
@@ -4033,6 +3877,20 @@ span {
     width: 100% !important;
 }
 
+.ar-title, .hq-title {
+    .biblio-title {
+        font-weight: bold;
+    }
+}
+
+#ill-issue-title {
+    margin: 20px 0 30px 0;
+}
+
+.ill_availability_sourcename {
+    margin-top: 20px;
+}
+
 #stockrotation {
     h3 {
         margin: 30px 0 10px 0;
@@ -4155,6 +4013,15 @@ span {
     }
 }
 
+#payForm {
+    fieldset {
+        &.rows {
+            padding-left: 1em;
+            padding-right: 2em;
+        }
+    }
+}
+
 #helper {
     span {
         display: none;
@@ -4182,8 +4049,34 @@ span {
     }
 }
 
-// ==== MODULE LINKS - Start ====
+.lastborrower {
+    background-color: #E6F0F2;
+    border: 1px solid #95C6D0;
+    box-shadow: 1px 1px 1px 0 #999;
+    color: #CC0000;
+    margin: .4em 0;
+    padding: .3em .5em .3em .5em;
+}
 
+#lastborrower-ref {
+    border-radius: 5px 0px 0px 5px;
+    float: left;
+}
+
+#lastborrower-remove {
+    border-radius: 0px 5px 5px 0px;
+    cursor: pointer;
+    float: right;
+}
+
+#lastborrower-window {
+    display: none;
+    position: absolute;
+    right: 5px;
+    top: 0px;
+}
+
+/* ==== MODULE LINKS - Start ==== */
 .buttons-list {
     // List containing the module links
     margin-bottom: 30px;
@@ -4227,6 +4120,11 @@ span {
     margin:  .5em 0;
 }
 
+.columns-2 {
+    columns: 2 auto;
+    column-gap: 2.5em;
+}
+
 .columns-3 {
     columns: 3 auto;
     column-gap: 2.5em;
@@ -4239,7 +4137,6 @@ span {
 
 // ==== MODULE LINKS - End ====
 
-<<<<<<< HEAD
 #catalog-search-link {
     border-right: 1px solid lighten( #E6F0F2, 15% );
     padding-right: .3em;
@@ -4259,7 +4156,7 @@ span {
             border-left: 1px solid darken( #B4D2D8, 15% );
         }
     }
-=======
+}
 
 .adlibris-cover {
     max-height: 120px;
@@ -4267,7 +4164,6 @@ span {
 
 .adlibris-cover-big {
     max-height: 200px;
->>>>>>> Bug 8630 - Adlibris covers (intranet CSS)
 }
 
 #tools_holidays {
@@ -4279,64 +4175,271 @@ span {
     }
 }
 
+/* Permissions */
+
+#permissionstree {
+    display: inline-block;
+
+    label {
+        cursor: pointer;
+
+        &:hover {
+            color: #004d99;
+        }
+    }
+}
+
+.main_permission {
+    font-size: 110%;
+    font-weight: bold;
+}
+
+.permissioncode {
+    color: #666;
+    font-style: italic;
+}
+
+.permission-highlight {
+    background-color: #FFC !important;
+}
+
+.togglechildren_on,
+.togglechildren_off {
+    float: right;
+}
+
+.togglechildren_off,
+.children {
+    display: none;
+}
+
+.open {
+    .togglechildren_off {
+        display: inline;
+    }
+
+    .togglechildren_on {
+        display: none;
+    }
+}
+
+.parent {
+    border: 1px solid #DDD;
+    border-bottom-width: 0;
+    padding: 5px;
+
+    &:last-child {
+        border-bottom-width: 1px;
+    }
+
+    &:nth-child(odd) {
+        background-color: #F8F8F8;
+    }
+}
+
+
+.superlibrarian-hint {
+    color: #000;
+    padding: .2em 0;
+    text-indent: 2em;
+}
+
+.child-flags {
+    background-color: #FFF;
+    border: 1px solid #DDD;
+    border-bottom-width: 0;
+    margin: 0 5px 0 20px;
+    padding: 5px;
+
+    &:first-child {
+        margin-top: 10px;
+    }
+
+    &:last-child {
+        border-bottom-width: 1px;
+    }
+
+    &:nth-child(odd) {
+        background-color: #EEE;
+    }
+}
+
+.header-menu-link {
+    display: none;
+    font-weight: bold;
+    padding: .4em .6em;
+}
+
+#user-menu {
+    position: absolute;
+    right: 5px;
+    top: 0;
+}
+
+div#makechart ol li {
+    list-style: none;
+}
+
+div .suggestion_note {
+    background: transparent none;
+    border-style: dotted;
+    border-width: 1px 0 0 0;
+    font-size: 90%;
+    padding: 2px 0 0 0;
+
+    i {
+        color: #CCC;
+    }
+}
+
 @media (min-width: 200px) {
-    .navbar-nav > li {
-        float: left;
+
+}
+
+@media (max-width: 767px) {
+    .header-menu-link {
+        display: inline-block;
     }
 
-    .navbar-right {
-        float: right !important;
-        margin-right: -15px;
+    #catalog-search-link {
+        display: none;
+        padding: 0;
     }
 
-    .navbar-nav {
-        float: left;
-        margin: 0;
+    #cartmenulink {
+        background: transparent none;
+        padding-left: 1.5em;
+    }
+
+    #changelanguage {
+        li {
+            float: left;
+
+            li {
+                float: none;
+            }
+        }
 
         .open {
             .dropdown-menu {
                 background-color: #FFF;
-                border: 1px solid rgba(0, 0, 0, .15);
-                box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
-                float: left;
+                border: 1px solid #ccc;
                 position: absolute;
-                width: auto;
+            }
+        }
+    }
 
-                &.dropdown-menu-left {
-                    left: auto;
-                    right: 0;
-                }
+    #header {
+        background-color: #FFF;
+        border: 1px solid #CCC;
+        margin-bottom: 1em;
 
-                &.dropdown-menu-right {
-                    right: auto;
-                }
+        a {
+            font-weight: normal;
+            padding-left: 1.5em;
+
+            &:hover {
+                background-color: #0070A9;
+                color: #FFF;
             }
         }
-    }
 
-    .navbar-default {
-        .navbar-nav {
-            .open {
-                .dropdown-menu {
-                    > li {
-                        > a {
-                            &:hover,
-                            &:focus {
-                                background-color: #0081C2;
-                                background-image: linear-gradient(to bottom, #0088CC, #0077B3);
-                                background-repeat: repeat-x;
-                                color: #FFFFFF;
-                                text-decoration: none;
-                            }
-                        }
+        ul {
+            border: 0;
+            box-shadow: unset;
+            float: none;
+            left: auto;
+            position: relative;
+            right: auto;
+
+            &.dropdown-menu {
+                display: block;
+            }
+        }
+
+        .dropdown-menu {
+            li {
+                a {
+                    color: #004D99;
+
+                    &:hover {
+                        color: #FFF;
                     }
                 }
             }
         }
+
+        .dropdown-toggle {
+            display: none;
+        }
+    }
+
+    h1#logo {
+        float: none;
+        margin: auto;
+    }
+
+    #marcPreview {
+        margin: 0;
+        width: auto;
+    }
+
+    .navbar-fixed-bottom .nav > li {
+        border-right: 0;
+    }
+
+    #user-menu {
+        .open {
+            .dropdown-menu {
+                background-color: #FFF;
+                border: 1px solid #ccc;
+                position: absolute;
+            }
+        }
+
+        li {
+            float: left;
+
+            li {
+                float: none;
+            }
+        }
+    }
+}
+
+@media (max-width: 768px) {
+    .navbar-nav {
+        li {
+
+            a {
+                padding: .4em .6em;
+            }
+        }
+    }
+}
+
+@media only screen and ( max-width: 768px ) {
+    .browse-button {
+        display: inline-block;
+        width: 50%;
+    }
+
+    #browse-previous {
+        border-bottom-left-radius: 5px;
+        border-bottom-width: 1px;
+        border-right-width: 0;
+    }
+
+    #browse-next {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 5px;
     }
 }
 
 @media (min-width: 800px) {
+
+
+
     #helper {
         i {
             display: none;
@@ -4360,6 +4463,20 @@ span {
     }
 }
 
-div#makechart ol li {
-    list-style: none;
+@media only screen and ( min-width: 1200px ) {
+    .browse-button {
+        display: inline-block;
+        width: 50%;
+    }
+
+    #browse-previous {
+        border-bottom-left-radius: 5px;
+        border-bottom-width: 1px;
+        border-right-width: 0;
+    }
+
+    #browse-next {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 5px;
+    }
 }