
.qweri-content ::-moz-selection {
    background-color: #fae676;
    color: #000;
}

.qweri-content ::selection {
    background-color: #fae676;
    color: #000;
}

.qweri-content .annotation-pending {
    background-color: #fae676;
    color: #000;
}

.qweri-content .annotation-pending::-moz-selection {
    background-color: transparent;
}

.qweri-content .annotation-pending::selection {
    background-color: transparent;
}

.pdf-viewer-page:not(.canlii-preliminary-page) ::-moz-selection {
    background-color: rgba(250, 230, 118, .4);
    color: transparent;
}

.pdf-viewer-page:not(.canlii-preliminary-page) ::selection {
    background-color: rgba(250, 230, 118, .4);
    color: transparent;
}

/** TOOLTIP THEME for Tippy.js and
  *   MODAL THEME for Bootstrap's modal component
  */

.tippy-popper[x-placement^=bottom] .tippy-tooltip.annotation-theme [x-arrow] {
    border-bottom-color: #666;
}

.tippy-popper .tippy-tooltip.annotation-theme,
.annotation-modal.modal {
    border-radius: 4px;
    padding: 0;
    max-width: 50vw;
    width: auto;
}

.annotation-modal.modal {
    border: none;
}

.tippy-tooltip.annotation-theme .tooltip-title,
.annotation-modal.modal .modal-header {
    background-color: #666;
    border-radius: 4px 4px 0 0;
    color: #fff;
    font-size: 1em;
    font-weight: bold;
    line-height: 2;
    margin: 0;
    padding: 0 .75em;
    overflow: hidden;
    text-align: center;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
}

.annotation-modal.modal .modal-header .muted {
    color: #bbb;
    font-style: italic;
}

.tippy-tooltip.annotation-theme .tooltip-content,
.annotation-modal.modal .modal-body {
    max-width: 100%;
    padding: .5em .75em;
    position: relative;
}

.annotation-modal.modal .modal-body {
    max-height: 70vh;
}

.annotation-modal.modal .modal-footer {
    border-radius: 0 0 4px 4px;
    padding: .5em .75em;
    text-align: center;
}

.tippy-popper[x-placement^=bottom] .tippy-tooltip.annotation-link-theme [x-arrow] {
    border-bottom-color: #fff;
}

.tippy-popper .tippy-tooltip.annotation-link-theme {
    border-radius: 0;
    -webkit-box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, .4);
            box-shadow: 1px 1px 5px 1px rgba(0, 0, 0, .4);
    max-width: 90vw;
}

.tippy-tooltip.annotation-link-theme .tooltip-content {
    padding: 0;
}

.tippy-popper .link-a:empty{
    display: none !important;
}

.tippy-popper .link-a:empty + .link-pacifier {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.tippy-tooltip.annotation-link-theme .note-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
       -ms-flex-align: stretch;
          align-items: stretch;
    
    width: 100%;
    min-width: 10em;
    
    line-height: normal;
}

.tippy-tooltip.annotation-link-theme .link-pacifier {
    display: none;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    
    -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
    
    font-size: 1.3em;
    padding: .3em .5em;
}
.tippy-tooltip.annotation-link-theme .link-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    
    -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto;
    
    background-color: #999;
    color: white;
    
    font-size: 1.3em;
    padding: .3em .5em;
}

.tippy-tooltip.annotation-link-theme .link-a {
    -webkit-box-flex: 1;
            -ms-flex: 1 1 auto;
                flex: 1 1 auto;
    -ms-flex-item-align: center;
             align-self: center;
    
    padding: .3em .5em;
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    white-space: nowrap;
}

/* TinyMCE alterations */
.annotation-editor .annotation-rich-text {
    margin: 0 0 .5em;
}

.annotation-rich-text .mce-tinymce {
    box-sizing: border-box;
    width: 96vw;
    max-width: 100%;
}

.annotation-rich-text .mce-container.mce-toolbar-grp,
.annotation-rich-text .mce-container.mce-statusbar {
    background-color: #e5e5e5;
}

.annotation-rich-text .mce-btn-group:not(:first-child) {
    border-left: 1px solid #aaa;
}

.annotation-rich-text .mce-btn {
    background-color: transparent;
}

.annotation-rich-text .mce-btn:hover,
.annotation-rich-text .mce-btn:focus {
    background-color: #ccc;
    border-color: #bbb;
}

.annotation-rich-text .mce-btn.mce-active,
.annotation-rich-text .mce-btn.mce-active:hover {
    background-color: #aaa;
    border-color: #999;
}

.annotation-rich-text .mce-btn button {
    font-size: 12px;
    line-height: 16px;
    padding: 2px;
}

.annotation-rich-text .mce-btn .mce-ico {
    font-size: 16px;
    line-height: 16px;
    width: 16px;
    height: 16px;
}

.annotation-rich-text .mce-path {
    padding: 2px 4px;
}

.annotation-rich-text .mce-path-item,
.annotation-rich-text .mce-divider {
    font-size: 12px;
}


/* TOOLTIP TO ADD ANNOTATIONS */
.annotation-tooltip {
    border-radius: 4px;
    padding: 0;
    /*overflow: hidden;*/
}

.annotation-tooltip:focus {
    outline: 0;
}

.annotation-tooltip .annotation-choices,
.annotation-editor .color-choices {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0;
}

.annotation-tooltip .annotation-choices .choice,
.annotation-editor .color-choices .color {
    -webkit-box-flex: 1;
            -ms-flex: 1 0 auto;
                flex: 1 0 auto;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    
    border-radius: 4px;
    border: 2px solid #666;
    cursor: pointer;
    
    font-weight: bolder;
    
    width: 2em;
    height: 2em;
    padding-top: 1px;
    padding-bottom: 1px;
}


.annotation-choices .choice:not(:last-child) {
    margin-right: 1em;
}

.annotation-tooltip .selection-text {
    opacity: 0;
    position: absolute;
    bottom: -100%;
}

.color-choices .color:not(:last-child) {
    margin-right: .5em;
}

.annotation-tooltip .control-group {
    margin-bottom: 0;
}

.annotation-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-pack: start;
       -ms-flex-pack: start;
     justify-content: flex-start;

    max-width: 100%;
    width: 600px;
}

.annotation-modal .annotation-link {
    width: 22em;
}

.annotation-link .link-protocol {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    flex: 0 0 auto;
    padding: 0;
}

.annotation-link .link-protocol .protocol {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-pack: start;
       -ms-flex-pack: start;
     justify-content: flex-start;

    background-color: #eeeeee;
    border: 1px solid #ccc;
    border-radius: 4px 0 0 4px;
    border-right-width: 0;
    cursor: pointer;
    padding-right: 5px;
    text-shadow: 0 1px 0 #ffffff;
}

.control-group.error .annotation-link .link-protocol .protocol {
    color: #b94a48;
    background-color: #f2dede;
    border-color: #b94a48;
}

.annotation-link .protocol .toggle-indicator {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-align-items: center;
         -ms-flex-align: center;
            align-items: center;

    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;

    background-color: #e2e2e2;
    border-radius: 4px 0 0 4px;
    flex: 0 0 auto;
    width: 25px;
}

.control-group.error .annotation-link .protocol .toggle-indicator {
    background-color: #f4cdcd;
}

.annotation-link .protocol .toggle-indicator .caret {
    border-top-color: #333;
    margin: 0;
}
.control-group.error .annotation-link .protocol .toggle-indicator .caret {
    border-top-color: #b94a48;
    margin: 0;
}

.annotation-link .protocol .selected-protocol {
    flex: 1 0 auto;
    -ms-flex-item-align: center;
     -webkit-align-self: center;
             align-self: center;
    text-align: right;
    width: 7ex;
}

.annotation-link .link-protocol .protocols {
    border-radius: 4px 0 0 4px;
    min-width: auto;
    margin: 0;
    padding: 0;
    top: -1px;
    left: -1px;
    width: calc(100% + 2px);
}

.annotation-link .protocols .protocol-item {
    padding: 0;
    text-align: right;
}

.annotation-link .protocols .protocol-item:hover {
    background-color: #0081c2;
    color: #fff;
    text-shadow: none;
}

.annotation-link .protocols .protocol-item input[type='radio'] {
    display: none;
}

.annotation-link .protocols .protocol-item label {
    margin: 0;
    padding: 4px 5px 4px 25px;
}

.annotation-link.annotation-link .link {
    border-radius: 0 4px 4px 0;
    flex: 1 0 auto;
    margin: 0;
    width: auto;
}

.annotation-tooltip label.placeholder {
    color: #777;
    font-size: .85em;
    font-weight: bolder;
}

.annotation-tooltip input[type] {
    margin: 0;
}

.annotation-tooltip .help-block {
    margin: .5em 0 0;
}

/* ANNOTATION EDITION */

.annotation-modal form textarea {
    margin: 0;
    height: 100px;
    min-width: 400px;
    width: 100%;
}

.note-edit-input {
    padding-left: 1em;
}

.annotation-modal ul.color-choices {
    padding: 0;
}

/* Annotations in document text */

.zoupio-annotation,
.annotation-list .annotation-item {
    cursor: pointer;
}

/* initial, unselected colors */
.zoupio-annotation.red-annotation    { background-color: rgba(254, 155, 161, 0.4); }
.zoupio-annotation.orange-annotation { background-color: rgba(244, 157, 115, 0.4); }
.zoupio-annotation.yellow-annotation { background-color: rgba(250, 230, 118, 0.4); }
.zoupio-annotation.green-annotation  { background-color: rgba(188, 237,  60, 0.4); }
.zoupio-annotation.blue-annotation   { background-color: rgba(181, 213, 254, 0.4); }
.zoupio-annotation.purple-annotation { background-color: rgba(226, 185, 241, 0.4); }
.zoupio-annotation.link-annotation {
    background-color: #eef7fc;
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:      -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:         linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    
    color: #08c;

    position: relative;

    text-decoration: none;
    text-shadow: -1px -1px 0 #eef7fc,
                 -1px  1px 0 #eef7fc,
                  1px -1px 0 #eef7fc,
                  1px  1px 0 #eef7fc;
}
.zoupio-annotation.external-note { background-color: rgba(173, 232, 241, 0.4); }

.color-choices.disabled,
.color-choices.disabled .color {
    cursor: not-allowed;
}

.color-choices .color {
    color: transparent;
}

.color-choices .color.red,
.zoupio-annotation.red-annotation.selected {
    background-color: #fe9ba1;
}

.color-choices .color.orange,
.zoupio-annotation.orange-annotation.selected {
    background-color: #f49d73;
}

.color-choices .color.yellow,
.zoupio-annotation.yellow-annotation.selected {
    background-color: #fae676;
}

.color-choices .color.green,
.zoupio-annotation.green-annotation.selected {
    background-color: #bced3c;
}

.color-choices .color.blue,
.zoupio-annotation.blue-annotation.selected {
    background-color: #b5d5fe;
}

.color-choices .color.purple,
.zoupio-annotation.purple-annotation.selected {
    background-color: #e2b9f1;
}

.zoupio-annotation.link-annotation.selected {
    background-color: #eef7fc;
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:      -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:         linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    
    color: #08c;

    position: relative;

    text-decoration: none;
    text-shadow: -1px -1px 0 #eef7fc,
                 -1px  1px 0 #eef7fc,
                  1px -1px 0 #eef7fc,
                  1px  1px 0 #eef7fc;
}

.zoupio-annotation.external-note.selected {
    background-color: rgba(173, 232, 241, 1);
}
.zoupio-annotation.external-note.link-annotation.selected {
    background-color: rgba(173, 232, 241, 0.4);
}

.pdf-viewer-page:not(.canlii-preliminary-page) .zoupio-annotation.selected {
    color: black;
}

@supports (mix-blend-mode: multiply) {
    .pdf-viewer-page:not(.canlii-preliminary-page) .annotation-pending,
    .pdf-viewer-page:not(.canlii-preliminary-page) .zoupio-annotation,
    .pdf-viewer-page:not(.canlii-preliminary-page) .zoupio-annotation.selected {
        color: transparent;
        mix-blend-mode: multiply;
    }
}

.color-choices .color.red.selected {
    border-color: #cc7c81;
    color: #cc7c81;
}

.color-choices .color.orange.selected {
    border-color: #c27d5b;
    color: #c27d5b;
}

.color-choices .color.yellow.selected {
    border-color: #c7b75d;
    color: #c7b75d;
}

.color-choices .color.green.selected {
    border-color: #94ba2f;
    color: #94ba2f;
}

.color-choices .color.blue.selected {
    border-color: #91abcc;
    color: #91abcc;
}

.color-choices .color.purple.selected {
    border-color: #b393bf;
    color: #b393bf;
}

/* for the search results */

/* LIST OF ANNOTATIONS */

.annotation-list-display .notes-howto {
    
    margin: 20px auto;
    font-size: 90%;
    line-height: inherit;
    background-color: rgba(127,189,220,0.4);
    padding: .5em;
    text-align: center;
    border: 1px solid rgba(127,189,220, 1);
    border-radius: 3px;

}

.annotation-list-display .notes-howto p {
    margin-bottom: 0;
}

.annotation-list-display .pagination {
    
    text-align: center;
    
}

.annotation-list-display .annotation-list-print {
    color: #007ABD;
}

/* for the list of annotations */
ul.annotation-parents {
    margin-left: 0;
    list-style: none;
}

ul.annotation-parents > li {
    margin-left: 20px;
}

ol > ul.annotation-parents > li {
    margin-left: 0;
}

.annotation-list .annotation-item {
    font-size: 12px;
    border-color: rgba(139, 139, 139, .8);
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transition: -webkit-box-shadow 150ms linear;
         -o-transition: box-shadow 150ms linear;
            transition: box-shadow 150ms linear, -webkit-box-shadow 150ms linear;
}


.annotation-item:hover {
    -webkit-box-shadow: 4px 4px 10px -3px rgba(0, 0, 0, .4);
            box-shadow: 4px 4px 10px -3px rgba(0, 0, 0, .4);
    background-color: #f5f5f5;
}

.annotation-item.selected {
    -webkit-box-shadow: 4px 4px 10px -3px rgba(0, 0, 0, .8);
            box-shadow: 4px 4px 10px -3px rgba(0, 0, 0, .8);
    background-color: #f5f5f5;
}

.annotation-item.lost-true {
    background-color: #cacfce;
}


.annotation-item .search-result-container {
    border-bottom: 1px solid #888;
    margin: -9px 0 0;
    padding: 4px 0;
}

.annotation-item.selected .search-result-container {
    background-color: #e5e5e5;
    
    margin: -9px -9px 0;
    padding: 4px 9px;
}

.annotation-item .search-result-container .search-result-titles > ul {
    
    margin: 0;
    padding: 0;
    font-style: italic;
    
}

.annotation-item .search-result-container .search-result-titles > ul > li {
    
    line-height: 1.66666666em;
    
}

.annotation-item .search-result-container .search-result-titles > ul ul {
    margin: 0 0 0 1.2em;
}

.annotation-item .search-result-container .search-result-titles > ul ul li {
    line-height: 1.2em;
}

.annotation-item .highlighted-text {
    line-height: 1.5em;
    padding: .5em .5em .5em 1em;
    margin: 1em 0;
}

.annotation-item.red-annotation .highlighted-text {
    border-color: #fe9ba1;
    background-color: rgba(254, 155, 161, 0.4);
}

.annotation-item.orange-annotation .highlighted-text {
    border-color: #f49d73;
    background-color: rgba(244, 157, 115, 0.4);
}

.annotation-item.yellow-annotation .highlighted-text {
    border-color: #fae676;
    background-color: rgba(250, 230, 118, 0.4);
}

.annotation-item.green-annotation .highlighted-text {
    border-color: #bced3c;
    background-color: rgba(188, 237,  60, 0.4);
}

.annotation-item.blue-annotation .highlighted-text {
    border-color: #b5d5fe;
    background-color: rgba(181, 213, 254, 0.4);
}

.annotation-item.purple-annotation .highlighted-text {
    border-color: #e2b9f1;
    background-color: rgba(226, 185, 241, 0.4);
}

.annotation-item.link-annotation .highlighted-text {
    border-color: #08c;
    background-color: #eef7fc;
}

.annotation-item.link-annotation .highlighted-text span {
    background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:      -o-linear-gradient(bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    background-image:         linear-gradient(to top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 1px, #08c 1px, #08c 2px, rgba(0, 0, 0, 0) 2px);
    
    color: #08c;

    position: relative;

    text-decoration: none;
    text-shadow: -1px -1px 0 #eef7fc,
                 -1px  1px 0 #eef7fc,
                  1px -1px 0 #eef7fc,
                  1px  1px 0 #eef7fc;
}

.annotation-item.external-note .highlighted-text {
    border-color: rgba(173, 232, 241, 1);
    background-color: rgba(173, 232, 241, 0.4)
}

.annotation-item .annotation-comment {
    position: relative;
    word-wrap:break-word;
}

.annotation-item .annotation-comment p {
    margin: 0 0 .5em;
    line-height: 1.333333em;
}

.annotation-item .annotation-comment a {
    color: #08c;
    text-decoration: underline;
}

.annotation-item .annotation-comment .zoupio-tiny-mce-youtube,
.mce-content-body .zoupio-tiny-mce-youtube {
    width: 100%;
    height: auto;
}

.annotation-item .annotation-comment.compact {
    max-height: 10em;
    overflow-y: hidden;
}

.annotation-item .annotation-comment.compact::after {
    height: 3em;
    position: absolute;
    bottom: 0;
    width: 100%;
    content: '';
    background: linear-gradient(to bottom, rgba(245, 245, 245, 0) 0%, rgb(245, 245, 245) 100%);
}

.annotation-item .annotation-author {
    font-size: .833333em;
    font-style: italic;
    margin-top: 1em;
    text-align: right;
}

.annotation-item .annotation-controls {
    display: none;
    text-align: right;
}

.annotation-item.editable .annotation-controls {
    display: block;
}

/* **** Annotations stuff FIN **** */
/* ******************************* */
